https://www.sencelles.cat/wp-content/themes/enfold/config-template…/slideshow_accordion.js?ver=5.4.1

1(function($)
2{
3	"use strict";
4// -------------------------------------------------------------------------------------------
5// Aviaccordion Slideshow
6//
7// accordion slider script
8// -------------------------------------------------------------------------------------------
9
10	$.AviaccordionSlider = function(options, slider)
11	{
12	    this.$slider  	= $( slider );
13	    this.$inner	  	= this.$slider.find('.aviaccordion-inner');
14	    this.$slides	= this.$inner.find('.aviaccordion-slide');
15	    this.$images	= this.$inner.find('.aviaccordion-image');
16	    this.$last		= this.$slides.last();
17	    this.$titles  	= this.$slider.find('.aviaccordion-preview');
18	    this.$titlePos  = this.$slider.find('.aviaccordion-preview-title-pos');
19	    this.$titleWrap = this.$slider.find('.aviaccordion-preview-title-wrap');
20	    this.$win	  	= $( window );
21
22	    if( $.avia_utilities.supported.transition === undefined )
23		{
24			$.avia_utilities.supported.transition = $.avia_utilities.supports('transition');
25		}
26
27		this.options		= {};
28		this.browserPrefix 	= $.avia_utilities.supported.transition;
29	    this.cssActive 		= this.browserPrefix !== false ? true : false;
30	    this.transform3d	= document.documentElement.className.indexOf('avia_transform3d') !== -1 ? true : false;
31		this.isMobile 		= $.avia_utilities.isMobile;
32		this.isTouchDevice	= $.avia_utilities.isTouchDevice;
33		this.property		= this.browserPrefix + 'transform';
34		this.count			= this.$slides.length;
35		this.open			= false;
36		this.autoplay		= false;			//	 id of setInterval
37		this.increaseTitle  = this.$slider.is(".aviaccordion-title-on-hover");
38		// this.cssActive    = false; //testing no css3 browser
39
40	    this._init( options );
41	};
42
43	$.AviaccordionSlider.defaults = {
44
45		//	interval between autorotation switches
46		interval: 5,
47
48		//	autorotation active or not
49		autoplay: true,
50
51		//	'endless' | 'once'
52		loop_autoplay: 'endless'
53	};
54
55  	$.AviaccordionSlider.prototype =
56    {
57    	_init: function( options )
58    	{
59    		var _self = this;
60
61			 // set slider options
62			this.options = this._setOptions( options );
63
64			$.avia_utilities.preload({
65						container: this.$slider,
66						single_callback: function(){ _self._kickOff(); }
67					});
68    	},
69
70		_setOptions: function( options )
71		{
72			var jsonOptions = this.$slider.data( 'slideshow-options' );
73
74			//	since 5.0 - render options via json to clean up html - $.data returns parsed object
75			if( 'object' == typeof jsonOptions )
76			{
77				var newOptions = $.extend( {}, $.AviaccordionSlider.defaults, options, jsonOptions );
78				return newOptions;
79			}
80
81			var newOptions = $.extend( {}, $.AviaccordionSlider.defaults, options, this.$slider.data() );
82			return newOptions;
83		},
84
85    	_kickOff: function()
86    	{
87    		var _self = this;
88
89    		_self._calcMovement();
90    		_self._bindEvents();
91    		_self._showImages();
92    		_self._autoplay();
93    	},
94
95    	_autoplay: function()
96    	{
97    		var _self = this;
98
99    		if( _self.options.autoplay )
100    		{
101    			_self.autoplay = setInterval( function()
102    			{
103    				_self.open = _self.open === false ? 0 : _self.open + 1;
104
105    				if( _self.open >= _self.count )
106					{
107						if( _self.options.loop_autoplay == 'once' )
108						{
109							clearInterval( _self.autoplay );
110							_self.options.autoplay = false;
111							_self.autoplay = false;
112							return;
113						}
114
115						_self.open = 0;
116					}
117
118    				_self._move( {}, _self.open );
119
120    			}, _self.options.interval * 1000 );
121    		}
122    	},
123
124    	_showImages: function()
125    	{
126    		var _self = this,
127				counter = 0,
128				delay = 300,
129				title_delay = this.count * delay;
130
131    		if(this.cssActive)
132    		{
133    			setTimeout(function(){ _self.$slider.addClass('av-animation-active'); }, 10);
134    		}
135
136    		this.$images.each( function(i)
137    		{
138    			var current = $(this),
139					timer = delay * (i + 1);
140
141    			setTimeout(function()
142    			{
143    				current.avia_animate({opacity:1}, 400, function()
144    				{
145    					current.css($.avia_utilities.supported.transition + "transform", "none");
146    				});
147    			}, timer );
148    		});
149
150    		if(_self.increaseTitle)
151			{

152				title_delay = 0;
153			}
154
155    		this.$titlePos.each(function(i)
156    		{
157    			var current = $(this),
158					new_timer = title_delay + 100 * (i + 1);
159
160    			setTimeout(function()
161    			{
162    				current.avia_animate({opacity:1}, 200, function()
163    				{
164    					current.css($.avia_utilities.supported.transition + "transform", "none");
165    				});
166    			}, new_timer );
167    		});
168    	},
169
170    	_bindEvents: function()
171    	{
172    		var trigger = this.isMobile ? "click" : "mouseenter";
173
174    		this.$slider.on( trigger, '.aviaccordion-slide', this._move.bind( this ) );
175    		this.$slider.on( 'mouseleave','.aviaccordion-inner', this._move.bind( this ) );
176    		this.$win.on( 'debouncedresize', this._calcMovement.bind( this ) );
177    		this.$slider.on( 'av-prev av-next', this._moveTo.bind( this ) );
178
179    		if( this.isMobile || this.isTouchDevice )
180    		{
181    			this.$slider.avia_swipe_trigger({next: this.$slider, prev: this.$slider, event:{prev: 'av-prev', next: 'av-next'}});
182    		}
183    	},
184
185    	_titleHeight: function()
186    	{
187    		var th = 0;
188
189    		this.$titleWrap.css({'height':'auto'}).each( function()
190    		{
191    			var new_h = $(this).outerHeight();
192
193				if( new_h > th)
194				{
195					th = new_h;
196				}
197    		}).css( {'height': th + 2} );
198    	},
199
200    	_calcMovement: function(event, allow_repeat)
201    	{
202    		var _self			= this,
203    			containerWidth	= this.$slider.width(),
204    			defaultPos		= this.$last.data('av-left'),
205    			imgWidth		= this.$images.last().width() || containerWidth,
206    			imgWidthPercent = Math.floor((100 / containerWidth) * imgWidth),
207    			allImageWidth	= imgWidthPercent * _self.count,
208    			modifier		= 3, // 10 - _self.count,
209    			tempMinLeft		= 100 - imgWidthPercent,
210    			minLeft 		= tempMinLeft > defaultPos / modifier ? tempMinLeft : 0,
211    			oneLeft			= minLeft / (_self.count -1 ),
212    			titleWidth		= imgWidth;
213
214
215
216    		if(allImageWidth < 110 && allow_repeat !== false)
217    		{
218    			//set height if necessary
219    			var slideHeight = this.$slider.height(),
220    				maxHeight 	= (slideHeight / allImageWidth) * 110 ;
221
222    			this.$slider.css({'max-height': maxHeight});
223    			_self._calcMovement(event, false);
224
225    			return;
226    		}
227
228    		//backup so the minimized slides dont get too small
229    		if(oneLeft < 2)
230			{
231				minLeft = 0;
232			}
233
234			this.$slides.each(function(i)
235			{
236				var current = $(this),
237					newLeft = 0,
238					newRight = 0,
239					defaultLeft = current.data('av-left');
240
241				if( minLeft !== 0)
242				{
243					newLeft  = oneLeft * i;
244					newRight = imgWidthPercent + newLeft - oneLeft;
245				}
246				else
247				{
248					newLeft  = defaultLeft / Math.abs(modifier);
249					newRight = 100 - ((newLeft / i) * (_self.count - i));
250				}
251
252				if(i == 1 && _self.increaseTitle)
253				{
254					titleWidth = newRight + 1;
255				}
256
257				if(_self.cssActive)
258				{
259					//if we are not animating based on the css left value but on css transform we need to subtract the left value
260					newLeft = newLeft - defaultLeft;
261					newRight = newRight - defaultLeft;
262					defaultLeft = 0;
263				}
264
265				current.data('av-calc-default', defaultLeft);
266				current.data('av-calc-left', newLeft);
267				current.data('av-calc-right', newRight);
268
269			});
270
271			if(_self.increaseTitle)
272			{
273				_self.$titles.css({width: titleWidth + "%"});
274			}
275    	},
276
277    	_moveTo: function(event)
278    	{
279    		var direction = event.type == "av-next" ? 1 : -1,
280    			nextSlide = this.open === false ? 0 : this.open + direction;
281
282    		if(nextSlide >= 0 && nextSlide < this.$slides.length)
283			{
284				this._move(event, nextSlide);
285			}
286    	},
287
288    	_move: function( event, direct_open )
289    	{
290    		var _self  = this,
291    			slide  = event.currentTarget,
292    			itemNo = typeof direct_open != "undefined" ? direct_open : this.$slides.index(slide);
293
294    		this.open = itemNo;
295
296    		if( _self.autoplay && typeof slide != "undefined" )
297			{
298				clearInterval( _self.autoplay );
299				_self.autoplay = false;
300			}
301
302    		this.$slides.removeClass('aviaccordion-active-slide').each(function(i)
303    		{
304    			var current 	= $(this),
305    				dataSet 	= current.data(),
306    				trans_val	= i <= itemNo ? dataSet.avCalcLeft : dataSet.avCalcRight,
307					transition 	= {},
308					reset		= event.type == 'mouseleave' ? 1 : 0,
309					active 		= itemNo === i ? _self.$titleWrap.eq(i) : false;

310
311    			if(active)
312				{
313					current.addClass('aviaccordion-active-slide');
314				}
315
316    			if(reset)
317    			{
318    				trans_val = dataSet.avCalcDefault;
319    				this.open = false;
320    			}
321
322				if(_self.cssActive) //do a css3 animation
323				{
324					//move the slides
325					transition[_self.property]  = _self.transform3d ? "translate3d(" + trans_val  + "%, 0, 0)" : "translate(" + trans_val + "%,0)"; //3d or 2d transform?
326					current.css(transition);
327				}
328				else
329				{
330					transition.left = trans_val + "%";
331					current.stop().animate(transition, 700, 'easeOutQuint');
332				}
333    		});
334    	}
335    };
336
337
338	$.fn.aviaccordion = function( options )
339	{
340		return this.each(function()
341		{
342			var active = $.data( this, 'AviaccordionSlider' );
343
344			if(!active)
345			{
346				//make sure that the function doesnt get aplied a second time
347				$.data( this, 'AviaccordionSlider', 1 );
348
349				//create the preparations for fullscreen slider
350				new $.AviaccordionSlider( options, this );
351			}
352		});
353	};
354
355})(jQuery);