https://www.leviceonline.sk/modules/mod_janews_featured/tmpl/default/script.js

1/**
2 * ------------------------------------------------------------------------
3 * JA News Featured Module for J25 & J34
4 * ------------------------------------------------------------------------
5 * Copyright (C) 2004-2011 J.O.O.M Solutions Co., Ltd. All Rights Reserved.
6 * @license - GNU/GPL, http://www.gnu.org/licenses/gpl.html
7 * Author: J.O.O.M Solutions Co., Ltd
8 * Websites: http://www.joomlart.com - http://www.joomlancers.com
9 * ------------------------------------------------------------------------
10 */
11
12var requesting = false;
13
14var JANEWSFP_DEFAULT = new Class({
15
16	initialize: function(options) {
17		
18		this.options = Object.append({
19			moduleid: 0,
20			duration: 400,
21			autoplay_duration:1000,
22			autoplay: 1,
23			animType: 'animNewsMoveHor',
24			changeTransition:	Fx.Transitions.Pow.easeIn
25		}, options || {});
26		
27		var moduleid = this.options.moduleid,
28			element = $('ja-zinfp-'+moduleid),
29			obwrap = element.getElement('.ja-zinfp-featured-border'),
30			nmwrap = element.getElement('.ja-zinfp-normal-wrap');
31
32		this.panelwrap = element.getElement('div.ja-zinfp-featured');	
33		this.cur_activePanel = this.panelwrap.getElement('div.active');
34		
35		this.panelwrap.getChildren().removeClass('hide');
36		var MH = this.cur_activePanel.offsetHeight;
37		this.panelwrap.getChildren().each(function(item, idx){
38			MH = Math.max(MH, item.offsetHeight);
39		}).addClass('hide');
40
41		this.panelwrap.setStyle('width', this.panelwrap.getParent().getCoordinates().width);
42		this.panelwrap.setStyle('height', MH);
43		
44		//Set equal height
45		if(nmwrap){
46			var HN = Math.max(nmwrap.offsetHeight + 13, this.panelwrap.offsetHeight );
47			this.panelwrap.getParent().setStyle('height', HN);
48		}
49		
50		var hasTips = $$('.jahasTip');
51		if(hasTips.length){
52			hasTips.each(function(el) {
53				var title = el.get('title');
54				if (title) {
55					var parts = title.split('::', 2);
56					el.store('tip:title', parts[0]);
57					el.store('tip:text', parts[1]);
58				}
59			});
60		}
61		this.jaTooltips = new Tips(hasTips, { maxTitleChars: 50, fixed: false});
62
63		
64		this.panels = this.panelwrap.getElements('.ja-zincontent-wrap');
65		if(this.panels.length <= 1){
66			return;
67		}
68		this.panels.each(function(el){
69			el.setStyle('width', this.panelwrap.offsetWidth);
70		}.bind(this))
71		
72		this.next_bt  = element.getElement('.ja-zinfp-links-actions a.next');
73		this.prev_bt  = element.getElement('.ja-zinfp-links-actions a.prev');
74		this.next_img = element.getElement('.ja-zinfp-links-actions span.next');
75		this.counter  = element.getElement('.ja-zinfp-links-actions span.counter');
76					
77		if(this.next_bt != null){
78			
79			this.anim = eval ('new '+this.options.animType + '(this)');
80			
81			this.time = Date.now();
82			if(this.options.autoplay == 1){
83				this.timer = this.next.periodical(this.options.autoplay_duration, this);	
84			}
85
86			this.next_bt.addEvent('click', function () {
87				this.timer = clearInterval(this.timer);
88		    	this.next();
89				if(this.options.autoplay==1){
90				this.timer = this.next.periodical(this.options.autoplay_duration, this);	
91			    }
92		    }.bind(this));
93		    
94		    this.prev_bt.addEvent('click', function () {
95		    	this.timer = clearInterval(this.timer);
96		    	this.previous();
97				if(this.options.autoplay==1){
98				this.timer = this.next.periodical(this.options.autoplay_duration, this);	
99			    } 
100		    }.bind(this));		    
101		}
102
103		$(window).addEvent('load', this.resize.bind(this));
104		$(window).addEvent('resize', this.resize.bind(this));
105		$(window).addEvent('orientationchange', this.resize.bind(this));
106	},
107	    
108    next: function(){  
109		if (!this.mainfx) this.mainfx = new Fx.Tween(this.panelwrap,{duration:this.options.duration});
110		
111		var moduleid = this.options.moduleid;
112		this.current_activePanel = this.panelwrap.getElement('div.active');
113		
114		if(this.current_activePanel.getNext()==null){
115			
116			this.activePanel = this.panelwrap.getFirst();
117			
118			this.counter.set('text', 1);
119		}
120		else{
121			this.activePanel = this.current_activePanel.getNext();
122			this.counter.set('text', this.counter.get('text').toInt()+1);
123		}
124		
125		this.current_activePanel.removeClass('active');		
126		this.activePanel.addClass('active');				
127    	this.anim.move (this.current_activePanel, this.activePanel, false);      	    			
128		this.mainfx.start('height', this.activePanel.offsetHeight);		
129    },
130    
131    previous: function(){
132    	this.current_activePanel = this.panelwrap.getElement('div.active');    	
133    	var activePanel = this.current_activePanel.getPrevious();
134
135    	if(activePanel!=null){
136    		
137    		if (!this.mainfx) this.mainfx = new Fx.Tween(this.panelwrap,{duration:this.options.duration});
138    		//this.mainfx.stop();
139    		
140    		this.activePanel = activePanel;
141    		this.current_activePanel.removeClass('active');
142    		this.activePanel.addClass('active');
143    		this.anim.move (this.current_activePanel, this.activePanel, false);
144    		
145    		this.counter.set('text', this.counter.get('text').toInt()-1);    		    		
146    		this.mainfx.start('height', this.activePanel.offsetHeight);
147    	}    	
148    },
149
150    resize: function(){
151    	
152    	this.cur_activePanel.setStyles({
153    		width: '',
154    		height: ''
155    	}).addClass('show');
156
157    	this.panelwrap.setStyles({
158    		width: '',
159    		height: ''
160    	});

161
162    	this.panelwrap.setStyle('height', this.cur_activePanel.offsetHeight);
163		this.panelwrap.setStyle('width', this.panelwrap.getParent().getCoordinates().width);
164		
165		//Set equal height
166		var moduleid = this.options.moduleid,
167			nmwrap = $('ja-zinfp-'+moduleid).getElement('.ja-zinfp-normal-wrap');
168
169		if(nmwrap){
170			var HN = Math.max(nmwrap.offsetHeight + 13, this.panelwrap.offsetHeight );
171			this.panelwrap.getParent().setStyle('height', HN);
172		}
173
174    	this.panels.setStyle('width', '');
175    	this.panels.setStyle('width', this.panelwrap.offsetWidth);
176
177    	var left = 0;
178    	this.panels.each (function (panel) {
179	      panel.setStyle('left', left);
180	      left += panel.offsetWidth;
181	    });
182
183    	this.cur_activePanel.removeClass('show');
184    }
185});
186
187var animNewsMoveHor = new Class ({
188	initialize: function(tabwrap) {
189		this.options = tabwrap.options || {};
190		this.tabwrap = tabwrap;
191		this.changeEffect = new Fx.Elements(this.tabwrap.panels, {duration: this.options.duration});
192		var left = 0;
193		var dir = $(document.documentElement).get('dir') == 'rtl' ? 'right' : 'left';
194	    this.tabwrap.panels.each (function (panel) {
195	      panel.setStyle(dir, left);
196
197	      var ishide = panel.hasClass('hide');
198	      if(ishide) {
199	      	panel.removeClass('hide');
200	      }
201	      left += panel.offsetWidth;
202	      if(ishide) {
203	      	panel.addClass('hide');
204	      }
205	    });
206	    this.tabwrap.panels.setStyle('top', 0);
207	},
208
209	move: function (curTab, newTab, skipAnim) {
210		if(this.options.changeTransition != 'none' && !skipAnim)
211		{
212			//this.changeEffect.stop();
213			var obj = {};
214			var dir = $(document.documentElement).get('dir') == 'rtl' ? 'right' : 'left';
215			var offset = newTab.getStyle(dir).toInt();
216
217			i=0;			
218			
219			this.tabwrap.panels.each(function(panel) {
220				obj[i] = {};
221				obj[i][dir] = [panel.getStyle(dir).toInt(), panel.getStyle(dir).toInt() - offset];			
222
223				i++;
224			});
225			this.changeEffect.start(obj);
226		}
227	}
228});
229
230
231var animNewsMoveVir = new Class ({
232	initialize: function(tabwrap) {
233		this.options = tabwrap.options || {};
234		this.tabwrap = tabwrap;
235		this.changeEffect = new Fx.Elements(this.tabwrap.panels, {duration: this.options.duration});
236	
237	    var top = 0;
238	    this.tabwrap.panels.each (function (panel) {
239	      panel.setStyle('top', top);
240
241	      var ishide = panel.hasClass('hide');
242	      if(ishide) {
243	      	panel.removeClass('hide');
244	      }
245	      top += Math.max(panel.offsetHeight,  panel.getParent().offsetHeight);
246	      if(ishide) {
247	      	panel.addClass('hide');
248	      }
249	    });
250	    this.tabwrap.panels.setStyle('left', 0);
251	},
252	move: function (curTab, newTab, skipAnim) {
253		if(skipAnim==false)
254		{
255      //reposition newTab
256      
257			//this.changeEffect.stop();
258			var obj = {}; 
259			var offset = newTab.offsetTop.toInt();
260			i=0;
261			this.tabwrap.panels.each(function(panel) {
262				obj[i++] = {'top':[panel.offsetTop.toInt(), panel.offsetTop.toInt() - offset]};			
263			});
264			this.changeEffect.start(obj);
265		}
266	}
267});
268
269
270var animNewsFade = new Class ({
271	initialize: function(tabwrap) {
272		
273		this.options = tabwrap.options || {};
274		this.tabwrap = tabwrap;
275		this.changeEffect = new Fx.Elements(this.tabwrap.panels, {duration: this.options.duration});
276		
277		this.tabwrap.panels.setStyles({'opacity':0,'width':'100%','display':'none'});		
278		this.tabwrap.panels[0].setStyles({'opacity':1,'display':'block'});
279	},
280
281	move: function (curTab, newTab, skipAnim) {
282		
283		if(this.options.changeTransition != 'none' && !skipAnim)
284		{
285			if (curTab)
286			{
287				curOpac = curTab.getStyle('opacity');
288				var changeEffect1 = new Fx.Tween(curTab, {duration: this.options.duration, transition: this.options.changeTransition});
289				changeEffect1.start('opacity',curOpac,0).chain(function(){
290				    curTab.setStyle("display",'none');
291				});
292				
293			}
294			curOpac = newTab.getStyle('opacity');
295			var changeEffect = new Fx.Tween(newTab, {duration: this.options.duration, transition: this.options.changeTransition});
296			changeEffect.start('opacity', curOpac,1).chain(function(){
297				 newTab.setStyle('display','block');													
298			});
299			
300		} else {
301			if (curTab) curTab.setStyle('opacity', 0);
302			newTab.setStyle('opacity', 1);
303		}
304	}
305});