https://iasaude.pt/components/com_roksprocket/layouts/features/themes/slideshow/slideshow.js

1
2((function(){
3	if (typeof this.RokSprocket == 'undefined') this.RokSprocket = {};
4	else Object.merge(this.RokSprocket, {Slideshow: null});
5
6	var Slideshow = new Class({
7
8		Extends: this.RokSprocket.Features,
9
10		options: {
11			curve: 'cubic-bezier(0.37,0.61,0.59,0.87)',
12			duration: '400ms',
13			data: 'slideshow',
14			settings: {
15				animation: 'crossfade',
16				autoplay: false,
17				delay: 5
18			}
19		},
20
21		animate: function(container, from, to){
22			var contents = container.getElements('[data-' + this.data + '-content]'),
23				images = container.getElements('[data-' + this.data + '-image]'),
24				settings = this.getSettings(container),
25				animation = {
26					content: this.animations.crossfade,
27					image: this.animations[settings.animation] || this.animations.crossfade
28				},
29				current = {
30					content: contents[from],
31					image: images[from]
32				},
33				next = {
34					content: contents[to],
35					image: images[to]
36				};
37
38			if (Browser.ie && Browser.version < 8){
39				contents.setStyle('zoom', 1);
40				images.setStyle('zoom', 1);
41			}
42
43			Object.each(current, function(value, key){
44				var transition = (key == 'content') ?
45									animation[key]
46									:
47									settings.animation == 'random' ? this.getRandom() : animation[key];
48
49				if (key == 'content') contents.styles(Object.merge({}, transition.from, {position: 'absolute'}));
50				if (key == 'image') images.styles(Object.merge({}, transition.from, {position: 'absolute'}));
51				current[key].styles(Object.merge({}, transition.to, {'z-index': 1}));
52
53				var initialStyles = {'z-index': 2, 'position': 'absolute'};
54				if (key == 'image'){
55					current[key].styles({position: 'relative'});
56
57					['top', 'right', 'bottom', 'left'].each(function(dir){
58						next[key].style[dir] = '';
59					}, this);
60
61					if (transition == 'crossfade'){
62						Object.merge(initialStyles, {top: 0, left: 0});
63					}
64				}
65
66				next[key].styles(Object.merge({}, transition.from, initialStyles));
67
68				if (Browser.ie && Browser.version < 9){
69					next[key].set('morph', {
70						link: 'cancel',
71						duration: this.options.duration.toInt(),
72						transition: 'quad:in:out',
73						onComplete: function(){
74							if (key == 'image'){
75								next[key].styles(Object.merge({}, transition.to, {position: 'relative'}));
76								current[key].styles(Object.merge({}, transition.from, {position: 'absolute'}));
77							}
78
79							current[key].styles(transition.from);
80							next[key].get('morph').removeEvents('onComplete');
81
82							if (settings.autoplay && settings.autoplay.toInt()) this.startTimer(container);
83						}.bind(this)
84					}).morph(transition.to);
85
86					if (key == 'content'){
87						current[key].set('morph', {
88							link: 'cancel',
89							duration: this.options.duration.toInt(),
90							transition: 'quad:in:out'
91						}).morph(transition.from);
92					}
93				} else {
94					next[key].moofx(transition.to, {
95						duration: this.options.duration,
96						equation: this.options.curve,
97						callback: function(){
98							if (key == 'image'){
99								next[key].styles(Object.merge({}, transition.to, {position: 'relative'}));
100								current[key].styles(Object.merge({}, transition.from, {position: 'absolute'}));
101							}
102							current[key].styles(transition.from);
103
104							if (settings.autoplay && settings.autoplay.toInt()) this.startTimer(container);
105						}.bind(this)
106					});
107
108					if (key == 'content'){
109						current[key].moofx(transition.from, {
110							duration: this.options.duration,
111							equation: this.options.curve
112						});
113					}
114				}
115
116			}, this);
117
118		}
119
120	});
121
122	this.RokSprocket.Slideshow = Slideshow;
123
124})());