scratch – Blame information for rev 117

Subversion Repositories:
Rev:
Rev Author Line No. Line
117 office 1 /*=========================
2 Effects
3 ===========================*/
4 s.effects = {
5 fade: {
6 setTranslate: function () {
7 for (var i = 0; i < s.slides.length; i++) {
8 var slide = s.slides.eq(i);
9 var offset = slide[0].swiperSlideOffset;
10 var tx = -offset;
11 if (!s.params.virtualTranslate) tx = tx - s.translate;
12 var ty = 0;
13 if (!s.isHorizontal()) {
14 ty = tx;
15 tx = 0;
16 }
17 var slideOpacity = s.params.fade.crossFade ?
18 Math.max(1 - Math.abs(slide[0].progress), 0) :
19 1 + Math.min(Math.max(slide[0].progress, -1), 0);
20 slide
21 .css({
22 opacity: slideOpacity
23 })
24 .transform('translate3d(' + tx + 'px, ' + ty + 'px, 0px)');
25  
26 }
27  
28 },
29 setTransition: function (duration) {
30 s.slides.transition(duration);
31 if (s.params.virtualTranslate && duration !== 0) {
32 var eventTriggered = false;
33 s.slides.transitionEnd(function () {
34 if (eventTriggered) return;
35 if (!s) return;
36 eventTriggered = true;
37 s.animating = false;
38 var triggerEvents = ['webkitTransitionEnd', 'transitionend', 'oTransitionEnd', 'MSTransitionEnd', 'msTransitionEnd'];
39 for (var i = 0; i < triggerEvents.length; i++) {
40 s.wrapper.trigger(triggerEvents[i]);
41 }
42 });
43 }
44 }
45 },
46 flip: {
47 setTranslate: function () {
48 for (var i = 0; i < s.slides.length; i++) {
49 var slide = s.slides.eq(i);
50 var progress = slide[0].progress;
51 if (s.params.flip.limitRotation) {
52 progress = Math.max(Math.min(slide[0].progress, 1), -1);
53 }
54 var offset = slide[0].swiperSlideOffset;
55 var rotate = -180 * progress,
56 rotateY = rotate,
57 rotateX = 0,
58 tx = -offset,
59 ty = 0;
60 if (!s.isHorizontal()) {
61 ty = tx;
62 tx = 0;
63 rotateX = -rotateY;
64 rotateY = 0;
65 }
66 else if (s.rtl) {
67 rotateY = -rotateY;
68 }
69  
70 slide[0].style.zIndex = -Math.abs(Math.round(progress)) + s.slides.length;
71  
72 if (s.params.flip.slideShadows) {
73 //Set shadows
74 var shadowBefore = s.isHorizontal() ? slide.find('.swiper-slide-shadow-left') : slide.find('.swiper-slide-shadow-top');
75 var shadowAfter = s.isHorizontal() ? slide.find('.swiper-slide-shadow-right') : slide.find('.swiper-slide-shadow-bottom');
76 if (shadowBefore.length === 0) {
77 shadowBefore = $('<div class="swiper-slide-shadow-' + (s.isHorizontal() ? 'left' : 'top') + '"></div>');
78 slide.append(shadowBefore);
79 }
80 if (shadowAfter.length === 0) {
81 shadowAfter = $('<div class="swiper-slide-shadow-' + (s.isHorizontal() ? 'right' : 'bottom') + '"></div>');
82 slide.append(shadowAfter);
83 }
84 if (shadowBefore.length) shadowBefore[0].style.opacity = Math.max(-progress, 0);
85 if (shadowAfter.length) shadowAfter[0].style.opacity = Math.max(progress, 0);
86 }
87  
88 slide
89 .transform('translate3d(' + tx + 'px, ' + ty + 'px, 0px) rotateX(' + rotateX + 'deg) rotateY(' + rotateY + 'deg)');
90 }
91 },
92 setTransition: function (duration) {
93 s.slides.transition(duration).find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left').transition(duration);
94 if (s.params.virtualTranslate && duration !== 0) {
95 var eventTriggered = false;
96 s.slides.eq(s.activeIndex).transitionEnd(function () {
97 if (eventTriggered) return;
98 if (!s) return;
99 if (!$(this).hasClass(s.params.slideActiveClass)) return;
100 eventTriggered = true;
101 s.animating = false;
102 var triggerEvents = ['webkitTransitionEnd', 'transitionend', 'oTransitionEnd', 'MSTransitionEnd', 'msTransitionEnd'];
103 for (var i = 0; i < triggerEvents.length; i++) {
104 s.wrapper.trigger(triggerEvents[i]);
105 }
106 });
107 }
108 }
109 },
110 cube: {
111 setTranslate: function () {
112 var wrapperRotate = 0, cubeShadow;
113 if (s.params.cube.shadow) {
114 if (s.isHorizontal()) {
115 cubeShadow = s.wrapper.find('.swiper-cube-shadow');
116 if (cubeShadow.length === 0) {
117 cubeShadow = $('<div class="swiper-cube-shadow"></div>');
118 s.wrapper.append(cubeShadow);
119 }
120 cubeShadow.css({height: s.width + 'px'});
121 }
122 else {
123 cubeShadow = s.container.find('.swiper-cube-shadow');
124 if (cubeShadow.length === 0) {
125 cubeShadow = $('<div class="swiper-cube-shadow"></div>');
126 s.container.append(cubeShadow);
127 }
128 }
129 }
130 for (var i = 0; i < s.slides.length; i++) {
131 var slide = s.slides.eq(i);
132 var slideAngle = i * 90;
133 var round = Math.floor(slideAngle / 360);
134 if (s.rtl) {
135 slideAngle = -slideAngle;
136 round = Math.floor(-slideAngle / 360);
137 }
138 var progress = Math.max(Math.min(slide[0].progress, 1), -1);
139 var tx = 0, ty = 0, tz = 0;
140 if (i % 4 === 0) {
141 tx = - round * 4 * s.size;
142 tz = 0;
143 }
144 else if ((i - 1) % 4 === 0) {
145 tx = 0;
146 tz = - round * 4 * s.size;
147 }
148 else if ((i - 2) % 4 === 0) {
149 tx = s.size + round * 4 * s.size;
150 tz = s.size;
151 }
152 else if ((i - 3) % 4 === 0) {
153 tx = - s.size;
154 tz = 3 * s.size + s.size * 4 * round;
155 }
156 if (s.rtl) {
157 tx = -tx;
158 }
159  
160 if (!s.isHorizontal()) {
161 ty = tx;
162 tx = 0;
163 }
164  
165 var transform = 'rotateX(' + (s.isHorizontal() ? 0 : -slideAngle) + 'deg) rotateY(' + (s.isHorizontal() ? slideAngle : 0) + 'deg) translate3d(' + tx + 'px, ' + ty + 'px, ' + tz + 'px)';
166 if (progress <= 1 && progress > -1) {
167 wrapperRotate = i * 90 + progress * 90;
168 if (s.rtl) wrapperRotate = -i * 90 - progress * 90;
169 }
170 slide.transform(transform);
171 if (s.params.cube.slideShadows) {
172 //Set shadows
173 var shadowBefore = s.isHorizontal() ? slide.find('.swiper-slide-shadow-left') : slide.find('.swiper-slide-shadow-top');
174 var shadowAfter = s.isHorizontal() ? slide.find('.swiper-slide-shadow-right') : slide.find('.swiper-slide-shadow-bottom');
175 if (shadowBefore.length === 0) {
176 shadowBefore = $('<div class="swiper-slide-shadow-' + (s.isHorizontal() ? 'left' : 'top') + '"></div>');
177 slide.append(shadowBefore);
178 }
179 if (shadowAfter.length === 0) {
180 shadowAfter = $('<div class="swiper-slide-shadow-' + (s.isHorizontal() ? 'right' : 'bottom') + '"></div>');
181 slide.append(shadowAfter);
182 }
183 if (shadowBefore.length) shadowBefore[0].style.opacity = Math.max(-progress, 0);
184 if (shadowAfter.length) shadowAfter[0].style.opacity = Math.max(progress, 0);
185 }
186 }
187 s.wrapper.css({
188 '-webkit-transform-origin': '50% 50% -' + (s.size / 2) + 'px',
189 '-moz-transform-origin': '50% 50% -' + (s.size / 2) + 'px',
190 '-ms-transform-origin': '50% 50% -' + (s.size / 2) + 'px',
191 'transform-origin': '50% 50% -' + (s.size / 2) + 'px'
192 });
193  
194 if (s.params.cube.shadow) {
195 if (s.isHorizontal()) {
196 cubeShadow.transform('translate3d(0px, ' + (s.width / 2 + s.params.cube.shadowOffset) + 'px, ' + (-s.width / 2) + 'px) rotateX(90deg) rotateZ(0deg) scale(' + (s.params.cube.shadowScale) + ')');
197 }
198 else {
199 var shadowAngle = Math.abs(wrapperRotate) - Math.floor(Math.abs(wrapperRotate) / 90) * 90;
200 var multiplier = 1.5 - (Math.sin(shadowAngle * 2 * Math.PI / 360) / 2 + Math.cos(shadowAngle * 2 * Math.PI / 360) / 2);
201 var scale1 = s.params.cube.shadowScale,
202 scale2 = s.params.cube.shadowScale / multiplier,
203 offset = s.params.cube.shadowOffset;
204 cubeShadow.transform('scale3d(' + scale1 + ', 1, ' + scale2 + ') translate3d(0px, ' + (s.height / 2 + offset) + 'px, ' + (-s.height / 2 / scale2) + 'px) rotateX(-90deg)');
205 }
206 }
207 var zFactor = (s.isSafari || s.isUiWebView) ? (-s.size / 2) : 0;
208 s.wrapper.transform('translate3d(0px,0,' + zFactor + 'px) rotateX(' + (s.isHorizontal() ? 0 : wrapperRotate) + 'deg) rotateY(' + (s.isHorizontal() ? -wrapperRotate : 0) + 'deg)');
209 },
210 setTransition: function (duration) {
211 s.slides.transition(duration).find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left').transition(duration);
212 if (s.params.cube.shadow && !s.isHorizontal()) {
213 s.container.find('.swiper-cube-shadow').transition(duration);
214 }
215 }
216 },
217 coverflow: {
218 setTranslate: function () {
219 var transform = s.translate;
220 var center = s.isHorizontal() ? -transform + s.width / 2 : -transform + s.height / 2;
221 var rotate = s.isHorizontal() ? s.params.coverflow.rotate: -s.params.coverflow.rotate;
222 var translate = s.params.coverflow.depth;
223 //Each slide offset from center
224 for (var i = 0, length = s.slides.length; i < length; i++) {
225 var slide = s.slides.eq(i);
226 var slideSize = s.slidesSizesGrid[i];
227 var slideOffset = slide[0].swiperSlideOffset;
228 var offsetMultiplier = (center - slideOffset - slideSize / 2) / slideSize * s.params.coverflow.modifier;
229  
230 var rotateY = s.isHorizontal() ? rotate * offsetMultiplier : 0;
231 var rotateX = s.isHorizontal() ? 0 : rotate * offsetMultiplier;
232 // var rotateZ = 0
233 var translateZ = -translate * Math.abs(offsetMultiplier);
234  
235 var translateY = s.isHorizontal() ? 0 : s.params.coverflow.stretch * (offsetMultiplier);
236 var translateX = s.isHorizontal() ? s.params.coverflow.stretch * (offsetMultiplier) : 0;
237  
238 //Fix for ultra small values
239 if (Math.abs(translateX) < 0.001) translateX = 0;
240 if (Math.abs(translateY) < 0.001) translateY = 0;
241 if (Math.abs(translateZ) < 0.001) translateZ = 0;
242 if (Math.abs(rotateY) < 0.001) rotateY = 0;
243 if (Math.abs(rotateX) < 0.001) rotateX = 0;
244  
245 var slideTransform = 'translate3d(' + translateX + 'px,' + translateY + 'px,' + translateZ + 'px) rotateX(' + rotateX + 'deg) rotateY(' + rotateY + 'deg)';
246  
247 slide.transform(slideTransform);
248 slide[0].style.zIndex = -Math.abs(Math.round(offsetMultiplier)) + 1;
249 if (s.params.coverflow.slideShadows) {
250 //Set shadows
251 var shadowBefore = s.isHorizontal() ? slide.find('.swiper-slide-shadow-left') : slide.find('.swiper-slide-shadow-top');
252 var shadowAfter = s.isHorizontal() ? slide.find('.swiper-slide-shadow-right') : slide.find('.swiper-slide-shadow-bottom');
253 if (shadowBefore.length === 0) {
254 shadowBefore = $('<div class="swiper-slide-shadow-' + (s.isHorizontal() ? 'left' : 'top') + '"></div>');
255 slide.append(shadowBefore);
256 }
257 if (shadowAfter.length === 0) {
258 shadowAfter = $('<div class="swiper-slide-shadow-' + (s.isHorizontal() ? 'right' : 'bottom') + '"></div>');
259 slide.append(shadowAfter);
260 }
261 if (shadowBefore.length) shadowBefore[0].style.opacity = offsetMultiplier > 0 ? offsetMultiplier : 0;
262 if (shadowAfter.length) shadowAfter[0].style.opacity = (-offsetMultiplier) > 0 ? -offsetMultiplier : 0;
263 }
264 }
265  
266 //Set correct perspective for IE10
267 if (s.browser.ie) {
268 var ws = s.wrapper[0].style;
269 ws.perspectiveOrigin = center + 'px 50%';
270 }
271 },
272 setTransition: function (duration) {
273 s.slides.transition(duration).find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left').transition(duration);
274 }
275 }
276 };