@@ 3355-3660 (lines=306) @@ | ||
3352 | ||
3353 | })(UIkit2); |
|
3354 | ||
3355 | (function(UI) { |
|
3356 | ||
3357 | "use strict"; |
|
3358 | ||
3359 | var Animations; |
|
3360 | ||
3361 | UI.component('switcher', { |
|
3362 | ||
3363 | defaults: { |
|
3364 | connect : false, |
|
3365 | toggle : '>*', |
|
3366 | active : 0, |
|
3367 | animation : false, |
|
3368 | duration : 200, |
|
3369 | swiping : true |
|
3370 | }, |
|
3371 | ||
3372 | animating: false, |
|
3373 | ||
3374 | boot: function() { |
|
3375 | ||
3376 | // init code |
|
3377 | UI.ready(function(context) { |
|
3378 | ||
3379 | UI.$('[data-uk-switcher]', context).each(function() { |
|
3380 | var switcher = UI.$(this); |
|
3381 | ||
3382 | if (!switcher.data('switcher')) { |
|
3383 | var obj = UI.switcher(switcher, UI.Utils.options(switcher.attr('data-uk-switcher'))); |
|
3384 | } |
|
3385 | }); |
|
3386 | }); |
|
3387 | }, |
|
3388 | ||
3389 | init: function() { |
|
3390 | ||
3391 | var $this = this; |
|
3392 | ||
3393 | this.on('click.uk.switcher', this.options.toggle, function(e) { |
|
3394 | e.preventDefault(); |
|
3395 | $this.show(this); |
|
3396 | }); |
|
3397 | ||
3398 | if (!this.options.connect) { |
|
3399 | return; |
|
3400 | } |
|
3401 | ||
3402 | this.connect = UI.$(this.options.connect); |
|
3403 | ||
3404 | if (!this.connect.length) { |
|
3405 | return; |
|
3406 | } |
|
3407 | ||
3408 | this.connect.on('click.uk.switcher', '[data-uk-switcher-item]', function(e) { |
|
3409 | ||
3410 | e.preventDefault(); |
|
3411 | ||
3412 | var item = UI.$(this).attr('data-uk-switcher-item'); |
|
3413 | ||
3414 | if ($this.index == item) return; |
|
3415 | ||
3416 | switch(item) { |
|
3417 | case 'next': |
|
3418 | case 'previous': |
|
3419 | $this.show($this.index + (item=='next' ? 1:-1)); |
|
3420 | break; |
|
3421 | default: |
|
3422 | $this.show(parseInt(item, 10)); |
|
3423 | } |
|
3424 | }); |
|
3425 | ||
3426 | if (this.options.swiping) { |
|
3427 | ||
3428 | this.connect.on('swipeRight swipeLeft', function(e) { |
|
3429 | e.preventDefault(); |
|
3430 | if (!window.getSelection().toString()) { |
|
3431 | $this.show($this.index + (e.type == 'swipeLeft' ? 1 : -1)); |
|
3432 | } |
|
3433 | }); |
|
3434 | } |
|
3435 | ||
3436 | this.update(); |
|
3437 | }, |
|
3438 | ||
3439 | update: function() { |
|
3440 | ||
3441 | this.connect.children().removeClass('uk-active').attr('aria-hidden', 'true'); |
|
3442 | ||
3443 | var toggles = this.find(this.options.toggle), |
|
3444 | active = toggles.filter('.uk-active'); |
|
3445 | ||
3446 | if (active.length) { |
|
3447 | this.show(active, false); |
|
3448 | } else { |
|
3449 | ||
3450 | if (this.options.active===false) return; |
|
3451 | ||
3452 | active = toggles.eq(this.options.active); |
|
3453 | this.show(active.length ? active : toggles.eq(0), false); |
|
3454 | } |
|
3455 | ||
3456 | // Init ARIA for toggles |
|
3457 | toggles.not(active).attr('aria-expanded', 'false'); |
|
3458 | active.attr('aria-expanded', 'true'); |
|
3459 | }, |
|
3460 | ||
3461 | show: function(tab, animate) { |
|
3462 | ||
3463 | if (this.animating) { |
|
3464 | return; |
|
3465 | } |
|
3466 | ||
3467 | var toggles = this.find(this.options.toggle); |
|
3468 | ||
3469 | if (isNaN(tab)) { |
|
3470 | tab = UI.$(tab); |
|
3471 | } else { |
|
3472 | tab = tab < 0 ? toggles.length-1 : tab; |
|
3473 | tab = toggles.eq(toggles[tab] ? tab : 0); |
|
3474 | } |
|
3475 | ||
3476 | var $this = this, |
|
3477 | active = UI.$(tab), |
|
3478 | animation = Animations[this.options.animation] || function(current, next) { |
|
3479 | ||
3480 | if (!$this.options.animation) { |
|
3481 | return Animations.none.apply($this); |
|
3482 | } |
|
3483 | ||
3484 | var anim = $this.options.animation.split(','); |
|
3485 | ||
3486 | if (anim.length == 1) { |
|
3487 | anim[1] = anim[0]; |
|
3488 | } |
|
3489 | ||
3490 | anim[0] = anim[0].trim(); |
|
3491 | anim[1] = anim[1].trim(); |
|
3492 | ||
3493 | return coreAnimation.apply($this, [anim, current, next]); |
|
3494 | }; |
|
3495 | ||
3496 | if (animate===false || !UI.support.animation) { |
|
3497 | animation = Animations.none; |
|
3498 | } |
|
3499 | ||
3500 | if (active.hasClass("uk-disabled")) return; |
|
3501 | ||
3502 | // Update ARIA for Toggles |
|
3503 | toggles.attr('aria-expanded', 'false'); |
|
3504 | active.attr('aria-expanded', 'true'); |
|
3505 | ||
3506 | toggles.filter(".uk-active").removeClass("uk-active"); |
|
3507 | active.addClass("uk-active"); |
|
3508 | ||
3509 | if (this.options.connect && this.connect.length) { |
|
3510 | ||
3511 | this.index = this.find(this.options.toggle).index(active); |
|
3512 | ||
3513 | if (this.index == -1 ) { |
|
3514 | this.index = 0; |
|
3515 | } |
|
3516 | ||
3517 | this.connect.each(function() { |
|
3518 | ||
3519 | var container = UI.$(this), |
|
3520 | children = UI.$(container.children()), |
|
3521 | current = UI.$(children.filter('.uk-active')), |
|
3522 | next = UI.$(children.eq($this.index)); |
|
3523 | ||
3524 | $this.animating = true; |
|
3525 | ||
3526 | animation.apply($this, [current, next]).then(function(){ |
|
3527 | ||
3528 | current.removeClass("uk-active"); |
|
3529 | next.addClass("uk-active"); |
|
3530 | ||
3531 | // Update ARIA for connect |
|
3532 | current.attr('aria-hidden', 'true'); |
|
3533 | next.attr('aria-hidden', 'false'); |
|
3534 | ||
3535 | UI.Utils.checkDisplay(next, true); |
|
3536 | ||
3537 | $this.animating = false; |
|
3538 | ||
3539 | }); |
|
3540 | }); |
|
3541 | } |
|
3542 | ||
3543 | this.trigger("show.uk.switcher", [active]); |
|
3544 | } |
|
3545 | }); |
|
3546 | ||
3547 | Animations = { |
|
3548 | ||
3549 | 'none': function() { |
|
3550 | var d = UI.$.Deferred(); |
|
3551 | d.resolve(); |
|
3552 | return d.promise(); |
|
3553 | }, |
|
3554 | ||
3555 | 'fade': function(current, next) { |
|
3556 | return coreAnimation.apply(this, ['uk-animation-fade', current, next]); |
|
3557 | }, |
|
3558 | ||
3559 | 'slide-bottom': function(current, next) { |
|
3560 | return coreAnimation.apply(this, ['uk-animation-slide-bottom', current, next]); |
|
3561 | }, |
|
3562 | ||
3563 | 'slide-top': function(current, next) { |
|
3564 | return coreAnimation.apply(this, ['uk-animation-slide-top', current, next]); |
|
3565 | }, |
|
3566 | ||
3567 | 'slide-vertical': function(current, next, dir) { |
|
3568 | ||
3569 | var anim = ['uk-animation-slide-top', 'uk-animation-slide-bottom']; |
|
3570 | ||
3571 | if (current && current.index() > next.index()) { |
|
3572 | anim.reverse(); |
|
3573 | } |
|
3574 | ||
3575 | return coreAnimation.apply(this, [anim, current, next]); |
|
3576 | }, |
|
3577 | ||
3578 | 'slide-left': function(current, next) { |
|
3579 | return coreAnimation.apply(this, ['uk-animation-slide-left', current, next]); |
|
3580 | }, |
|
3581 | ||
3582 | 'slide-right': function(current, next) { |
|
3583 | return coreAnimation.apply(this, ['uk-animation-slide-right', current, next]); |
|
3584 | }, |
|
3585 | ||
3586 | 'slide-horizontal': function(current, next, dir) { |
|
3587 | ||
3588 | var anim = ['uk-animation-slide-right', 'uk-animation-slide-left']; |
|
3589 | ||
3590 | if (current && current.index() > next.index()) { |
|
3591 | anim.reverse(); |
|
3592 | } |
|
3593 | ||
3594 | return coreAnimation.apply(this, [anim, current, next]); |
|
3595 | }, |
|
3596 | ||
3597 | 'scale': function(current, next) { |
|
3598 | return coreAnimation.apply(this, ['uk-animation-scale-up', current, next]); |
|
3599 | } |
|
3600 | }; |
|
3601 | ||
3602 | UI.switcher.animations = Animations; |
|
3603 | ||
3604 | ||
3605 | // helpers |
|
3606 | ||
3607 | function coreAnimation(cls, current, next) { |
|
3608 | ||
3609 | var d = UI.$.Deferred(), clsIn = cls, clsOut = cls, release; |
|
3610 | ||
3611 | if (next[0]===current[0]) { |
|
3612 | d.resolve(); |
|
3613 | return d.promise(); |
|
3614 | } |
|
3615 | ||
3616 | if (typeof(cls) == 'object') { |
|
3617 | clsIn = cls[0]; |
|
3618 | clsOut = cls[1] || cls[0]; |
|
3619 | } |
|
3620 | ||
3621 | UI.$body.css('overflow-x', 'hidden'); // fix scroll jumping in iOS |
|
3622 | ||
3623 | release = function() { |
|
3624 | ||
3625 | if (current) current.hide().removeClass('uk-active '+clsOut+' uk-animation-reverse'); |
|
3626 | ||
3627 | next.addClass(clsIn).one(UI.support.animation.end, function() { |
|
3628 | ||
3629 | setTimeout(function () { |
|
3630 | next.removeClass(''+clsIn+'').css({opacity:'', display:''}); |
|
3631 | }, 0); |
|
3632 | ||
3633 | d.resolve(); |
|
3634 | ||
3635 | UI.$body.css('overflow-x', ''); |
|
3636 | ||
3637 | if (current) current.css({opacity:'', display:''}); |
|
3638 | ||
3639 | }.bind(this)).show(); |
|
3640 | }; |
|
3641 | ||
3642 | next.css('animation-duration', this.options.duration+'ms'); |
|
3643 | ||
3644 | if (current && current.length) { |
|
3645 | ||
3646 | current.css('animation-duration', this.options.duration+'ms'); |
|
3647 | ||
3648 | current.css('display', 'none').addClass(clsOut+' uk-animation-reverse').one(UI.support.animation.end, function() { |
|
3649 | release(); |
|
3650 | }.bind(this)).css('display', ''); |
|
3651 | ||
3652 | } else { |
|
3653 | next.addClass('uk-active'); |
|
3654 | release(); |
|
3655 | } |
|
3656 | ||
3657 | return d.promise(); |
|
3658 | } |
|
3659 | ||
3660 | })(UIkit2); |
|
3661 | ||
3662 | (function(UI) { |
|
3663 |
@@ 2-307 (lines=306) @@ | ||
1 | /*! UIkit 2.27.4 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ |
|
2 | (function(UI) { |
|
3 | ||
4 | "use strict"; |
|
5 | ||
6 | var Animations; |
|
7 | ||
8 | UI.component('switcher', { |
|
9 | ||
10 | defaults: { |
|
11 | connect : false, |
|
12 | toggle : '>*', |
|
13 | active : 0, |
|
14 | animation : false, |
|
15 | duration : 200, |
|
16 | swiping : true |
|
17 | }, |
|
18 | ||
19 | animating: false, |
|
20 | ||
21 | boot: function() { |
|
22 | ||
23 | // init code |
|
24 | UI.ready(function(context) { |
|
25 | ||
26 | UI.$('[data-uk-switcher]', context).each(function() { |
|
27 | var switcher = UI.$(this); |
|
28 | ||
29 | if (!switcher.data('switcher')) { |
|
30 | var obj = UI.switcher(switcher, UI.Utils.options(switcher.attr('data-uk-switcher'))); |
|
31 | } |
|
32 | }); |
|
33 | }); |
|
34 | }, |
|
35 | ||
36 | init: function() { |
|
37 | ||
38 | var $this = this; |
|
39 | ||
40 | this.on('click.uk.switcher', this.options.toggle, function(e) { |
|
41 | e.preventDefault(); |
|
42 | $this.show(this); |
|
43 | }); |
|
44 | ||
45 | if (!this.options.connect) { |
|
46 | return; |
|
47 | } |
|
48 | ||
49 | this.connect = UI.$(this.options.connect); |
|
50 | ||
51 | if (!this.connect.length) { |
|
52 | return; |
|
53 | } |
|
54 | ||
55 | this.connect.on('click.uk.switcher', '[data-uk-switcher-item]', function(e) { |
|
56 | ||
57 | e.preventDefault(); |
|
58 | ||
59 | var item = UI.$(this).attr('data-uk-switcher-item'); |
|
60 | ||
61 | if ($this.index == item) return; |
|
62 | ||
63 | switch(item) { |
|
64 | case 'next': |
|
65 | case 'previous': |
|
66 | $this.show($this.index + (item=='next' ? 1:-1)); |
|
67 | break; |
|
68 | default: |
|
69 | $this.show(parseInt(item, 10)); |
|
70 | } |
|
71 | }); |
|
72 | ||
73 | if (this.options.swiping) { |
|
74 | ||
75 | this.connect.on('swipeRight swipeLeft', function(e) { |
|
76 | e.preventDefault(); |
|
77 | if (!window.getSelection().toString()) { |
|
78 | $this.show($this.index + (e.type == 'swipeLeft' ? 1 : -1)); |
|
79 | } |
|
80 | }); |
|
81 | } |
|
82 | ||
83 | this.update(); |
|
84 | }, |
|
85 | ||
86 | update: function() { |
|
87 | ||
88 | this.connect.children().removeClass('uk-active').attr('aria-hidden', 'true'); |
|
89 | ||
90 | var toggles = this.find(this.options.toggle), |
|
91 | active = toggles.filter('.uk-active'); |
|
92 | ||
93 | if (active.length) { |
|
94 | this.show(active, false); |
|
95 | } else { |
|
96 | ||
97 | if (this.options.active===false) return; |
|
98 | ||
99 | active = toggles.eq(this.options.active); |
|
100 | this.show(active.length ? active : toggles.eq(0), false); |
|
101 | } |
|
102 | ||
103 | // Init ARIA for toggles |
|
104 | toggles.not(active).attr('aria-expanded', 'false'); |
|
105 | active.attr('aria-expanded', 'true'); |
|
106 | }, |
|
107 | ||
108 | show: function(tab, animate) { |
|
109 | ||
110 | if (this.animating) { |
|
111 | return; |
|
112 | } |
|
113 | ||
114 | var toggles = this.find(this.options.toggle); |
|
115 | ||
116 | if (isNaN(tab)) { |
|
117 | tab = UI.$(tab); |
|
118 | } else { |
|
119 | tab = tab < 0 ? toggles.length-1 : tab; |
|
120 | tab = toggles.eq(toggles[tab] ? tab : 0); |
|
121 | } |
|
122 | ||
123 | var $this = this, |
|
124 | active = UI.$(tab), |
|
125 | animation = Animations[this.options.animation] || function(current, next) { |
|
126 | ||
127 | if (!$this.options.animation) { |
|
128 | return Animations.none.apply($this); |
|
129 | } |
|
130 | ||
131 | var anim = $this.options.animation.split(','); |
|
132 | ||
133 | if (anim.length == 1) { |
|
134 | anim[1] = anim[0]; |
|
135 | } |
|
136 | ||
137 | anim[0] = anim[0].trim(); |
|
138 | anim[1] = anim[1].trim(); |
|
139 | ||
140 | return coreAnimation.apply($this, [anim, current, next]); |
|
141 | }; |
|
142 | ||
143 | if (animate===false || !UI.support.animation) { |
|
144 | animation = Animations.none; |
|
145 | } |
|
146 | ||
147 | if (active.hasClass("uk-disabled")) return; |
|
148 | ||
149 | // Update ARIA for Toggles |
|
150 | toggles.attr('aria-expanded', 'false'); |
|
151 | active.attr('aria-expanded', 'true'); |
|
152 | ||
153 | toggles.filter(".uk-active").removeClass("uk-active"); |
|
154 | active.addClass("uk-active"); |
|
155 | ||
156 | if (this.options.connect && this.connect.length) { |
|
157 | ||
158 | this.index = this.find(this.options.toggle).index(active); |
|
159 | ||
160 | if (this.index == -1 ) { |
|
161 | this.index = 0; |
|
162 | } |
|
163 | ||
164 | this.connect.each(function() { |
|
165 | ||
166 | var container = UI.$(this), |
|
167 | children = UI.$(container.children()), |
|
168 | current = UI.$(children.filter('.uk-active')), |
|
169 | next = UI.$(children.eq($this.index)); |
|
170 | ||
171 | $this.animating = true; |
|
172 | ||
173 | animation.apply($this, [current, next]).then(function(){ |
|
174 | ||
175 | current.removeClass("uk-active"); |
|
176 | next.addClass("uk-active"); |
|
177 | ||
178 | // Update ARIA for connect |
|
179 | current.attr('aria-hidden', 'true'); |
|
180 | next.attr('aria-hidden', 'false'); |
|
181 | ||
182 | UI.Utils.checkDisplay(next, true); |
|
183 | ||
184 | $this.animating = false; |
|
185 | ||
186 | }); |
|
187 | }); |
|
188 | } |
|
189 | ||
190 | this.trigger("show.uk.switcher", [active]); |
|
191 | } |
|
192 | }); |
|
193 | ||
194 | Animations = { |
|
195 | ||
196 | 'none': function() { |
|
197 | var d = UI.$.Deferred(); |
|
198 | d.resolve(); |
|
199 | return d.promise(); |
|
200 | }, |
|
201 | ||
202 | 'fade': function(current, next) { |
|
203 | return coreAnimation.apply(this, ['uk-animation-fade', current, next]); |
|
204 | }, |
|
205 | ||
206 | 'slide-bottom': function(current, next) { |
|
207 | return coreAnimation.apply(this, ['uk-animation-slide-bottom', current, next]); |
|
208 | }, |
|
209 | ||
210 | 'slide-top': function(current, next) { |
|
211 | return coreAnimation.apply(this, ['uk-animation-slide-top', current, next]); |
|
212 | }, |
|
213 | ||
214 | 'slide-vertical': function(current, next, dir) { |
|
215 | ||
216 | var anim = ['uk-animation-slide-top', 'uk-animation-slide-bottom']; |
|
217 | ||
218 | if (current && current.index() > next.index()) { |
|
219 | anim.reverse(); |
|
220 | } |
|
221 | ||
222 | return coreAnimation.apply(this, [anim, current, next]); |
|
223 | }, |
|
224 | ||
225 | 'slide-left': function(current, next) { |
|
226 | return coreAnimation.apply(this, ['uk-animation-slide-left', current, next]); |
|
227 | }, |
|
228 | ||
229 | 'slide-right': function(current, next) { |
|
230 | return coreAnimation.apply(this, ['uk-animation-slide-right', current, next]); |
|
231 | }, |
|
232 | ||
233 | 'slide-horizontal': function(current, next, dir) { |
|
234 | ||
235 | var anim = ['uk-animation-slide-right', 'uk-animation-slide-left']; |
|
236 | ||
237 | if (current && current.index() > next.index()) { |
|
238 | anim.reverse(); |
|
239 | } |
|
240 | ||
241 | return coreAnimation.apply(this, [anim, current, next]); |
|
242 | }, |
|
243 | ||
244 | 'scale': function(current, next) { |
|
245 | return coreAnimation.apply(this, ['uk-animation-scale-up', current, next]); |
|
246 | } |
|
247 | }; |
|
248 | ||
249 | UI.switcher.animations = Animations; |
|
250 | ||
251 | ||
252 | // helpers |
|
253 | ||
254 | function coreAnimation(cls, current, next) { |
|
255 | ||
256 | var d = UI.$.Deferred(), clsIn = cls, clsOut = cls, release; |
|
257 | ||
258 | if (next[0]===current[0]) { |
|
259 | d.resolve(); |
|
260 | return d.promise(); |
|
261 | } |
|
262 | ||
263 | if (typeof(cls) == 'object') { |
|
264 | clsIn = cls[0]; |
|
265 | clsOut = cls[1] || cls[0]; |
|
266 | } |
|
267 | ||
268 | UI.$body.css('overflow-x', 'hidden'); // fix scroll jumping in iOS |
|
269 | ||
270 | release = function() { |
|
271 | ||
272 | if (current) current.hide().removeClass('uk-active '+clsOut+' uk-animation-reverse'); |
|
273 | ||
274 | next.addClass(clsIn).one(UI.support.animation.end, function() { |
|
275 | ||
276 | setTimeout(function () { |
|
277 | next.removeClass(''+clsIn+'').css({opacity:'', display:''}); |
|
278 | }, 0); |
|
279 | ||
280 | d.resolve(); |
|
281 | ||
282 | UI.$body.css('overflow-x', ''); |
|
283 | ||
284 | if (current) current.css({opacity:'', display:''}); |
|
285 | ||
286 | }.bind(this)).show(); |
|
287 | }; |
|
288 | ||
289 | next.css('animation-duration', this.options.duration+'ms'); |
|
290 | ||
291 | if (current && current.length) { |
|
292 | ||
293 | current.css('animation-duration', this.options.duration+'ms'); |
|
294 | ||
295 | current.css('display', 'none').addClass(clsOut+' uk-animation-reverse').one(UI.support.animation.end, function() { |
|
296 | release(); |
|
297 | }.bind(this)).css('display', ''); |
|
298 | ||
299 | } else { |
|
300 | next.addClass('uk-active'); |
|
301 | release(); |
|
302 | } |
|
303 | ||
304 | return d.promise(); |
|
305 | } |
|
306 | ||
307 | })(UIkit2); |
|
308 |