|
| |
1
| +/** |
|
| |
2
| + * Owl carousel |
|
| |
3
| + * @version 2.0.0 |
|
| |
4
| + * @author Bartosz Wojciechowski |
|
| |
5
| + * @license The MIT License (MIT) |
|
| |
6
| + * @todo Lazy Load Icon |
|
| |
7
| + * @todo prevent animationend bubling |
|
| |
8
| + * @todo itemsScaleUp |
|
| |
9
| + * @todo Test Zepto |
|
| |
10
| + * @todo stagePadding calculate wrong active classes |
|
| |
11
| + */ |
|
| |
12
| +;(function($, window, document, undefined) { |
|
| |
13
| + |
|
| |
14
| + var drag, state, e; |
|
| |
15
| + |
|
| |
16
| + /** |
|
| |
17
| + * Template for status information about drag and touch events. |
|
| |
18
| + * @private |
|
| |
19
| + */ |
|
| |
20
| + drag = { |
|
| |
21
| + start: 0, |
|
| |
22
| + startX: 0, |
|
| |
23
| + startY: 0, |
|
| |
24
| + current: 0, |
|
| |
25
| + currentX: 0, |
|
| |
26
| + currentY: 0, |
|
| |
27
| + offsetX: 0, |
|
| |
28
| + offsetY: 0, |
|
| |
29
| + distance: null, |
|
| |
30
| + startTime: 0, |
|
| |
31
| + endTime: 0, |
|
| |
32
| + updatedX: 0, |
|
| |
33
| + targetEl: null |
|
| |
34
| + }; |
|
| |
35
| + |
|
| |
36
| + /** |
|
| |
37
| + * Template for some status informations. |
|
| |
38
| + * @private |
|
| |
39
| + */ |
|
| |
40
| + state = { |
|
| |
41
| + isTouch: false, |
|
| |
42
| + isScrolling: false, |
|
| |
43
| + isSwiping: false, |
|
| |
44
| + direction: false, |
|
| |
45
| + inMotion: false |
|
| |
46
| + }; |
|
| |
47
| + |
|
| |
48
| + /** |
|
| |
49
| + * Event functions references. |
|
| |
50
| + * @private |
|
| |
51
| + */ |
|
| |
52
| + e = { |
|
| |
53
| + _onDragStart: null, |
|
| |
54
| + _onDragMove: null, |
|
| |
55
| + _onDragEnd: null, |
|
| |
56
| + _transitionEnd: null, |
|
| |
57
| + _resizer: null, |
|
| |
58
| + _responsiveCall: null, |
|
| |
59
| + _goToLoop: null, |
|
| |
60
| + _checkVisibile: null |
|
| |
61
| + }; |
|
| |
62
| + |
|
| |
63
| + /** |
|
| |
64
| + * Creates a carousel. |
|
| |
65
| + * @class The Owl Carousel. |
|
| |
66
| + * @public |
|
| |
67
| + * @param {HTMLElement|jQuery} element - The element to create the carousel for. |
|
| |
68
| + * @param {Object} [options] - The options |
|
| |
69
| + */ |
|
| |
70
| + function Owl(element, options) { |
|
| |
71
| + |
|
| |
72
| + /** |
|
| |
73
| + * Current settings for the carousel. |
|
| |
74
| + * @public |
|
| |
75
| + */ |
|
| |
76
| + this.settings = null; |
|
| |
77
| + |
|
| |
78
| + /** |
|
| |
79
| + * Current options set by the caller including defaults. |
|
| |
80
| + * @public |
|
| |
81
| + */ |
|
| |
82
| + this.options = $.extend({}, Owl.Defaults, options); |
|
| |
83
| + |
|
| |
84
| + /** |
|
| |
85
| + * Plugin element. |
|
| |
86
| + * @public |
|
| |
87
| + */ |
|
| |
88
| + this.$element = $(element); |
|
| |
89
| + |
|
| |
90
| + /** |
|
| |
91
| + * Caches informations about drag and touch events. |
|
| |
92
| + */ |
|
| |
93
| + this.drag = $.extend({}, drag); |
|
| |
94
| + |
|
| |
95
| + /** |
|
| |
96
| + * Caches some status informations. |
|
| |
97
| + * @protected |
|
| |
98
| + */ |
|
| |
99
| + this.state = $.extend({}, state); |
|
| |
100
| + |
|
| |
101
| + /** |
|
| |
102
| + * @protected |
|
| |
103
| + * @todo Must be documented |
|
| |
104
| + */ |
|
| |
105
| + this.e = $.extend({}, e); |
|
| |
106
| + |
|
| |
107
| + /** |
|
| |
108
| + * References to the running plugins of this carousel. |
|
| |
109
| + * @protected |
|
| |
110
| + */ |
|
| |
111
| + this._plugins = {}; |
|
| |
112
| + |
|
| |
113
| + /** |
|
| |
114
| + * Currently suppressed events to prevent them from beeing retriggered. |
|
| |
115
| + * @protected |
|
| |
116
| + */ |
|
| |
117
| + this._supress = {}; |
|
| |
118
| + |
|
| |
119
| + /** |
|
| |
120
| + * Absolute current position. |
|
| |
121
| + * @protected |
|
| |
122
| + */ |
|
| |
123
| + this._current = null; |
|
| |
124
| + |
|
| |
125
| + /** |
|
| |
126
| + * Animation speed in milliseconds. |
|
| |
127
| + * @protected |
|
| |
128
| + */ |
|
| |
129
| + this._speed = null; |
|
| |
130
| + |
|
| |
131
| + /** |
|
| |
132
| + * Coordinates of all items in pixel. |
|
| |
133
| + * @todo The name of this member is missleading. |
|
| |
134
| + * @protected |
|
| |
135
| + */ |
|
| |
136
| + this._coordinates = []; |
|
| |
137
| + |
|
| |
138
| + /** |
|
| |
139
| + * Current breakpoint. |
|
| |
140
| + * @todo Real media queries would be nice. |
|
| |
141
| + * @protected |
|
| |
142
| + */ |
|
| |
143
| + this._breakpoint = null; |
|
| |
144
| + |
|
| |
145
| + /** |
|
| |
146
| + * Current width of the plugin element. |
|
| |
147
| + */ |
|
| |
148
| + this._width = null; |
|
| |
149
| + |
|
| |
150
| + /** |
|
| |
151
| + * All real items. |
|
| |
152
| + * @protected |
|
| |
153
| + */ |
|
| |
154
| + this._items = []; |
|
| |
155
| + |
|
| |
156
| + /** |
|
| |
157
| + * All cloned items. |
|
| |
158
| + * @protected |
|
| |
159
| + */ |
|
| |
160
| + this._clones = []; |
|
| |
161
| + |
|
| |
162
| + /** |
|
| |
163
| + * Merge values of all items. |
|
| |
164
| + * @todo Maybe this could be part of a plugin. |
|
| |
165
| + * @protected |
|
| |
166
| + */ |
|
| |
167
| + this._mergers = []; |
|
| |
168
| + |
|
| |
169
| + /** |
|
| |
170
| + * Invalidated parts within the update process. |
|
| |
171
| + * @protected |
|
| |
172
| + */ |
|
| |
173
| + this._invalidated = {}; |
|
| |
174
| + |
|
| |
175
| + /** |
|
| |
176
| + * Ordered list of workers for the update process. |
|
| |
177
| + * @protected |
|
| |
178
| + */ |
|
| |
179
| + this._pipe = []; |
|
| |
180
| + |
|
| |
181
| + $.each(Owl.Plugins, $.proxy(function(key, plugin) { |
|
| |
182
| + this._plugins[key[0].toLowerCase() + key.slice(1)] |
|
| |
183
| + = new plugin(this); |
|
| |
184
| + }, this)); |
|
| |
185
| + |
|
| |
186
| + $.each(Owl.Pipe, $.proxy(function(priority, worker) { |
|
| |
187
| + this._pipe.push({ |
|
| |
188
| + 'filter': worker.filter, |
|
| |
189
| + 'run': $.proxy(worker.run, this) |
|
| |
190
| + }); |
|
| |
191
| + }, this)); |
|
| |
192
| + |
|
| |
193
| + this.setup(); |
|
| |
194
| + this.initialize(); |
|
| |
195
| + } |
|
| |
196
| + |
|
| |
197
| + /** |
|
| |
198
| + * Default options for the carousel. |
|
| |
199
| + * @public |
|
| |
200
| + */ |
|
| |
201
| + Owl.Defaults = { |
|
| |
202
| + items: 3, |
|
| |
203
| + loop: false, |
|
| |
204
| + center: false, |
|
| |
205
| + |
|
| |
206
| + mouseDrag: true, |
|
| |
207
| + touchDrag: true, |
|
| |
208
| + pullDrag: true, |
|
| |
209
| + freeDrag: false, |
|
| |
210
| + |
|
| |
211
| + margin: 0, |
|
| |
212
| + stagePadding: 0, |
|
| |
213
| + |
|
| |
214
| + merge: false, |
|
| |
215
| + mergeFit: true, |
|
| |
216
| + autoWidth: false, |
|
| |
217
| + |
|
| |
218
| + startPosition: 0, |
|
| |
219
| + rtl: false, |
|
| |
220
| + |
|
| |
221
| + smartSpeed: 250, |
|
| |
222
| + fluidSpeed: false, |
|
| |
223
| + dragEndSpeed: false, |
|
| |
224
| + |
|
| |
225
| + responsive: {}, |
|
| |
226
| + responsiveRefreshRate: 200, |
|
| |
227
| + responsiveBaseElement: window, |
|
| |
228
| + responsiveClass: false, |
|
| |
229
| + |
|
| |
230
| + fallbackEasing: 'swing', |
|
| |
231
| + |
|
| |
232
| + info: false, |
|
| |
233
| + |
|
| |
234
| + nestedItemSelector: false, |
|
| |
235
| + itemElement: 'div', |
|
| |
236
| + stageElement: 'div', |
|
| |
237
| + |
|
| |
238
| + // Classes and Names |
|
| |
239
| + themeClass: 'owl-theme', |
|
| |
240
| + baseClass: 'owl-carousel', |
|
| |
241
| + itemClass: 'owl-item', |
|
| |
242
| + centerClass: 'center', |
|
| |
243
| + activeClass: 'active' |
|
| |
244
| + }; |
|
| |
245
| + |
|
| |
246
| + /** |
|
| |
247
| + * Enumeration for width. |
|
| |
248
| + * @public |
|
| |
249
| + * @readonly |
|
| |
250
| + * @enum {String} |
|
| |
251
| + */ |
|
| |
252
| + Owl.Width = { |
|
| |
253
| + Default: 'default', |
|
| |
254
| + Inner: 'inner', |
|
| |
255
| + Outer: 'outer' |
|
| |
256
| + }; |
|
| |
257
| + |
|
| |
258
| + /** |
|
| |
259
| + * Contains all registered plugins. |
|
| |
260
| + * @public |
|
| |
261
| + */ |
|
| |
262
| + Owl.Plugins = {}; |
|
| |
263
| + |
|
| |
264
| + /** |
|
| |
265
| + * Update pipe. |
|
| |
266
| + */ |
|
| |
267
| + Owl.Pipe = [ { |
|
| |
268
| + filter: [ 'width', 'items', 'settings' ], |
|
| |
269
| + run: function(cache) { |
|
| |
270
| + cache.current = this._items && this._items[this.relative(this._current)]; |
|
| |
271
| + } |
|
| |
272
| + }, { |
|
| |
273
| + filter: [ 'items', 'settings' ], |
|
| |
274
| + run: function() { |
|
| |
275
| + var cached = this._clones, |
|
| |
276
| + clones = this.$stage.children('.cloned'); |
|
| |
277
| + |
|
| |
278
| + if (clones.length !== cached.length || (!this.settings.loop && cached.length > 0)) { |
|
| |
279
| + this.$stage.children('.cloned').remove(); |
|
| |
280
| + this._clones = []; |
|
| |
281
| + } |
|
| |
282
| + } |
|
| |
283
| + }, { |
|
| |
284
| + filter: [ 'items', 'settings' ], |
|
| |
285
| + run: function() { |
|
| |
286
| + var i, n, |
|
| |
287
| + clones = this._clones, |
|
| |
288
| + items = this._items, |
|
| |
289
| + delta = this.settings.loop ? clones.length - Math.max(this.settings.items * 2, 4) : 0; |
|
| |
290
| + |
|
| |
291
| + for (i = 0, n = Math.abs(delta / 2); i < n; i++) { |
|
| |
292
| + if (delta > 0) { |
|
| |
293
| + this.$stage.children().eq(items.length + clones.length - 1).remove(); |
|
| |
294
| + clones.pop(); |
|
| |
295
| + this.$stage.children().eq(0).remove(); |
|
| |
296
| + clones.pop(); |
|
| |
297
| + } else { |
|
| |
298
| + clones.push(clones.length / 2); |
|
| |
299
| + this.$stage.append(items[clones[clones.length - 1]].clone().addClass('cloned')); |
|
| |
300
| + clones.push(items.length - 1 - (clones.length - 1) / 2); |
|
| |
301
| + this.$stage.prepend(items[clones[clones.length - 1]].clone().addClass('cloned')); |
|
| |
302
| + } |
|
| |
303
| + } |
|
| |
304
| + } |
|
| |
305
| + }, { |
|
| |
306
| + filter: [ 'width', 'items', 'settings' ], |
|
| |
307
| + run: function() { |
|
| |
308
| + var rtl = (this.settings.rtl ? 1 : -1), |
|
| |
309
| + width = (this.width() / this.settings.items).toFixed(3), |
|
| |
310
| + coordinate = 0, merge, i, n; |
|
| |
311
| + |
|
| |
312
| + this._coordinates = []; |
|
| |
313
| + for (i = 0, n = this._clones.length + this._items.length; i < n; i++) { |
|
| |
314
| + merge = this._mergers[this.relative(i)]; |
|
| |
315
| + merge = (this.settings.mergeFit && Math.min(merge, this.settings.items)) || merge; |
|
| |
316
| + coordinate += (this.settings.autoWidth ? this._items[this.relative(i)].width() + this.settings.margin : width * merge) * rtl; |
|
| |
317
| + |
|
| |
318
| + this._coordinates.push(coordinate); |
|
| |
319
| + } |
|
| |
320
| + } |
|
| |
321
| + }, { |
|
| |
322
| + filter: [ 'width', 'items', 'settings' ], |
|
| |
323
| + run: function() { |
|
| |
324
| + var i, n, width = (this.width() / this.settings.items).toFixed(3), css = { |
|
| |
325
| + 'width': Math.abs(this._coordinates[this._coordinates.length - 1]) + this.settings.stagePadding * 2, |
|
| |
326
| + 'padding-left': this.settings.stagePadding || '', |
|
| |
327
| + 'padding-right': this.settings.stagePadding || '' |
|
| |
328
| + }; |
|
| |
329
| + |
|
| |
330
| + this.$stage.css(css); |
|
| |
331
| + |
|
| |
332
| + css = { 'width': this.settings.autoWidth ? 'auto' : width - this.settings.margin }; |
|
| |
333
| + css[this.settings.rtl ? 'margin-left' : 'margin-right'] = this.settings.margin; |
|
| |
334
| + |
|
| |
335
| + if (!this.settings.autoWidth && $.grep(this._mergers, function(v) { return v > 1 }).length > 0) { |
|
| |
336
| + for (i = 0, n = this._coordinates.length; i < n; i++) { |
|
| |
337
| + css.width = Math.abs(this._coordinates[i]) - Math.abs(this._coordinates[i - 1] || 0) - this.settings.margin; |
|
| |
338
| + this.$stage.children().eq(i).css(css); |
|
| |
339
| + } |
|
| |
340
| + } else { |
|
| |
341
| + this.$stage.children().css(css); |
|
| |
342
| + } |
|
| |
343
| + } |
|
| |
344
| + }, { |
|
| |
345
| + filter: [ 'width', 'items', 'settings' ], |
|
| |
346
| + run: function(cache) { |
|
| |
347
| + cache.current && this.reset(this.$stage.children().index(cache.current)); |
|
| |
348
| + } |
|
| |
349
| + }, { |
|
| |
350
| + filter: [ 'position' ], |
|
| |
351
| + run: function() { |
|
| |
352
| + this.animate(this.coordinates(this._current)); |
|
| |
353
| + } |
|
| |
354
| + }, { |
|
| |
355
| + filter: [ 'width', 'position', 'items', 'settings' ], |
|
| |
356
| + run: function() { |
|
| |
357
| + var rtl = this.settings.rtl ? 1 : -1, |
|
| |
358
| + padding = this.settings.stagePadding * 2, |
|
| |
359
| + begin = this.coordinates(this.current()) + padding, |
|
| |
360
| + end = begin + this.width() * rtl, |
|
| |
361
| + inner, outer, matches = [], i, n; |
|
| |
362
| + |
|
| |
363
| + for (i = 0, n = this._coordinates.length; i < n; i++) { |
|
| |
364
| + inner = this._coordinates[i - 1] || 0; |
|
| |
365
| + outer = Math.abs(this._coordinates[i]) + padding * rtl; |
|
| |
366
| + |
|
| |
367
| + if ((this.op(inner, '<=', begin) && (this.op(inner, '>', end))) |
|
| |
368
| + || (this.op(outer, '<', begin) && this.op(outer, '>', end))) { |
|
| |
369
| + matches.push(i); |
|
| |
370
| + } |
|
| |
371
| + } |
|
| |
372
| + |
|
| |
373
| + this.$stage.children('.' + this.settings.activeClass).removeClass(this.settings.activeClass); |
|
| |
374
| + this.$stage.children(':eq(' + matches.join('), :eq(') + ')').addClass(this.settings.activeClass); |
|
| |
375
| + |
|
| |
376
| + if (this.settings.center) { |
|
| |
377
| + this.$stage.children('.' + this.settings.centerClass).removeClass(this.settings.centerClass); |
|
| |
378
| + this.$stage.children().eq(this.current()).addClass(this.settings.centerClass); |
|
| |
379
| + } |
|
| |
380
| + } |
|
| |
381
| + } ]; |
|
| |
382
| + |
|
| |
383
| + /** |
|
| |
384
| + * Initializes the carousel. |
|
| |
385
| + * @protected |
|
| |
386
| + */ |
|
| |
387
| + Owl.prototype.initialize = function() { |
|
| |
388
| + this.trigger('initialize'); |
|
| |
389
| + |
|
| |
390
| + this.$element |
|
| |
391
| + .addClass(this.settings.baseClass) |
|
| |
392
| + .addClass(this.settings.themeClass) |
|
| |
393
| + .toggleClass('owl-rtl', this.settings.rtl); |
|
| |
394
| + |
|
| |
395
| + // check support |
|
| |
396
| + this.browserSupport(); |
|
| |
397
| + |
|
| |
398
| + if (this.settings.autoWidth && this.state.imagesLoaded !== true) { |
|
| |
399
| + var imgs, nestedSelector, width; |
|
| |
400
| + imgs = this.$element.find('img'); |
|
| |
401
| + nestedSelector = this.settings.nestedItemSelector ? '.' + this.settings.nestedItemSelector : undefined; |
|
| |
402
| + width = this.$element.children(nestedSelector).width(); |
|
| |
403
| + |
|
| |
404
| + if (imgs.length && width <= 0) { |
|
| |
405
| + this.preloadAutoWidthImages(imgs); |
|
| |
406
| + return false; |
|
| |
407
| + } |
|
| |
408
| + } |
|
| |
409
| + |
|
| |
410
| + this.$element.addClass('owl-loading'); |
|
| |
411
| + |
|
| |
412
| + // create stage |
|
| |
413
| + this.$stage = $('<' + this.settings.stageElement + ' class="owl-stage"/>') |
|
| |
414
| + .wrap('<div class="owl-stage-outer">'); |
|
| |
415
| + |
|
| |
416
| + // append stage |
|
| |
417
| + this.$element.append(this.$stage.parent()); |
|
| |
418
| + |
|
| |
419
| + // append content |
|
| |
420
| + this.replace(this.$element.children().not(this.$stage.parent())); |
|
| |
421
| + |
|
| |
422
| + // set view width |
|
| |
423
| + this._width = this.$element.width(); |
|
| |
424
| + |
|
| |
425
| + // update view |
|
| |
426
| + this.refresh(); |
|
| |
427
| + |
|
| |
428
| + this.$element.removeClass('owl-loading').addClass('owl-loaded'); |
|
| |
429
| + |
|
| |
430
| + // attach generic events |
|
| |
431
| + this.eventsCall(); |
|
| |
432
| + |
|
| |
433
| + // attach generic events |
|
| |
434
| + this.internalEvents(); |
|
| |
435
| + |
|
| |
436
| + // attach custom control events |
|
| |
437
| + this.addTriggerableEvents(); |
|
| |
438
| + |
|
| |
439
| + this.trigger('initialized'); |
|
| |
440
| + }; |
|
| |
441
| + |
|
| |
442
| + /** |
|
| |
443
| + * Setups the current settings. |
|
| |
444
| + * @todo Remove responsive classes. Why should adaptive designs be brought into IE8? |
|
| |
445
| + * @todo Support for media queries by using `matchMedia` would be nice. |
|
| |
446
| + * @public |
|
| |
447
| + */ |
|
| |
448
| + Owl.prototype.setup = function() { |
|
| |
449
| + var viewport = this.viewport(), |
|
| |
450
| + overwrites = this.options.responsive, |
|
| |
451
| + match = -1, |
|
| |
452
| + settings = null; |
|
| |
453
| + |
|
| |
454
| + if (!overwrites) { |
|
| |
455
| + settings = $.extend({}, this.options); |
|
| |
456
| + } else { |
|
| |
457
| + $.each(overwrites, function(breakpoint) { |
|
| |
458
| + if (breakpoint <= viewport && breakpoint > match) { |
|
| |
459
| + match = Number(breakpoint); |
|
| |
460
| + } |
|
| |
461
| + }); |
|
| |
462
| + |
|
| |
463
| + settings = $.extend({}, this.options, overwrites[match]); |
|
| |
464
| + delete settings.responsive; |
|
| |
465
| + |
|
| |
466
| + // responsive class |
|
| |
467
| + if (settings.responsiveClass) { |
|
| |
468
| + this.$element.attr('class', function(i, c) { |
|
| |
469
| + return c.replace(/\b owl-responsive-\S+/g, ''); |
|
| |
470
| + }).addClass('owl-responsive-' + match); |
|
| |
471
| + } |
|
| |
472
| + } |
|
| |
473
| + |
|
| |
474
| + if (this.settings === null || this._breakpoint !== match) { |
|
| |
475
| + this.trigger('change', { property: { name: 'settings', value: settings } }); |
|
| |
476
| + this._breakpoint = match; |
|
| |
477
| + this.settings = settings; |
|
| |
478
| + this.invalidate('settings'); |
|
| |
479
| + this.trigger('changed', { property: { name: 'settings', value: this.settings } }); |
|
| |
480
| + } |
|
| |
481
| + }; |
|
| |
482
| + |
|
| |
483
| + /** |
|
| |
484
| + * Updates option logic if necessery. |
|
| |
485
| + * @protected |
|
| |
486
| + */ |
|
| |
487
| + Owl.prototype.optionsLogic = function() { |
|
| |
488
| + // Toggle Center class |
|
| |
489
| + this.$element.toggleClass('owl-center', this.settings.center); |
|
| |
490
| + |
|
| |
491
| + // if items number is less than in body |
|
| |
492
| + if (this.settings.loop && this._items.length < this.settings.items) { |
|
| |
493
| + this.settings.loop = false; |
|
| |
494
| + } |
|
| |
495
| + |
|
| |
496
| + if (this.settings.autoWidth) { |
|
| |
497
| + this.settings.stagePadding = false; |
|
| |
498
| + this.settings.merge = false; |
|
| |
499
| + } |
|
| |
500
| + }; |
|
| |
501
| + |
|
| |
502
| + /** |
|
| |
503
| + * Prepares an item before add. |
|
| |
504
| + * @todo Rename event parameter `content` to `item`. |
|
| |
505
| + * @protected |
|
| |
506
| + * @returns {jQuery|HTMLElement} - The item container. |
|
| |
507
| + */ |
|
| |
508
| + Owl.prototype.prepare = function(item) { |
|
| |
509
| + var event = this.trigger('prepare', { content: item }); |
|
| |
510
| + |
|
| |
511
| + if (!event.data) { |
|
| |
512
| + event.data = $('<' + this.settings.itemElement + '/>') |
|
| |
513
| + .addClass(this.settings.itemClass).append(item) |
|
| |
514
| + } |
|
| |
515
| + |
|
| |
516
| + this.trigger('prepared', { content: event.data }); |
|
| |
517
| + |
|
| |
518
| + return event.data; |
|
| |
519
| + }; |
|
| |
520
| + |
|
| |
521
| + /** |
|
| |
522
| + * Updates the view. |
|
| |
523
| + * @public |
|
| |
524
| + */ |
|
| |
525
| + Owl.prototype.update = function() { |
|
| |
526
| + var i = 0, |
|
| |
527
| + n = this._pipe.length, |
|
| |
528
| + filter = $.proxy(function(p) { return this[p] }, this._invalidated), |
|
| |
529
| + cache = {}; |
|
| |
530
| + |
|
| |
531
| + while (i < n) { |
|
| |
532
| + if (this._invalidated.all || $.grep(this._pipe[i].filter, filter).length > 0) { |
|
| |
533
| + this._pipe[i].run(cache); |
|
| |
534
| + } |
|
| |
535
| + i++; |
|
| |
536
| + } |
|
| |
537
| + |
|
| |
538
| + this._invalidated = {}; |
|
| |
539
| + }; |
|
| |
540
| + |
|
| |
541
| + /** |
|
| |
542
| + * Gets the width of the view. |
|
| |
543
| + * @public |
|
| |
544
| + * @param {Owl.Width} [dimension=Owl.Width.Default] - The dimension to return. |
|
| |
545
| + * @returns {Number} - The width of the view in pixel. |
|
| |
546
| + */ |
|
| |
547
| + Owl.prototype.width = function(dimension) { |
|
| |
548
| + dimension = dimension || Owl.Width.Default; |
|
| |
549
| + switch (dimension) { |
|
| |
550
| + case Owl.Width.Inner: |
|
| |
551
| + case Owl.Width.Outer: |
|
| |
552
| + return this._width; |
|
| |
553
| + default: |
|
| |
554
| + return this._width - this.settings.stagePadding * 2 + this.settings.margin; |
|
| |
555
| + } |
|
| |
556
| + }; |
|
| |
557
| + |
|
| |
558
| + /** |
|
| |
559
| + * Refreshes the carousel primarily for adaptive purposes. |
|
| |
560
| + * @public |
|
| |
561
| + */ |
|
| |
562
| + Owl.prototype.refresh = function() { |
|
| |
563
| + if (this._items.length === 0) { |
|
| |
564
| + return false; |
|
| |
565
| + } |
|
| |
566
| + |
|
| |
567
| + var start = new Date().getTime(); |
|
| |
568
| + |
|
| |
569
| + this.trigger('refresh'); |
|
| |
570
| + |
|
| |
571
| + this.setup(); |
|
| |
572
| + |
|
| |
573
| + this.optionsLogic(); |
|
| |
574
| + |
|
| |
575
| + // hide and show methods helps here to set a proper widths, |
|
| |
576
| + // this prevents scrollbar to be calculated in stage width |
|
| |
577
| + this.$stage.addClass('owl-refresh'); |
|
| |
578
| + |
|
| |
579
| + this.update(); |
|
| |
580
| + |
|
| |
581
| + this.$stage.removeClass('owl-refresh'); |
|
| |
582
| + |
|
| |
583
| + this.state.orientation = window.orientation; |
|
| |
584
| + |
|
| |
585
| + this.watchVisibility(); |
|
| |
586
| + |
|
| |
587
| + this.trigger('refreshed'); |
|
| |
588
| + }; |
|
| |
589
| + |
|
| |
590
| + /** |
|
| |
591
| + * Save internal event references and add event based functions. |
|
| |
592
| + * @protected |
|
| |
593
| + */ |
|
| |
594
| + Owl.prototype.eventsCall = function() { |
|
| |
595
| + // Save events references |
|
| |
596
| + this.e._onDragStart = $.proxy(function(e) { |
|
| |
597
| + this.onDragStart(e); |
|
| |
598
| + }, this); |
|
| |
599
| + this.e._onDragMove = $.proxy(function(e) { |
|
| |
600
| + this.onDragMove(e); |
|
| |
601
| + }, this); |
|
| |
602
| + this.e._onDragEnd = $.proxy(function(e) { |
|
| |
603
| + this.onDragEnd(e); |
|
| |
604
| + }, this); |
|
| |
605
| + this.e._onResize = $.proxy(function(e) { |
|
| |
606
| + this.onResize(e); |
|
| |
607
| + }, this); |
|
| |
608
| + this.e._transitionEnd = $.proxy(function(e) { |
|
| |
609
| + this.transitionEnd(e); |
|
| |
610
| + }, this); |
|
| |
611
| + this.e._preventClick = $.proxy(function(e) { |
|
| |
612
| + this.preventClick(e); |
|
| |
613
| + }, this); |
|
| |
614
| + }; |
|
| |
615
| + |
|
| |
616
| + /** |
|
| |
617
| + * Checks window `resize` event. |
|
| |
618
| + * @protected |
|
| |
619
| + */ |
|
| |
620
| + Owl.prototype.onThrottledResize = function() { |
|
| |
621
| + window.clearTimeout(this.resizeTimer); |
|
| |
622
| + this.resizeTimer = window.setTimeout(this.e._onResize, this.settings.responsiveRefreshRate); |
|
| |
623
| + }; |
|
| |
624
| + |
|
| |
625
| + /** |
|
| |
626
| + * Checks window `resize` event. |
|
| |
627
| + * @protected |
|
| |
628
| + */ |
|
| |
629
| + Owl.prototype.onResize = function() { |
|
| |
630
| + if (!this._items.length) { |
|
| |
631
| + return false; |
|
| |
632
| + } |
|
| |
633
| + |
|
| |
634
| + if (this._width === this.$element.width()) { |
|
| |
635
| + return false; |
|
| |
636
| + } |
|
| |
637
| + |
|
| |
638
| + if (this.trigger('resize').isDefaultPrevented()) { |
|
| |
639
| + return false; |
|
| |
640
| + } |
|
| |
641
| + |
|
| |
642
| + this._width = this.$element.width(); |
|
| |
643
| + |
|
| |
644
| + this.invalidate('width'); |
|
| |
645
| + |
|
| |
646
| + this.refresh(); |
|
| |
647
| + |
|
| |
648
| + this.trigger('resized'); |
|
| |
649
| + }; |
|
| |
650
| + |
|
| |
651
| + /** |
|
| |
652
| + * Checks for touch/mouse drag event type and add run event handlers. |
|
| |
653
| + * @protected |
|
| |
654
| + */ |
|
| |
655
| + Owl.prototype.eventsRouter = function(event) { |
|
| |
656
| + var type = event.type; |
|
| |
657
| + |
|
| |
658
| + if (type === "mousedown" || type === "touchstart") { |
|
| |
659
| + this.onDragStart(event); |
|
| |
660
| + } else if (type === "mousemove" || type === "touchmove") { |
|
| |
661
| + this.onDragMove(event); |
|
| |
662
| + } else if (type === "mouseup" || type === "touchend") { |
|
| |
663
| + this.onDragEnd(event); |
|
| |
664
| + } else if (type === "touchcancel") { |
|
| |
665
| + this.onDragEnd(event); |
|
| |
666
| + } |
|
| |
667
| + }; |
|
| |
668
| + |
|
| |
669
| + /** |
|
| |
670
| + * Checks for touch/mouse drag options and add necessery event handlers. |
|
| |
671
| + * @protected |
|
| |
672
| + */ |
|
| |
673
| + Owl.prototype.internalEvents = function() { |
|
| |
674
| + var isTouch = isTouchSupport(), |
|
| |
675
| + isTouchIE = isTouchSupportIE(); |
|
| |
676
| + |
|
| |
677
| + if (this.settings.mouseDrag){ |
|
| |
678
| + this.$stage.on('mousedown', $.proxy(function(event) { this.eventsRouter(event) }, this)); |
|
| |
679
| + this.$stage.on('dragstart', function() { return false }); |
|
| |
680
| + this.$stage.get(0).onselectstart = function() { return false }; |
|
| |
681
| + } else { |
|
| |
682
| + this.$element.addClass('owl-text-select-on'); |
|
| |
683
| + } |
|
| |
684
| + |
|
| |
685
| + if (this.settings.touchDrag && !isTouchIE){ |
|
| |
686
| + this.$stage.on('touchstart touchcancel', $.proxy(function(event) { this.eventsRouter(event) }, this)); |
|
| |
687
| + } |
|
| |
688
| + |
|
| |
689
| + // catch transitionEnd event |
|
| |
690
| + if (this.transitionEndVendor) { |
|
| |
691
| + this.on(this.$stage.get(0), this.transitionEndVendor, this.e._transitionEnd, false); |
|
| |
692
| + } |
|
| |
693
| + |
|
| |
694
| + // responsive |
|
| |
695
| + if (this.settings.responsive !== false) { |
|
| |
696
| + this.on(window, 'resize', $.proxy(this.onThrottledResize, this)); |
|
| |
697
| + } |
|
| |
698
| + }; |
|
| |
699
| + |
|
| |
700
| + /** |
|
| |
701
| + * Handles touchstart/mousedown event. |
|
| |
702
| + * @protected |
|
| |
703
| + * @param {Event} event - The event arguments. |
|
| |
704
| + */ |
|
| |
705
| + Owl.prototype.onDragStart = function(event) { |
|
| |
706
| + var ev, isTouchEvent, pageX, pageY, animatedPos; |
|
| |
707
| + |
|
| |
708
| + ev = event.originalEvent || event || window.event; |
|
| |
709
| + |
|
| |
710
| + // prevent right click |
|
| |
711
| + if (ev.which === 3 || this.state.isTouch) { |
|
| |
712
| + return false; |
|
| |
713
| + } |
|
| |
714
| + |
|
| |
715
| + if (ev.type === 'mousedown') { |
|
| |
716
| + this.$stage.addClass('owl-grab'); |
|
| |
717
| + } |
|
| |
718
| + |
|
| |
719
| + this.trigger('drag'); |
|
| |
720
| + this.drag.startTime = new Date().getTime(); |
|
| |
721
| + this.speed(0); |
|
| |
722
| + this.state.isTouch = true; |
|
| |
723
| + this.state.isScrolling = false; |
|
| |
724
| + this.state.isSwiping = false; |
|
| |
725
| + this.drag.distance = 0; |
|
| |
726
| + |
|
| |
727
| + pageX = getTouches(ev).x; |
|
| |
728
| + pageY = getTouches(ev).y; |
|
| |
729
| + |
|
| |
730
| + // get stage position left |
|
| |
731
| + this.drag.offsetX = this.$stage.position().left; |
|
| |
732
| + this.drag.offsetY = this.$stage.position().top; |
|
| |
733
| + |
|
| |
734
| + if (this.settings.rtl) { |
|
| |
735
| + this.drag.offsetX = this.$stage.position().left + this.$stage.width() - this.width() |
|
| |
736
| + + this.settings.margin; |
|
| |
737
| + } |
|
| |
738
| + |
|
| |
739
| + // catch position // ie to fix |
|
| |
740
| + if (this.state.inMotion && this.support3d) { |
|
| |
741
| + animatedPos = this.getTransformProperty(); |
|
| |
742
| + this.drag.offsetX = animatedPos; |
|
| |
743
| + this.animate(animatedPos); |
|
| |
744
| + this.state.inMotion = true; |
|
| |
745
| + } else if (this.state.inMotion && !this.support3d) { |
|
| |
746
| + this.state.inMotion = false; |
|
| |
747
| + return false; |
|
| |
748
| + } |
|
| |
749
| + |
|
| |
750
| + this.drag.startX = pageX - this.drag.offsetX; |
|
| |
751
| + this.drag.startY = pageY - this.drag.offsetY; |
|
| |
752
| + |
|
| |
753
| + this.drag.start = pageX - this.drag.startX; |
|
| |
754
| + this.drag.targetEl = ev.target || ev.srcElement; |
|
| |
755
| + this.drag.updatedX = this.drag.start; |
|
| |
756
| + |
|
| |
757
| + // to do/check |
|
| |
758
| + // prevent links and images dragging; |
|
| |
759
| + if (this.drag.targetEl.tagName === "IMG" || this.drag.targetEl.tagName === "A") { |
|
| |
760
| + this.drag.targetEl.draggable = false; |
|
| |
761
| + } |
|
| |
762
| + |
|
| |
763
| + $(document).on('mousemove.owl.dragEvents mouseup.owl.dragEvents touchmove.owl.dragEvents touchend.owl.dragEvents', $.proxy(function(event) {this.eventsRouter(event)},this)); |
|
| |
764
| + }; |
|
| |
765
| + |
|
| |
766
| + /** |
|
| |
767
| + * Handles the touchmove/mousemove events. |
|
| |
768
| + * @todo Simplify |
|
| |
769
| + * @protected |
|
| |
770
| + * @param {Event} event - The event arguments. |
|
| |
771
| + */ |
|
| |
772
| + Owl.prototype.onDragMove = function(event) { |
|
| |
773
| + var ev, isTouchEvent, pageX, pageY, minValue, maxValue, pull; |
|
| |
774
| + |
|
| |
775
| + if (!this.state.isTouch) { |
|
| |
776
| + return; |
|
| |
777
| + } |
|
| |
778
| + |
|
| |
779
| + if (this.state.isScrolling) { |
|
| |
780
| + return; |
|
| |
781
| + } |
|
| |
782
| + |
|
| |
783
| + ev = event.originalEvent || event || window.event; |
|
| |
784
| + |
|
| |
785
| + pageX = getTouches(ev).x; |
|
| |
786
| + pageY = getTouches(ev).y; |
|
| |
787
| + |
|
| |
788
| + // Drag Direction |
|
| |
789
| + this.drag.currentX = pageX - this.drag.startX; |
|
| |
790
| + this.drag.currentY = pageY - this.drag.startY; |
|
| |
791
| + this.drag.distance = this.drag.currentX - this.drag.offsetX; |
|
| |
792
| + |
|
| |
793
| + // Check move direction |
|
| |
794
| + if (this.drag.distance < 0) { |
|
| |
795
| + this.state.direction = this.settings.rtl ? 'right' : 'left'; |
|
| |
796
| + } else if (this.drag.distance > 0) { |
|
| |
797
| + this.state.direction = this.settings.rtl ? 'left' : 'right'; |
|
| |
798
| + } |
|
| |
799
| + // Loop |
|
| |
800
| + if (this.settings.loop) { |
|
| |
801
| + if (this.op(this.drag.currentX, '>', this.coordinates(this.minimum())) && this.state.direction === 'right') { |
|
| |
802
| + this.drag.currentX -= (this.settings.center && this.coordinates(0)) - this.coordinates(this._items.length); |
|
| |
803
| + } else if (this.op(this.drag.currentX, '<', this.coordinates(this.maximum())) && this.state.direction === 'left') { |
|
| |
804
| + this.drag.currentX += (this.settings.center && this.coordinates(0)) - this.coordinates(this._items.length); |
|
| |
805
| + } |
|
| |
806
| + } else { |
|
| |
807
| + // pull |
|
| |
808
| + minValue = this.settings.rtl ? this.coordinates(this.maximum()) : this.coordinates(this.minimum()); |
|
| |
809
| + maxValue = this.settings.rtl ? this.coordinates(this.minimum()) : this.coordinates(this.maximum()); |
|
| |
810
| + pull = this.settings.pullDrag ? this.drag.distance / 5 : 0; |
|
| |
811
| + this.drag.currentX = Math.max(Math.min(this.drag.currentX, minValue + pull), maxValue + pull); |
|
| |
812
| + } |
|
| |
813
| + |
|
| |
814
| + // Lock browser if swiping horizontal |
|
| |
815
| + |
|
| |
816
| + if ((this.drag.distance > 8 || this.drag.distance < -8)) { |
|
| |
817
| + if (ev.preventDefault !== undefined) { |
|
| |
818
| + ev.preventDefault(); |
|
| |
819
| + } else { |
|
| |
820
| + ev.returnValue = false; |
|
| |
821
| + } |
|
| |
822
| + this.state.isSwiping = true; |
|
| |
823
| + } |
|
| |
824
| + |
|
| |
825
| + this.drag.updatedX = this.drag.currentX; |
|
| |
826
| + |
|
| |
827
| + // Lock Owl if scrolling |
|
| |
828
| + if ((this.drag.currentY > 16 || this.drag.currentY < -16) && this.state.isSwiping === false) { |
|
| |
829
| + this.state.isScrolling = true; |
|
| |
830
| + this.drag.updatedX = this.drag.start; |
|
| |
831
| + } |
|
| |
832
| + |
|
| |
833
| + this.animate(this.drag.updatedX); |
|
| |
834
| + }; |
|
| |
835
| + |
|
| |
836
| + /** |
|
| |
837
| + * Handles the touchend/mouseup events. |
|
| |
838
| + * @protected |
|
| |
839
| + */ |
|
| |
840
| + Owl.prototype.onDragEnd = function(event) { |
|
| |
841
| + var compareTimes, distanceAbs, closest; |
|
| |
842
| + |
|
| |
843
| + if (!this.state.isTouch) { |
|
| |
844
| + return; |
|
| |
845
| + } |
|
| |
846
| + |
|
| |
847
| + if (event.type === 'mouseup') { |
|
| |
848
| + this.$stage.removeClass('owl-grab'); |
|
| |
849
| + } |
|
| |
850
| + |
|
| |
851
| + this.trigger('dragged'); |
|
| |
852
| + |
|
| |
853
| + // prevent links and images dragging; |
|
| |
854
| + this.drag.targetEl.removeAttribute("draggable"); |
|
| |
855
| + |
|
| |
856
| + // remove drag event listeners |
|
| |
857
| + |
|
| |
858
| + this.state.isTouch = false; |
|
| |
859
| + this.state.isScrolling = false; |
|
| |
860
| + this.state.isSwiping = false; |
|
| |
861
| + |
|
| |
862
| + // to check |
|
| |
863
| + if (this.drag.distance === 0 && this.state.inMotion !== true) { |
|
| |
864
| + this.state.inMotion = false; |
|
| |
865
| + return false; |
|
| |
866
| + } |
|
| |
867
| + |
|
| |
868
| + // prevent clicks while scrolling |
|
| |
869
| + |
|
| |
870
| + this.drag.endTime = new Date().getTime(); |
|
| |
871
| + compareTimes = this.drag.endTime - this.drag.startTime; |
|
| |
872
| + distanceAbs = Math.abs(this.drag.distance); |
|
| |
873
| + |
|
| |
874
| + // to test |
|
| |
875
| + if (distanceAbs > 3 || compareTimes > 300) { |
|
| |
876
| + this.removeClick(this.drag.targetEl); |
|
| |
877
| + } |
|
| |
878
| + |
|
| |
879
| + closest = this.closest(this.drag.updatedX); |
|
| |
880
| + |
|
| |
881
| + this.speed(this.settings.dragEndSpeed || this.settings.smartSpeed); |
|
| |
882
| + this.current(closest); |
|
| |
883
| + this.invalidate('position'); |
|
| |
884
| + this.update(); |
|
| |
885
| + |
|
| |
886
| + // if pullDrag is off then fire transitionEnd event manually when stick |
|
| |
887
| + // to border |
|
| |
888
| + if (!this.settings.pullDrag && this.drag.updatedX === this.coordinates(closest)) { |
|
| |
889
| + this.transitionEnd(); |
|
| |
890
| + } |
|
| |
891
| + |
|
| |
892
| + this.drag.distance = 0; |
|
| |
893
| + |
|
| |
894
| + $(document).off('.owl.dragEvents'); |
|
| |
895
| + }; |
|
| |
896
| + |
|
| |
897
| + /** |
|
| |
898
| + * Attaches `preventClick` to disable link while swipping. |
|
| |
899
| + * @protected |
|
| |
900
| + * @param {HTMLElement} [target] - The target of the `click` event. |
|
| |
901
| + */ |
|
| |
902
| + Owl.prototype.removeClick = function(target) { |
|
| |
903
| + this.drag.targetEl = target; |
|
| |
904
| + $(target).on('click.preventClick', this.e._preventClick); |
|
| |
905
| + // to make sure click is removed: |
|
| |
906
| + window.setTimeout(function() { |
|
| |
907
| + $(target).off('click.preventClick'); |
|
| |
908
| + }, 300); |
|
| |
909
| + }; |
|
| |
910
| + |
|
| |
911
| + /** |
|
| |
912
| + * Suppresses click event. |
|
| |
913
| + * @protected |
|
| |
914
| + * @param {Event} ev - The event arguments. |
|
| |
915
| + */ |
|
| |
916
| + Owl.prototype.preventClick = function(ev) { |
|
| |
917
| + if (ev.preventDefault) { |
|
| |
918
| + ev.preventDefault(); |
|
| |
919
| + } else { |
|
| |
920
| + ev.returnValue = false; |
|
| |
921
| + } |
|
| |
922
| + if (ev.stopPropagation) { |
|
| |
923
| + ev.stopPropagation(); |
|
| |
924
| + } |
|
| |
925
| + $(ev.target).off('click.preventClick'); |
|
| |
926
| + }; |
|
| |
927
| + |
|
| |
928
| + /** |
|
| |
929
| + * Catches stage position while animate (only CSS3). |
|
| |
930
| + * @protected |
|
| |
931
| + * @returns |
|
| |
932
| + */ |
|
| |
933
| + Owl.prototype.getTransformProperty = function() { |
|
| |
934
| + var transform, matrix3d; |
|
| |
935
| + |
|
| |
936
| + transform = window.getComputedStyle(this.$stage.get(0), null).getPropertyValue(this.vendorName + 'transform'); |
|
| |
937
| + // var transform = this.$stage.css(this.vendorName + 'transform') |
|
| |
938
| + transform = transform.replace(/matrix(3d)?\(|\)/g, '').split(','); |
|
| |
939
| + matrix3d = transform.length === 16; |
|
| |
940
| + |
|
| |
941
| + return matrix3d !== true ? transform[4] : transform[12]; |
|
| |
942
| + }; |
|
| |
943
| + |
|
| |
944
| + /** |
|
| |
945
| + * Gets absolute position of the closest item for a coordinate. |
|
| |
946
| + * @todo Setting `freeDrag` makes `closest` not reusable. See #165. |
|
| |
947
| + * @protected |
|
| |
948
| + * @param {Number} coordinate - The coordinate in pixel. |
|
| |
949
| + * @return {Number} - The absolute position of the closest item. |
|
| |
950
| + */ |
|
| |
951
| + Owl.prototype.closest = function(coordinate) { |
|
| |
952
| + var position = -1, pull = 30, width = this.width(), coordinates = this.coordinates(); |
|
| |
953
| + |
|
| |
954
| + if (!this.settings.freeDrag) { |
|
| |
955
| + // check closest item |
|
| |
956
| + $.each(coordinates, $.proxy(function(index, value) { |
|
| |
957
| + if (coordinate > value - pull && coordinate < value + pull) { |
|
| |
958
| + position = index; |
|
| |
959
| + } else if (this.op(coordinate, '<', value) |
|
| |
960
| + && this.op(coordinate, '>', coordinates[index + 1] || value - width)) { |
|
| |
961
| + position = this.state.direction === 'left' ? index + 1 : index; |
|
| |
962
| + } |
|
| |
963
| + return position === -1; |
|
| |
964
| + }, this)); |
|
| |
965
| + } |
|
| |
966
| + |
|
| |
967
| + if (!this.settings.loop) { |
|
| |
968
| + // non loop boundries |
|
| |
969
| + if (this.op(coordinate, '>', coordinates[this.minimum()])) { |
|
| |
970
| + position = coordinate = this.minimum(); |
|
| |
971
| + } else if (this.op(coordinate, '<', coordinates[this.maximum()])) { |
|
| |
972
| + position = coordinate = this.maximum(); |
|
| |
973
| + } |
|
| |
974
| + } |
|
| |
975
| + |
|
| |
976
| + return position; |
|
| |
977
| + }; |
|
| |
978
| + |
|
| |
979
| + /** |
|
| |
980
| + * Animates the stage. |
|
| |
981
| + * @public |
|
| |
982
| + * @param {Number} coordinate - The coordinate in pixels. |
|
| |
983
| + */ |
|
| |
984
| + Owl.prototype.animate = function(coordinate) { |
|
| |
985
| + this.trigger('translate'); |
|
| |
986
| + this.state.inMotion = this.speed() > 0; |
|
| |
987
| + |
|
| |
988
| + if (this.support3d) { |
|
| |
989
| + this.$stage.css({ |
|
| |
990
| + transform: 'translate3d(' + coordinate + 'px' + ',0px, 0px)', |
|
| |
991
| + transition: (this.speed() / 1000) + 's' |
|
| |
992
| + }); |
|
| |
993
| + } else if (this.state.isTouch) { |
|
| |
994
| + this.$stage.css({ |
|
| |
995
| + left: coordinate + 'px' |
|
| |
996
| + }); |
|
| |
997
| + } else { |
|
| |
998
| + this.$stage.animate({ |
|
| |
999
| + left: coordinate |
|
| |
1000
| + }, this.speed() / 1000, this.settings.fallbackEasing, $.proxy(function() { |
|
| |
1001
| + if (this.state.inMotion) { |
|
| |
1002
| + this.transitionEnd(); |
|
| |
1003
| + } |
|
| |
1004
| + }, this)); |
|
| |
1005
| + } |
|
| |
1006
| + }; |
|
| |
1007
| + |
|
| |
1008
| + /** |
|
| |
1009
| + * Sets the absolute position of the current item. |
|
| |
1010
| + * @public |
|
| |
1011
| + * @param {Number} [position] - The new absolute position or nothing to leave it unchanged. |
|
| |
1012
| + * @returns {Number} - The absolute position of the current item. |
|
| |
1013
| + */ |
|
| |
1014
| + Owl.prototype.current = function(position) { |
|
| |
1015
| + if (position === undefined) { |
|
| |
1016
| + return this._current; |
|
| |
1017
| + } |
|
| |
1018
| + |
|
| |
1019
| + if (this._items.length === 0) { |
|
| |
1020
| + return undefined; |
|
| |
1021
| + } |
|
| |
1022
| + |
|
| |
1023
| + position = this.normalize(position); |
|
| |
1024
| + |
|
| |
1025
| + if (this._current !== position) { |
|
| |
1026
| + var event = this.trigger('change', { property: { name: 'position', value: position } }); |
|
| |
1027
| + |
|
| |
1028
| + if (event.data !== undefined) { |
|
| |
1029
| + position = this.normalize(event.data); |
|
| |
1030
| + } |
|
| |
1031
| + |
|
| |
1032
| + this._current = position; |
|
| |
1033
| + |
|
| |
1034
| + this.invalidate('position'); |
|
| |
1035
| + |
|
| |
1036
| + this.trigger('changed', { property: { name: 'position', value: this._current } }); |
|
| |
1037
| + } |
|
| |
1038
| + |
|
| |
1039
| + return this._current; |
|
| |
1040
| + }; |
|
| |
1041
| + |
|
| |
1042
| + /** |
|
| |
1043
| + * Invalidates the given part of the update routine. |
|
| |
1044
| + * @param {String} part - The part to invalidate. |
|
| |
1045
| + */ |
|
| |
1046
| + Owl.prototype.invalidate = function(part) { |
|
| |
1047
| + this._invalidated[part] = true; |
|
| |
1048
| + } |
|
| |
1049
| + |
|
| |
1050
| + /** |
|
| |
1051
| + * Resets the absolute position of the current item. |
|
| |
1052
| + * @public |
|
| |
1053
| + * @param {Number} position - The absolute position of the new item. |
|
| |
1054
| + */ |
|
| |
1055
| + Owl.prototype.reset = function(position) { |
|
| |
1056
| + position = this.normalize(position); |
|
| |
1057
| + |
|
| |
1058
| + if (position === undefined) { |
|
| |
1059
| + return; |
|
| |
1060
| + } |
|
| |
1061
| + |
|
| |
1062
| + this._speed = 0; |
|
| |
1063
| + this._current = position; |
|
| |
1064
| + |
|
| |
1065
| + this.suppress([ 'translate', 'translated' ]); |
|
| |
1066
| + |
|
| |
1067
| + this.animate(this.coordinates(position)); |
|
| |
1068
| + |
|
| |
1069
| + this.release([ 'translate', 'translated' ]); |
|
| |
1070
| + }; |
|
| |
1071
| + |
|
| |
1072
| + /** |
|
| |
1073
| + * Normalizes an absolute or a relative position for an item. |
|
| |
1074
| + * @public |
|
| |
1075
| + * @param {Number} position - The absolute or relative position to normalize. |
|
| |
1076
| + * @param {Boolean} [relative=false] - Whether the given position is relative or not. |
|
| |
1077
| + * @returns {Number} - The normalized position. |
|
| |
1078
| + */ |
|
| |
1079
| + Owl.prototype.normalize = function(position, relative) { |
|
| |
1080
| + var n = (relative ? this._items.length : this._items.length + this._clones.length); |
|
| |
1081
| + |
|
| |
1082
| + if (!$.isNumeric(position) || n < 1) { |
|
| |
1083
| + return undefined; |
|
| |
1084
| + } |
|
| |
1085
| + |
|
| |
1086
| + if (this._clones.length) { |
|
| |
1087
| + position = ((position % n) + n) % n; |
|
| |
1088
| + } else { |
|
| |
1089
| + position = Math.max(this.minimum(relative), Math.min(this.maximum(relative), position)); |
|
| |
1090
| + } |
|
| |
1091
| + |
|
| |
1092
| + return position; |
|
| |
1093
| + }; |
|
| |
1094
| + |
|
| |
1095
| + /** |
|
| |
1096
| + * Converts an absolute position for an item into a relative position. |
|
| |
1097
| + * @public |
|
| |
1098
| + * @param {Number} position - The absolute position to convert. |
|
| |
1099
| + * @returns {Number} - The converted position. |
|
| |
1100
| + */ |
|
| |
1101
| + Owl.prototype.relative = function(position) { |
|
| |
1102
| + position = this.normalize(position); |
|
| |
1103
| + position = position - this._clones.length / 2; |
|
| |
1104
| + return this.normalize(position, true); |
|
| |
1105
| + }; |
|
| |
1106
| + |
|
| |
1107
| + /** |
|
| |
1108
| + * Gets the maximum position for an item. |
|
| |
1109
| + * @public |
|
| |
1110
| + * @param {Boolean} [relative=false] - Whether to return an absolute position or a relative position. |
|
| |
1111
| + * @returns {Number} |
|
| |
1112
| + */ |
|
| |
1113
| + Owl.prototype.maximum = function(relative) { |
|
| |
1114
| + var maximum, width, i = 0, coordinate, |
|
| |
1115
| + settings = this.settings; |
|
| |
1116
| + |
|
| |
1117
| + if (relative) { |
|
| |
1118
| + return this._items.length - 1; |
|
| |
1119
| + } |
|
| |
1120
| + |
|
| |
1121
| + if (!settings.loop && settings.center) { |
|
| |
1122
| + maximum = this._items.length - 1; |
|
| |
1123
| + } else if (!settings.loop && !settings.center) { |
|
| |
1124
| + maximum = this._items.length - settings.items; |
|
| |
1125
| + } else if (settings.loop || settings.center) { |
|
| |
1126
| + maximum = this._items.length + settings.items; |
|
| |
1127
| + } else if (settings.autoWidth || settings.merge) { |
|
| |
1128
| + revert = settings.rtl ? 1 : -1; |
|
| |
1129
| + width = this.$stage.width() - this.$element.width(); |
|
| |
1130
| + while (coordinate = this.coordinates(i)) { |
|
| |
1131
| + if (coordinate * revert >= width) { |
|
| |
1132
| + break; |
|
| |
1133
| + } |
|
| |
1134
| + maximum = ++i; |
|
| |
1135
| + } |
|
| |
1136
| + } else { |
|
| |
1137
| + throw 'Can not detect maximum absolute position.' |
|
| |
1138
| + } |
|
| |
1139
| + |
|
| |
1140
| + return maximum; |
|
| |
1141
| + }; |
|
| |
1142
| + |
|
| |
1143
| + /** |
|
| |
1144
| + * Gets the minimum position for an item. |
|
| |
1145
| + * @public |
|
| |
1146
| + * @param {Boolean} [relative=false] - Whether to return an absolute position or a relative position. |
|
| |
1147
| + * @returns {Number} |
|
| |
1148
| + */ |
|
| |
1149
| + Owl.prototype.minimum = function(relative) { |
|
| |
1150
| + if (relative) { |
|
| |
1151
| + return 0; |
|
| |
1152
| + } |
|
| |
1153
| + |
|
| |
1154
| + return this._clones.length / 2; |
|
| |
1155
| + }; |
|
| |
1156
| + |
|
| |
1157
| + /** |
|
| |
1158
| + * Gets an item at the specified relative position. |
|
| |
1159
| + * @public |
|
| |
1160
| + * @param {Number} [position] - The relative position of the item. |
|
| |
1161
| + * @return {jQuery|Array.<jQuery>} - The item at the given position or all items if no position was given. |
|
| |
1162
| + */ |
|
| |
1163
| + Owl.prototype.items = function(position) { |
|
| |
1164
| + if (position === undefined) { |
|
| |
1165
| + return this._items.slice(); |
|
| |
1166
| + } |
|
| |
1167
| + |
|
| |
1168
| + position = this.normalize(position, true); |
|
| |
1169
| + return this._items[position]; |
|
| |
1170
| + }; |
|
| |
1171
| + |
|
| |
1172
| + /** |
|
| |
1173
| + * Gets an item at the specified relative position. |
|
| |
1174
| + * @public |
|
| |
1175
| + * @param {Number} [position] - The relative position of the item. |
|
| |
1176
| + * @return {jQuery|Array.<jQuery>} - The item at the given position or all items if no position was given. |
|
| |
1177
| + */ |
|
| |
1178
| + Owl.prototype.mergers = function(position) { |
|
| |
1179
| + if (position === undefined) { |
|
| |
1180
| + return this._mergers.slice(); |
|
| |
1181
| + } |
|
| |
1182
| + |
|
| |
1183
| + position = this.normalize(position, true); |
|
| |
1184
| + return this._mergers[position]; |
|
| |
1185
| + }; |
|
| |
1186
| + |
|
| |
1187
| + /** |
|
| |
1188
| + * Gets the absolute positions of clones for an item. |
|
| |
1189
| + * @public |
|
| |
1190
| + * @param {Number} [position] - The relative position of the item. |
|
| |
1191
| + * @returns {Array.<Number>} - The absolute positions of clones for the item or all if no position was given. |
|
| |
1192
| + */ |
|
| |
1193
| + Owl.prototype.clones = function(position) { |
|
| |
1194
| + var odd = this._clones.length / 2, |
|
| |
1195
| + even = odd + this._items.length, |
|
| |
1196
| + map = function(index) { return index % 2 === 0 ? even + index / 2 : odd - (index + 1) / 2 }; |
|
| |
1197
| + |
|
| |
1198
| + if (position === undefined) { |
|
| |
1199
| + return $.map(this._clones, function(v, i) { return map(i) }); |
|
| |
1200
| + } |
|
| |
1201
| + |
|
| |
1202
| + return $.map(this._clones, function(v, i) { return v === position ? map(i) : null }); |
|
| |
1203
| + }; |
|
| |
1204
| + |
|
| |
1205
| + /** |
|
| |
1206
| + * Sets the current animation speed. |
|
| |
1207
| + * @public |
|
| |
1208
| + * @param {Number} [speed] - The animation speed in milliseconds or nothing to leave it unchanged. |
|
| |
1209
| + * @returns {Number} - The current animation speed in milliseconds. |
|
| |
1210
| + */ |
|
| |
1211
| + Owl.prototype.speed = function(speed) { |
|
| |
1212
| + if (speed !== undefined) { |
|
| |
1213
| + this._speed = speed; |
|
| |
1214
| + } |
|
| |
1215
| + |
|
| |
1216
| + return this._speed; |
|
| |
1217
| + }; |
|
| |
1218
| + |
|
| |
1219
| + /** |
|
| |
1220
| + * Gets the coordinate of an item. |
|
| |
1221
| + * @todo The name of this method is missleanding. |
|
| |
1222
| + * @public |
|
| |
1223
| + * @param {Number} position - The absolute position of the item within `minimum()` and `maximum()`. |
|
| |
1224
| + * @returns {Number|Array.<Number>} - The coordinate of the item in pixel or all coordinates. |
|
| |
1225
| + */ |
|
| |
1226
| + Owl.prototype.coordinates = function(position) { |
|
| |
1227
| + var coordinate = null; |
|
| |
1228
| + |
|
| |
1229
| + if (position === undefined) { |
|
| |
1230
| + return $.map(this._coordinates, $.proxy(function(coordinate, index) { |
|
| |
1231
| + return this.coordinates(index); |
|
| |
1232
| + }, this)); |
|
| |
1233
| + } |
|
| |
1234
| + |
|
| |
1235
| + if (this.settings.center) { |
|
| |
1236
| + coordinate = this._coordinates[position]; |
|
| |
1237
| + coordinate += (this.width() - coordinate + (this._coordinates[position - 1] || 0)) / 2 * (this.settings.rtl ? -1 : 1); |
|
| |
1238
| + } else { |
|
| |
1239
| + coordinate = this._coordinates[position - 1] || 0; |
|
| |
1240
| + } |
|
| |
1241
| + |
|
| |
1242
| + return coordinate; |
|
| |
1243
| + }; |
|
| |
1244
| + |
|
| |
1245
| + /** |
|
| |
1246
| + * Calculates the speed for a translation. |
|
| |
1247
| + * @protected |
|
| |
1248
| + * @param {Number} from - The absolute position of the start item. |
|
| |
1249
| + * @param {Number} to - The absolute position of the target item. |
|
| |
1250
| + * @param {Number} [factor=undefined] - The time factor in milliseconds. |
|
| |
1251
| + * @returns {Number} - The time in milliseconds for the translation. |
|
| |
1252
| + */ |
|
| |
1253
| + Owl.prototype.duration = function(from, to, factor) { |
|
| |
1254
| + return Math.min(Math.max(Math.abs(to - from), 1), 6) * Math.abs((factor || this.settings.smartSpeed)); |
|
| |
1255
| + }; |
|
| |
1256
| + |
|
| |
1257
| + /** |
|
| |
1258
| + * Slides to the specified item. |
|
| |
1259
| + * @public |
|
| |
1260
| + * @param {Number} position - The position of the item. |
|
| |
1261
| + * @param {Number} [speed] - The time in milliseconds for the transition. |
|
| |
1262
| + */ |
|
| |
1263
| + Owl.prototype.to = function(position, speed) { |
|
| |
1264
| + if (this.settings.loop) { |
|
| |
1265
| + var distance = position - this.relative(this.current()), |
|
| |
1266
| + revert = this.current(), |
|
| |
1267
| + before = this.current(), |
|
| |
1268
| + after = this.current() + distance, |
|
| |
1269
| + direction = before - after < 0 ? true : false, |
|
| |
1270
| + items = this._clones.length + this._items.length; |
|
| |
1271
| + |
|
| |
1272
| + if (after < this.settings.items && direction === false) { |
|
| |
1273
| + revert = before + this._items.length; |
|
| |
1274
| + this.reset(revert); |
|
| |
1275
| + } else if (after >= items - this.settings.items && direction === true) { |
|
| |
1276
| + revert = before - this._items.length; |
|
| |
1277
| + this.reset(revert); |
|
| |
1278
| + } |
|
| |
1279
| + window.clearTimeout(this.e._goToLoop); |
|
| |
1280
| + this.e._goToLoop = window.setTimeout($.proxy(function() { |
|
| |
1281
| + this.speed(this.duration(this.current(), revert + distance, speed)); |
|
| |
1282
| + this.current(revert + distance); |
|
| |
1283
| + this.update(); |
|
| |
1284
| + }, this), 30); |
|
| |
1285
| + } else { |
|
| |
1286
| + this.speed(this.duration(this.current(), position, speed)); |
|
| |
1287
| + this.current(position); |
|
| |
1288
| + this.update(); |
|
| |
1289
| + } |
|
| |
1290
| + }; |
|
| |
1291
| + |
|
| |
1292
| + /** |
|
| |
1293
| + * Slides to the next item. |
|
| |
1294
| + * @public |
|
| |
1295
| + * @param {Number} [speed] - The time in milliseconds for the transition. |
|
| |
1296
| + */ |
|
| |
1297
| + Owl.prototype.next = function(speed) { |
|
| |
1298
| + speed = speed || false; |
|
| |
1299
| + this.to(this.relative(this.current()) + 1, speed); |
|
| |
1300
| + }; |
|
| |
1301
| + |
|
| |
1302
| + /** |
|
| |
1303
| + * Slides to the previous item. |
|
| |
1304
| + * @public |
|
| |
1305
| + * @param {Number} [speed] - The time in milliseconds for the transition. |
|
| |
1306
| + */ |
|
| |
1307
| + Owl.prototype.prev = function(speed) { |
|
| |
1308
| + speed = speed || false; |
|
| |
1309
| + this.to(this.relative(this.current()) - 1, speed); |
|
| |
1310
| + }; |
|
| |
1311
| + |
|
| |
1312
| + /** |
|
| |
1313
| + * Handles the end of an animation. |
|
| |
1314
| + * @protected |
|
| |
1315
| + * @param {Event} event - The event arguments. |
|
| |
1316
| + */ |
|
| |
1317
| + Owl.prototype.transitionEnd = function(event) { |
|
| |
1318
| + |
|
| |
1319
| + // if css2 animation then event object is undefined |
|
| |
1320
| + if (event !== undefined) { |
|
| |
1321
| + event.stopPropagation(); |
|
| |
1322
| + |
|
| |
1323
| + // Catch only owl-stage transitionEnd event |
|
| |
1324
| + if ((event.target || event.srcElement || event.originalTarget) !== this.$stage.get(0)) { |
|
| |
1325
| + return false; |
|
| |
1326
| + } |
|
| |
1327
| + } |
|
| |
1328
| + |
|
| |
1329
| + this.state.inMotion = false; |
|
| |
1330
| + this.trigger('translated'); |
|
| |
1331
| + }; |
|
| |
1332
| + |
|
| |
1333
| + /** |
|
| |
1334
| + * Gets viewport width. |
|
| |
1335
| + * @protected |
|
| |
1336
| + * @return {Number} - The width in pixel. |
|
| |
1337
| + */ |
|
| |
1338
| + Owl.prototype.viewport = function() { |
|
| |
1339
| + var width; |
|
| |
1340
| + if (this.options.responsiveBaseElement !== window) { |
|
| |
1341
| + width = $(this.options.responsiveBaseElement).width(); |
|
| |
1342
| + } else if (window.innerWidth) { |
|
| |
1343
| + width = window.innerWidth; |
|
| |
1344
| + } else if (document.documentElement && document.documentElement.clientWidth) { |
|
| |
1345
| + width = document.documentElement.clientWidth; |
|
| |
1346
| + } else { |
|
| |
1347
| + throw 'Can not detect viewport width.'; |
|
| |
1348
| + } |
|
| |
1349
| + return width; |
|
| |
1350
| + }; |
|
| |
1351
| + |
|
| |
1352
| + /** |
|
| |
1353
| + * Replaces the current content. |
|
| |
1354
| + * @public |
|
| |
1355
| + * @param {HTMLElement|jQuery|String} content - The new content. |
|
| |
1356
| + */ |
|
| |
1357
| + Owl.prototype.replace = function(content) { |
|
| |
1358
| + this.$stage.empty(); |
|
| |
1359
| + this._items = []; |
|
| |
1360
| + |
|
| |
1361
| + if (content) { |
|
| |
1362
| + content = (content instanceof jQuery) ? content : $(content); |
|
| |
1363
| + } |
|
| |
1364
| + |
|
| |
1365
| + if (this.settings.nestedItemSelector) { |
|
| |
1366
| + content = content.find('.' + this.settings.nestedItemSelector); |
|
| |
1367
| + } |
|
| |
1368
| + |
|
| |
1369
| + content.filter(function() { |
|
| |
1370
| + return this.nodeType === 1; |
|
| |
1371
| + }).each($.proxy(function(index, item) { |
|
| |
1372
| + item = this.prepare(item); |
|
| |
1373
| + this.$stage.append(item); |
|
| |
1374
| + this._items.push(item); |
|
| |
1375
| + this._mergers.push(item.find('[data-merge]').andSelf('[data-merge]').attr('data-merge') * 1 || 1); |
|
| |
1376
| + }, this)); |
|
| |
1377
| + |
|
| |
1378
| + this.reset($.isNumeric(this.settings.startPosition) ? this.settings.startPosition : 0); |
|
| |
1379
| + |
|
| |
1380
| + this.invalidate('items'); |
|
| |
1381
| + }; |
|
| |
1382
| + |
|
| |
1383
| + /** |
|
| |
1384
| + * Adds an item. |
|
| |
1385
| + * @todo Use `item` instead of `content` for the event arguments. |
|
| |
1386
| + * @public |
|
| |
1387
| + * @param {HTMLElement|jQuery|String} content - The item content to add. |
|
| |
1388
| + * @param {Number} [position] - The relative position at which to insert the item otherwise the item will be added to the end. |
|
| |
1389
| + */ |
|
| |
1390
| + Owl.prototype.add = function(content, position) { |
|
| |
1391
| + position = position === undefined ? this._items.length : this.normalize(position, true); |
|
| |
1392
| + |
|
| |
1393
| + this.trigger('add', { content: content, position: position }); |
|
| |
1394
| + |
|
| |
1395
| + if (this._items.length === 0 || position === this._items.length) { |
|
| |
1396
| + this.$stage.append(content); |
|
| |
1397
| + this._items.push(content); |
|
| |
1398
| + this._mergers.push(content.find('[data-merge]').andSelf('[data-merge]').attr('data-merge') * 1 || 1); |
|
| |
1399
| + } else { |
|
| |
1400
| + this._items[position].before(content); |
|
| |
1401
| + this._items.splice(position, 0, content); |
|
| |
1402
| + this._mergers.splice(position, 0, content.find('[data-merge]').andSelf('[data-merge]').attr('data-merge') * 1 || 1); |
|
| |
1403
| + } |
|
| |
1404
| + |
|
| |
1405
| + this.invalidate('items'); |
|
| |
1406
| + |
|
| |
1407
| + this.trigger('added', { content: content, position: position }); |
|
| |
1408
| + }; |
|
| |
1409
| + |
|
| |
1410
| + /** |
|
| |
1411
| + * Removes an item by its position. |
|
| |
1412
| + * @todo Use `item` instead of `content` for the event arguments. |
|
| |
1413
| + * @public |
|
| |
1414
| + * @param {Number} position - The relative position of the item to remove. |
|
| |
1415
| + */ |
|
| |
1416
| + Owl.prototype.remove = function(position) { |
|
| |
1417
| + position = this.normalize(position, true); |
|
| |
1418
| + |
|
| |
1419
| + if (position === undefined) { |
|
| |
1420
| + return; |
|
| |
1421
| + } |
|
| |
1422
| + |
|
| |
1423
| + this.trigger('remove', { content: this._items[position], position: position }); |
|
| |
1424
| + |
|
| |
1425
| + this._items[position].remove(); |
|
| |
1426
| + this._items.splice(position, 1); |
|
| |
1427
| + this._mergers.splice(position, 1); |
|
| |
1428
| + |
|
| |
1429
| + this.invalidate('items'); |
|
| |
1430
| + |
|
| |
1431
| + this.trigger('removed', { content: null, position: position }); |
|
| |
1432
| + }; |
|
| |
1433
| + |
|
| |
1434
| + /** |
|
| |
1435
| + * Adds triggerable events. |
|
| |
1436
| + * @protected |
|
| |
1437
| + */ |
|
| |
1438
| + Owl.prototype.addTriggerableEvents = function() { |
|
| |
1439
| + var handler = $.proxy(function(callback, event) { |
|
| |
1440
| + return $.proxy(function(e) { |
|
| |
1441
| + if (e.relatedTarget !== this) { |
|
| |
1442
| + this.suppress([ event ]); |
|
| |
1443
| + callback.apply(this, [].slice.call(arguments, 1)); |
|
| |
1444
| + this.release([ event ]); |
|
| |
1445
| + } |
|
| |
1446
| + }, this); |
|
| |
1447
| + }, this); |
|
| |
1448
| + |
|
| |
1449
| + $.each({ |
|
| |
1450
| + 'next': this.next, |
|
| |
1451
| + 'prev': this.prev, |
|
| |
1452
| + 'to': this.to, |
|
| |
1453
| + 'destroy': this.destroy, |
|
| |
1454
| + 'refresh': this.refresh, |
|
| |
1455
| + 'replace': this.replace, |
|
| |
1456
| + 'add': this.add, |
|
| |
1457
| + 'remove': this.remove |
|
| |
1458
| + }, $.proxy(function(event, callback) { |
|
| |
1459
| + this.$element.on(event + '.owl.carousel', handler(callback, event + '.owl.carousel')); |
|
| |
1460
| + }, this)); |
|
| |
1461
| + |
|
| |
1462
| + }; |
|
| |
1463
| + |
|
| |
1464
| + /** |
|
| |
1465
| + * Watches the visibility of the carousel element. |
|
| |
1466
| + * @protected |
|
| |
1467
| + */ |
|
| |
1468
| + Owl.prototype.watchVisibility = function() { |
|
| |
1469
| + |
|
| |
1470
| + // test on zepto |
|
| |
1471
| + if (!isElVisible(this.$element.get(0))) { |
|
| |
1472
| + this.$element.addClass('owl-hidden'); |
|
| |
1473
| + window.clearInterval(this.e._checkVisibile); |
|
| |
1474
| + this.e._checkVisibile = window.setInterval($.proxy(checkVisible, this), 500); |
|
| |
1475
| + } |
|
| |
1476
| + |
|
| |
1477
| + function isElVisible(el) { |
|
| |
1478
| + return el.offsetWidth > 0 && el.offsetHeight > 0; |
|
| |
1479
| + } |
|
| |
1480
| + |
|
| |
1481
| + function checkVisible() { |
|
| |
1482
| + if (isElVisible(this.$element.get(0))) { |
|
| |
1483
| + this.$element.removeClass('owl-hidden'); |
|
| |
1484
| + this.refresh(); |
|
| |
1485
| + window.clearInterval(this.e._checkVisibile); |
|
| |
1486
| + } |
|
| |
1487
| + } |
|
| |
1488
| + }; |
|
| |
1489
| + |
|
| |
1490
| + /** |
|
| |
1491
| + * Preloads images with auto width. |
|
| |
1492
| + * @protected |
|
| |
1493
| + * @todo Still to test |
|
| |
1494
| + */ |
|
| |
1495
| + Owl.prototype.preloadAutoWidthImages = function(imgs) { |
|
| |
1496
| + var loaded, that, $el, img; |
|
| |
1497
| + |
|
| |
1498
| + loaded = 0; |
|
| |
1499
| + that = this; |
|
| |
1500
| + imgs.each(function(i, el) { |
|
| |
1501
| + $el = $(el); |
|
| |
1502
| + img = new Image(); |
|
| |
1503
| + |
|
| |
1504
| + img.onload = function() { |
|
| |
1505
| + loaded++; |
|
| |
1506
| + $el.attr('src', img.src); |
|
| |
1507
| + $el.css('opacity', 1); |
|
| |
1508
| + if (loaded >= imgs.length) { |
|
| |
1509
| + that.state.imagesLoaded = true; |
|
| |
1510
| + that.initialize(); |
|
| |
1511
| + } |
|
| |
1512
| + }; |
|
| |
1513
| + |
|
| |
1514
| + img.src = $el.attr('src') || $el.attr('data-src') || $el.attr('data-src-retina'); |
|
| |
1515
| + }); |
|
| |
1516
| + }; |
|
| |
1517
| + |
|
| |
1518
| + /** |
|
| |
1519
| + * Destroys the carousel. |
|
| |
1520
| + * @public |
|
| |
1521
| + */ |
|
| |
1522
| + Owl.prototype.destroy = function() { |
|
| |
1523
| + |
|
| |
1524
| + if (this.$element.hasClass(this.settings.themeClass)) { |
|
| |
1525
| + this.$element.removeClass(this.settings.themeClass); |
|
| |
1526
| + } |
|
| |
1527
| + |
|
| |
1528
| + if (this.settings.responsive !== false) { |
|
| |
1529
| + $(window).off('resize.owl.carousel'); |
|
| |
1530
| + } |
|
| |
1531
| + |
|
| |
1532
| + if (this.transitionEndVendor) { |
|
| |
1533
| + this.off(this.$stage.get(0), this.transitionEndVendor, this.e._transitionEnd); |
|
| |
1534
| + } |
|
| |
1535
| + |
|
| |
1536
| + for ( var i in this._plugins) { |
|
| |
1537
| + this._plugins[i].destroy(); |
|
| |
1538
| + } |
|
| |
1539
| + |
|
| |
1540
| + if (this.settings.mouseDrag || this.settings.touchDrag) { |
|
| |
1541
| + this.$stage.off('mousedown touchstart touchcancel'); |
|
| |
1542
| + $(document).off('.owl.dragEvents'); |
|
| |
1543
| + this.$stage.get(0).onselectstart = function() {}; |
|
| |
1544
| + this.$stage.off('dragstart', function() { return false }); |
|
| |
1545
| + } |
|
| |
1546
| + |
|
| |
1547
| + // remove event handlers in the ".owl.carousel" namespace |
|
| |
1548
| + this.$element.off('.owl'); |
|
| |
1549
| + |
|
| |
1550
| + this.$stage.children('.cloned').remove(); |
|
| |
1551
| + this.e = null; |
|
| |
1552
| + this.$element.removeData('owlCarousel'); |
|
| |
1553
| + |
|
| |
1554
| + this.$stage.children().contents().unwrap(); |
|
| |
1555
| + this.$stage.children().unwrap(); |
|
| |
1556
| + this.$stage.unwrap(); |
|
| |
1557
| + }; |
|
| |
1558
| + |
|
| |
1559
| + /** |
|
| |
1560
| + * Operators to calculate right-to-left and left-to-right. |
|
| |
1561
| + * @protected |
|
| |
1562
| + * @param {Number} [a] - The left side operand. |
|
| |
1563
| + * @param {String} [o] - The operator. |
|
| |
1564
| + * @param {Number} [b] - The right side operand. |
|
| |
1565
| + */ |
|
| |
1566
| + Owl.prototype.op = function(a, o, b) { |
|
| |
1567
| + var rtl = this.settings.rtl; |
|
| |
1568
| + switch (o) { |
|
| |
1569
| + case '<': |
|
| |
1570
| + return rtl ? a > b : a < b; |
|
| |
1571
| + case '>': |
|
| |
1572
| + return rtl ? a < b : a > b; |
|
| |
1573
| + case '>=': |
|
| |
1574
| + return rtl ? a <= b : a >= b; |
|
| |
1575
| + case '<=': |
|
| |
1576
| + return rtl ? a >= b : a <= b; |
|
| |
1577
| + default: |
|
| |
1578
| + break; |
|
| |
1579
| + } |
|
| |
1580
| + }; |
|
| |
1581
| + |
|
| |
1582
| + /** |
|
| |
1583
| + * Attaches to an internal event. |
|
| |
1584
| + * @protected |
|
| |
1585
| + * @param {HTMLElement} element - The event source. |
|
| |
1586
| + * @param {String} event - The event name. |
|
| |
1587
| + * @param {Function} listener - The event handler to attach. |
|
| |
1588
| + * @param {Boolean} capture - Wether the event should be handled at the capturing phase or not. |
|
| |
1589
| + */ |
|
| |
1590
| + Owl.prototype.on = function(element, event, listener, capture) { |
|
| |
1591
| + if (element.addEventListener) { |
|
| |
1592
| + element.addEventListener(event, listener, capture); |
|
| |
1593
| + } else if (element.attachEvent) { |
|
| |
1594
| + element.attachEvent('on' + event, listener); |
|
| |
1595
| + } |
|
| |
1596
| + }; |
|
| |
1597
| + |
|
| |
1598
| + /** |
|
| |
1599
| + * Detaches from an internal event. |
|
| |
1600
| + * @protected |
|
| |
1601
| + * @param {HTMLElement} element - The event source. |
|
| |
1602
| + * @param {String} event - The event name. |
|
| |
1603
| + * @param {Function} listener - The attached event handler to detach. |
|
| |
1604
| + * @param {Boolean} capture - Wether the attached event handler was registered as a capturing listener or not. |
|
| |
1605
| + */ |
|
| |
1606
| + Owl.prototype.off = function(element, event, listener, capture) { |
|
| |
1607
| + if (element.removeEventListener) { |
|
| |
1608
| + element.removeEventListener(event, listener, capture); |
|
| |
1609
| + } else if (element.detachEvent) { |
|
| |
1610
| + element.detachEvent('on' + event, listener); |
|
| |
1611
| + } |
|
| |
1612
| + }; |
|
| |
1613
| + |
|
| |
1614
| + /** |
|
| |
1615
| + * Triggers an public event. |
|
| |
1616
| + * @protected |
|
| |
1617
| + * @param {String} name - The event name. |
|
| |
1618
| + * @param {*} [data=null] - The event data. |
|
| |
1619
| + * @param {String} [namespace=.owl.carousel] - The event namespace. |
|
| |
1620
| + * @returns {Event} - The event arguments. |
|
| |
1621
| + */ |
|
| |
1622
| + Owl.prototype.trigger = function(name, data, namespace) { |
|
| |
1623
| + var status = { |
|
| |
1624
| + item: { count: this._items.length, index: this.current() } |
|
| |
1625
| + }, handler = $.camelCase( |
|
| |
1626
| + $.grep([ 'on', name, namespace ], function(v) { return v }) |
|
| |
1627
| + .join('-').toLowerCase() |
|
| |
1628
| + ), event = $.Event( |
|
| |
1629
| + [ name, 'owl', namespace || 'carousel' ].join('.').toLowerCase(), |
|
| |
1630
| + $.extend({ relatedTarget: this }, status, data) |
|
| |
1631
| + ); |
|
| |
1632
| + |
|
| |
1633
| + if (!this._supress[name]) { |
|
| |
1634
| + $.each(this._plugins, function(name, plugin) { |
|
| |
1635
| + if (plugin.onTrigger) { |
|
| |
1636
| + plugin.onTrigger(event); |
|
| |
1637
| + } |
|
| |
1638
| + }); |
|
| |
1639
| + |
|
| |
1640
| + this.$element.trigger(event); |
|
| |
1641
| + |
|
| |
1642
| + if (this.settings && typeof this.settings[handler] === 'function') { |
|
| |
1643
| + this.settings[handler].apply(this, event); |
|
| |
1644
| + } |
|
| |
1645
| + } |
|
| |
1646
| + |
|
| |
1647
| + return event; |
|
| |
1648
| + }; |
|
| |
1649
| + |
|
| |
1650
| + /** |
|
| |
1651
| + * Suppresses events. |
|
| |
1652
| + * @protected |
|
| |
1653
| + * @param {Array.<String>} events - The events to suppress. |
|
| |
1654
| + */ |
|
| |
1655
| + Owl.prototype.suppress = function(events) { |
|
| |
1656
| + $.each(events, $.proxy(function(index, event) { |
|
| |
1657
| + this._supress[event] = true; |
|
| |
1658
| + }, this)); |
|
| |
1659
| + } |
|
| |
1660
| + |
|
| |
1661
| + /** |
|
| |
1662
| + * Releases suppressed events. |
|
| |
1663
| + * @protected |
|
| |
1664
| + * @param {Array.<String>} events - The events to release. |
|
| |
1665
| + */ |
|
| |
1666
| + Owl.prototype.release = function(events) { |
|
| |
1667
| + $.each(events, $.proxy(function(index, event) { |
|
| |
1668
| + delete this._supress[event]; |
|
| |
1669
| + }, this)); |
|
| |
1670
| + } |
|
| |
1671
| + |
|
| |
1672
| + /** |
|
| |
1673
| + * Checks the availability of some browser features. |
|
| |
1674
| + * @protected |
|
| |
1675
| + */ |
|
| |
1676
| + Owl.prototype.browserSupport = function() { |
|
| |
1677
| + this.support3d = isPerspective(); |
|
| |
1678
| + |
|
| |
1679
| + if (this.support3d) { |
|
| |
1680
| + this.transformVendor = isTransform(); |
|
| |
1681
| + |
|
| |
1682
| + // take transitionend event name by detecting transition |
|
| |
1683
| + var endVendors = [ 'transitionend', 'webkitTransitionEnd', 'transitionend', 'oTransitionEnd' ]; |
|
| |
1684
| + this.transitionEndVendor = endVendors[isTransition()]; |
|
| |
1685
| + |
|
| |
1686
| + // take vendor name from transform name |
|
| |
1687
| + this.vendorName = this.transformVendor.replace(/Transform/i, ''); |
|
| |
1688
| + this.vendorName = this.vendorName !== '' ? '-' + this.vendorName.toLowerCase() + '-' : ''; |
|
| |
1689
| + } |
|
| |
1690
| + |
|
| |
1691
| + this.state.orientation = window.orientation; |
|
| |
1692
| + }; |
|
| |
1693
| + |
|
| |
1694
| + /** |
|
| |
1695
| + * Get touch/drag coordinats. |
|
| |
1696
| + * @private |
|
| |
1697
| + * @param {event} - mousedown/touchstart event |
|
| |
1698
| + * @returns {object} - Contains X and Y of current mouse/touch position |
|
| |
1699
| + */ |
|
| |
1700
| + |
|
| |
1701
| + function getTouches(event) { |
|
| |
1702
| + if (event.touches !== undefined) { |
|
| |
1703
| + return { |
|
| |
1704
| + x: event.touches[0].pageX, |
|
| |
1705
| + y: event.touches[0].pageY |
|
| |
1706
| + }; |
|
| |
1707
| + } |
|
| |
1708
| + |
|
| |
1709
| + if (event.touches === undefined) { |
|
| |
1710
| + if (event.pageX !== undefined) { |
|
| |
1711
| + return { |
|
| |
1712
| + x: event.pageX, |
|
| |
1713
| + y: event.pageY |
|
| |
1714
| + }; |
|
| |
1715
| + } |
|
| |
1716
| + |
|
| |
1717
| + if (event.pageX === undefined) { |
|
| |
1718
| + return { |
|
| |
1719
| + x: event.clientX, |
|
| |
1720
| + y: event.clientY |
|
| |
1721
| + }; |
|
| |
1722
| + } |
|
| |
1723
| + } |
|
| |
1724
| + } |
|
| |
1725
| + |
|
| |
1726
| + /** |
|
| |
1727
| + * Checks for CSS support. |
|
| |
1728
| + * @private |
|
| |
1729
| + * @param {Array} array - The CSS properties to check for. |
|
| |
1730
| + * @returns {Array} - Contains the supported CSS property name and its index or `false`. |
|
| |
1731
| + */ |
|
| |
1732
| + function isStyleSupported(array) { |
|
| |
1733
| + var p, s, fake = document.createElement('div'), list = array; |
|
| |
1734
| + for (p in list) { |
|
| |
1735
| + s = list[p]; |
|
| |
1736
| + if (typeof fake.style[s] !== 'undefined') { |
|
| |
1737
| + fake = null; |
|
| |
1738
| + return [ s, p ]; |
|
| |
1739
| + } |
|
| |
1740
| + } |
|
| |
1741
| + return [ false ]; |
|
| |
1742
| + } |
|
| |
1743
| + |
|
| |
1744
| + /** |
|
| |
1745
| + * Checks for CSS transition support. |
|
| |
1746
| + * @private |
|
| |
1747
| + * @todo Realy bad design |
|
| |
1748
| + * @returns {Number} |
|
| |
1749
| + */ |
|
| |
1750
| + function isTransition() { |
|
| |
1751
| + return isStyleSupported([ 'transition', 'WebkitTransition', 'MozTransition', 'OTransition' ])[1]; |
|
| |
1752
| + } |
|
| |
1753
| + |
|
| |
1754
| + /** |
|
| |
1755
| + * Checks for CSS transform support. |
|
| |
1756
| + * @private |
|
| |
1757
| + * @returns {String} The supported property name or false. |
|
| |
1758
| + */ |
|
| |
1759
| + function isTransform() { |
|
| |
1760
| + return isStyleSupported([ 'transform', 'WebkitTransform', 'MozTransform', 'OTransform', 'msTransform' ])[0]; |
|
| |
1761
| + } |
|
| |
1762
| + |
|
| |
1763
| + /** |
|
| |
1764
| + * Checks for CSS perspective support. |
|
| |
1765
| + * @private |
|
| |
1766
| + * @returns {String} The supported property name or false. |
|
| |
1767
| + */ |
|
| |
1768
| + function isPerspective() { |
|
| |
1769
| + return isStyleSupported([ 'perspective', 'webkitPerspective', 'MozPerspective', 'OPerspective', 'MsPerspective' ])[0]; |
|
| |
1770
| + } |
|
| |
1771
| + |
|
| |
1772
| + /** |
|
| |
1773
| + * Checks wether touch is supported or not. |
|
| |
1774
| + * @private |
|
| |
1775
| + * @returns {Boolean} |
|
| |
1776
| + */ |
|
| |
1777
| + function isTouchSupport() { |
|
| |
1778
| + return 'ontouchstart' in window || !!(navigator.msMaxTouchPoints); |
|
| |
1779
| + } |
|
| |
1780
| + |
|
| |
1781
| + /** |
|
| |
1782
| + * Checks wether touch is supported or not for IE. |
|
| |
1783
| + * @private |
|
| |
1784
| + * @returns {Boolean} |
|
| |
1785
| + */ |
|
| |
1786
| + function isTouchSupportIE() { |
|
| |
1787
| + return window.navigator.msPointerEnabled; |
|
| |
1788
| + } |
|
| |
1789
| + |
|
| |
1790
| + /** |
|
| |
1791
| + * The jQuery Plugin for the Owl Carousel |
|
| |
1792
| + * @public |
|
| |
1793
| + */ |
|
| |
1794
| + $.fn.owlCarousel = function(options) { |
|
| |
1795
| + return this.each(function() { |
|
| |
1796
| + if (!$(this).data('owlCarousel')) { |
|
| |
1797
| + $(this).data('owlCarousel', new Owl(this, options)); |
|
| |
1798
| + } |
|
| |
1799
| + }); |
|
| |
1800
| + }; |
|
| |
1801
| + |
|
| |
1802
| + /** |
|
| |
1803
| + * The constructor for the jQuery Plugin |
|
| |
1804
| + * @public |
|
| |
1805
| + */ |
|
| |
1806
| + $.fn.owlCarousel.Constructor = Owl; |
|
| |
1807
| + |
|
| |
1808
| +})(window.Zepto || window.jQuery, window, document); |
|
| |
1809
| + |
|
| |
1810
| +/** |
|
| |
1811
| + * Lazy Plugin |
|
| |
1812
| + * @version 2.0.0 |
|
| |
1813
| + * @author Bartosz Wojciechowski |
|
| |
1814
| + * @license The MIT License (MIT) |
|
| |
1815
| + */ |
|
| |
1816
| +;(function($, window, document, undefined) { |
|
| |
1817
| + |
|
| |
1818
| + /** |
|
| |
1819
| + * Creates the lazy plugin. |
|
| |
1820
| + * @class The Lazy Plugin |
|
| |
1821
| + * @param {Owl} carousel - The Owl Carousel |
|
| |
1822
| + */ |
|
| |
1823
| + var Lazy = function(carousel) { |
|
| |
1824
| + |
|
| |
1825
| + /** |
|
| |
1826
| + * Reference to the core. |
|
| |
1827
| + * @protected |
|
| |
1828
| + * @type {Owl} |
|
| |
1829
| + */ |
|
| |
1830
| + this._core = carousel; |
|
| |
1831
| + |
|
| |
1832
| + /** |
|
| |
1833
| + * Already loaded items. |
|
| |
1834
| + * @protected |
|
| |
1835
| + * @type {Array.<jQuery>} |
|
| |
1836
| + */ |
|
| |
1837
| + this._loaded = []; |
|
| |
1838
| + |
|
| |
1839
| + /** |
|
| |
1840
| + * Event handlers. |
|
| |
1841
| + * @protected |
|
| |
1842
| + * @type {Object} |
|
| |
1843
| + */ |
|
| |
1844
| + this._handlers = { |
|
| |
1845
| + 'initialized.owl.carousel change.owl.carousel': $.proxy(function(e) { |
|
| |
1846
| + if (!e.namespace) { |
|
| |
1847
| + return; |
|
| |
1848
| + } |
|
| |
1849
| + |
|
| |
1850
| + if (!this._core.settings || !this._core.settings.lazyLoad) { |
|
| |
1851
| + return; |
|
| |
1852
| + } |
|
| |
1853
| + |
|
| |
1854
| + if ((e.property && e.property.name == 'position') || e.type == 'initialized') { |
|
| |
1855
| + var settings = this._core.settings, |
|
| |
1856
| + n = (settings.center && Math.ceil(settings.items / 2) || settings.items), |
|
| |
1857
| + i = ((settings.center && n * -1) || 0), |
|
| |
1858
| + position = ((e.property && e.property.value) || this._core.current()) + i, |
|
| |
1859
| + clones = this._core.clones().length, |
|
| |
1860
| + load = $.proxy(function(i, v) { this.load(v) }, this); |
|
| |
1861
| + |
|
| |
1862
| + while (i++ < n) { |
|
| |
1863
| + this.load(clones / 2 + this._core.relative(position)); |
|
| |
1864
| + clones && $.each(this._core.clones(this._core.relative(position++)), load); |
|
| |
1865
| + } |
|
| |
1866
| + } |
|
| |
1867
| + }, this) |
|
| |
1868
| + }; |
|
| |
1869
| + |
|
| |
1870
| + // set the default options |
|
| |
1871
| + this._core.options = $.extend({}, Lazy.Defaults, this._core.options); |
|
| |
1872
| + |
|
| |
1873
| + // register event handler |
|
| |
1874
| + this._core.$element.on(this._handlers); |
|
| |
1875
| + } |
|
| |
1876
| + |
|
| |
1877
| + /** |
|
| |
1878
| + * Default options. |
|
| |
1879
| + * @public |
|
| |
1880
| + */ |
|
| |
1881
| + Lazy.Defaults = { |
|
| |
1882
| + lazyLoad: false |
|
| |
1883
| + } |
|
| |
1884
| + |
|
| |
1885
| + /** |
|
| |
1886
| + * Loads all resources of an item at the specified position. |
|
| |
1887
| + * @param {Number} position - The absolute position of the item. |
|
| |
1888
| + * @protected |
|
| |
1889
| + */ |
|
| |
1890
| + Lazy.prototype.load = function(position) { |
|
| |
1891
| + var $item = this._core.$stage.children().eq(position), |
|
| |
1892
| + $elements = $item && $item.find('.owl-lazy'); |
|
| |
1893
| + |
|
| |
1894
| + if (!$elements || $.inArray($item.get(0), this._loaded) > -1) { |
|
| |
1895
| + return; |
|
| |
1896
| + } |
|
| |
1897
| + |
|
| |
1898
| + $elements.each($.proxy(function(index, element) { |
|
| |
1899
| + var $element = $(element), image, |
|
| |
1900
| + url = (window.devicePixelRatio > 1 && $element.attr('data-src-retina')) || $element.attr('data-src'); |
|
| |
1901
| + |
|
| |
1902
| + this._core.trigger('load', { element: $element, url: url }, 'lazy'); |
|
| |
1903
| + |
|
| |
1904
| + if ($element.is('img')) { |
|
| |
1905
| + $element.one('load.owl.lazy', $.proxy(function() { |
|
| |
1906
| + $element.css('opacity', 1); |
|
| |
1907
| + this._core.trigger('loaded', { element: $element, url: url }, 'lazy'); |
|
| |
1908
| + }, this)).attr('src', url); |
|
| |
1909
| + } else { |
|
| |
1910
| + image = new Image(); |
|
| |
1911
| + image.onload = $.proxy(function() { |
|
| |
1912
| + $element.css({ |
|
| |
1913
| + 'background-image': 'url(' + url + ')', |
|
| |
1914
| + 'opacity': '1' |
|
| |
1915
| + }); |
|
| |
1916
| + this._core.trigger('loaded', { element: $element, url: url }, 'lazy'); |
|
| |
1917
| + }, this); |
|
| |
1918
| + image.src = url; |
|
| |
1919
| + } |
|
| |
1920
| + }, this)); |
|
| |
1921
| + |
|
| |
1922
| + this._loaded.push($item.get(0)); |
|
| |
1923
| + } |
|
| |
1924
| + |
|
| |
1925
| + /** |
|
| |
1926
| + * Destroys the plugin. |
|
| |
1927
| + * @public |
|
| |
1928
| + */ |
|
| |
1929
| + Lazy.prototype.destroy = function() { |
|
| |
1930
| + var handler, property; |
|
| |
1931
| + |
|
| |
1932
| + for (handler in this.handlers) { |
|
| |
1933
| + this._core.$element.off(handler, this.handlers[handler]); |
|
| |
1934
| + } |
|
| |
1935
| + for (property in Object.getOwnPropertyNames(this)) { |
|
| |
1936
| + typeof this[property] != 'function' && (this[property] = null); |
|
| |
1937
| + } |
|
| |
1938
| + } |
|
| |
1939
| + |
|
| |
1940
| + $.fn.owlCarousel.Constructor.Plugins.Lazy = Lazy; |
|
| |
1941
| + |
|
| |
1942
| +})(window.Zepto || window.jQuery, window, document); |
|
| |
1943
| + |
|
| |
1944
| +/** |
|
| |
1945
| + * AutoHeight Plugin |
|
| |
1946
| + * @version 2.0.0 |
|
| |
1947
| + * @author Bartosz Wojciechowski |
|
| |
1948
| + * @license The MIT License (MIT) |
|
| |
1949
| + */ |
|
| |
1950
| +;(function($, window, document, undefined) { |
|
| |
1951
| + |
|
| |
1952
| + /** |
|
| |
1953
| + * Creates the auto height plugin. |
|
| |
1954
| + * @class The Auto Height Plugin |
|
| |
1955
| + * @param {Owl} carousel - The Owl Carousel |
|
| |
1956
| + */ |
|
| |
1957
| + var AutoHeight = function(carousel) { |
|
| |
1958
| + /** |
|
| |
1959
| + * Reference to the core. |
|
| |
1960
| + * @protected |
|
| |
1961
| + * @type {Owl} |
|
| |
1962
| + */ |
|
| |
1963
| + this._core = carousel; |
|
| |
1964
| + |
|
| |
1965
| + /** |
|
| |
1966
| + * All event handlers. |
|
| |
1967
| + * @protected |
|
| |
1968
| + * @type {Object} |
|
| |
1969
| + */ |
|
| |
1970
| + this._handlers = { |
|
| |
1971
| + 'initialized.owl.carousel': $.proxy(function() { |
|
| |
1972
| + if (this._core.settings.autoHeight) { |
|
| |
1973
| + this.update(); |
|
| |
1974
| + } |
|
| |
1975
| + }, this), |
|
| |
1976
| + 'changed.owl.carousel': $.proxy(function(e) { |
|
| |
1977
| + if (this._core.settings.autoHeight && e.property.name == 'position'){ |
|
| |
1978
| + this.update(); |
|
| |
1979
| + } |
|
| |
1980
| + }, this), |
|
| |
1981
| + 'loaded.owl.lazy': $.proxy(function(e) { |
|
| |
1982
| + if (this._core.settings.autoHeight && e.element.closest('.' + this._core.settings.itemClass) |
|
| |
1983
| + === this._core.$stage.children().eq(this._core.current())) { |
|
| |
1984
| + this.update(); |
|
| |
1985
| + } |
|
| |
1986
| + }, this) |
|
| |
1987
| + }; |
|
| |
1988
| + |
|
| |
1989
| + // set default options |
|
| |
1990
| + this._core.options = $.extend({}, AutoHeight.Defaults, this._core.options); |
|
| |
1991
| + |
|
| |
1992
| + // register event handlers |
|
| |
1993
| + this._core.$element.on(this._handlers); |
|
| |
1994
| + }; |
|
| |
1995
| + |
|
| |
1996
| + /** |
|
| |
1997
| + * Default options. |
|
| |
1998
| + * @public |
|
| |
1999
| + */ |
|
| |
2000
| + AutoHeight.Defaults = { |
|
| |
2001
| + autoHeight: false, |
|
| |
2002
| + autoHeightClass: 'owl-height' |
|
| |
2003
| + }; |
|
| |
2004
| + |
|
| |
2005
| + /** |
|
| |
2006
| + * Updates the view. |
|
| |
2007
| + */ |
|
| |
2008
| + AutoHeight.prototype.update = function() { |
|
| |
2009
| + this._core.$stage.parent() |
|
| |
2010
| + .height(this._core.$stage.children().eq(this._core.current()).height()) |
|
| |
2011
| + .addClass(this._core.settings.autoHeightClass); |
|
| |
2012
| + }; |
|
| |
2013
| + |
|
| |
2014
| + AutoHeight.prototype.destroy = function() { |
|
| |
2015
| + var handler, property; |
|
| |
2016
| + |
|
| |
2017
| + for (handler in this._handlers) { |
|
| |
2018
| + this._core.$element.off(handler, this._handlers[handler]); |
|
| |
2019
| + } |
|
| |
2020
| + for (property in Object.getOwnPropertyNames(this)) { |
|
| |
2021
| + typeof this[property] != 'function' && (this[property] = null); |
|
| |
2022
| + } |
|
| |
2023
| + }; |
|
| |
2024
| + |
|
| |
2025
| + $.fn.owlCarousel.Constructor.Plugins.AutoHeight = AutoHeight; |
|
| |
2026
| + |
|
| |
2027
| +})(window.Zepto || window.jQuery, window, document); |
|
| |
2028
| + |
|
| |
2029
| +/** |
|
| |
2030
| + * Video Plugin |
|
| |
2031
| + * @version 2.0.0 |
|
| |
2032
| + * @author Bartosz Wojciechowski |
|
| |
2033
| + * @license The MIT License (MIT) |
|
| |
2034
| + */ |
|
| |
2035
| +;(function($, window, document, undefined) { |
|
| |
2036
| + |
|
| |
2037
| + /** |
|
| |
2038
| + * Creates the video plugin. |
|
| |
2039
| + * @class The Video Plugin |
|
| |
2040
| + * @param {Owl} carousel - The Owl Carousel |
|
| |
2041
| + */ |
|
| |
2042
| + var Video = function(carousel) { |
|
| |
2043
| + /** |
|
| |
2044
| + * Reference to the core. |
|
| |
2045
| + * @protected |
|
| |
2046
| + * @type {Owl} |
|
| |
2047
| + */ |
|
| |
2048
| + this._core = carousel; |
|
| |
2049
| + |
|
| |
2050
| + /** |
|
| |
2051
| + * Cache all video URLs. |
|
| |
2052
| + * @protected |
|
| |
2053
| + * @type {Object} |
|
| |
2054
| + */ |
|
| |
2055
| + this._videos = {}; |
|
| |
2056
| + |
|
| |
2057
| + /** |
|
| |
2058
| + * Current playing item. |
|
| |
2059
| + * @protected |
|
| |
2060
| + * @type {jQuery} |
|
| |
2061
| + */ |
|
| |
2062
| + this._playing = null; |
|
| |
2063
| + |
|
| |
2064
| + /** |
|
| |
2065
| + * Whether this is in fullscreen or not. |
|
| |
2066
| + * @protected |
|
| |
2067
| + * @type {Boolean} |
|
| |
2068
| + */ |
|
| |
2069
| + this._fullscreen = false; |
|
| |
2070
| + |
|
| |
2071
| + /** |
|
| |
2072
| + * All event handlers. |
|
| |
2073
| + * @protected |
|
| |
2074
| + * @type {Object} |
|
| |
2075
| + */ |
|
| |
2076
| + this._handlers = { |
|
| |
2077
| + 'resize.owl.carousel': $.proxy(function(e) { |
|
| |
2078
| + if (this._core.settings.video && !this.isInFullScreen()) { |
|
| |
2079
| + e.preventDefault(); |
|
| |
2080
| + } |
|
| |
2081
| + }, this), |
|
| |
2082
| + 'refresh.owl.carousel changed.owl.carousel': $.proxy(function(e) { |
|
| |
2083
| + if (this._playing) { |
|
| |
2084
| + this.stop(); |
|
| |
2085
| + } |
|
| |
2086
| + }, this), |
|
| |
2087
| + 'prepared.owl.carousel': $.proxy(function(e) { |
|
| |
2088
| + var $element = $(e.content).find('.owl-video'); |
|
| |
2089
| + if ($element.length) { |
|
| |
2090
| + $element.css('display', 'none'); |
|
| |
2091
| + this.fetch($element, $(e.content)); |
|
| |
2092
| + } |
|
| |
2093
| + }, this) |
|
| |
2094
| + }; |
|
| |
2095
| + |
|
| |
2096
| + // set default options |
|
| |
2097
| + this._core.options = $.extend({}, Video.Defaults, this._core.options); |
|
| |
2098
| + |
|
| |
2099
| + // register event handlers |
|
| |
2100
| + this._core.$element.on(this._handlers); |
|
| |
2101
| + |
|
| |
2102
| + this._core.$element.on('click.owl.video', '.owl-video-play-icon', $.proxy(function(e) { |
|
| |
2103
| + this.play(e); |
|
| |
2104
| + }, this)); |
|
| |
2105
| + }; |
|
| |
2106
| + |
|
| |
2107
| + /** |
|
| |
2108
| + * Default options. |
|
| |
2109
| + * @public |
|
| |
2110
| + */ |
|
| |
2111
| + Video.Defaults = { |
|
| |
2112
| + video: false, |
|
| |
2113
| + videoHeight: false, |
|
| |
2114
| + videoWidth: false |
|
| |
2115
| + }; |
|
| |
2116
| + |
|
| |
2117
| + /** |
|
| |
2118
| + * Gets the video ID and the type (YouTube/Vimeo only). |
|
| |
2119
| + * @protected |
|
| |
2120
| + * @param {jQuery} target - The target containing the video data. |
|
| |
2121
| + * @param {jQuery} item - The item containing the video. |
|
| |
2122
| + */ |
|
| |
2123
| + Video.prototype.fetch = function(target, item) { |
|
| |
2124
| + |
|
| |
2125
| + var type = target.attr('data-vimeo-id') ? 'vimeo' : 'youtube', |
|
| |
2126
| + id = target.attr('data-vimeo-id') || target.attr('data-youtube-id'), |
|
| |
2127
| + width = target.attr('data-width') || this._core.settings.videoWidth, |
|
| |
2128
| + height = target.attr('data-height') || this._core.settings.videoHeight, |
|
| |
2129
| + url = target.attr('href'); |
|
| |
2130
| + |
|
| |
2131
| + if (url) { |
|
| |
2132
| + id = url.match(/(http:|https:|)\/\/(player.|www.)?(vimeo\.com|youtu(be\.com|\.be|be\.googleapis\.com))\/(video\/|embed\/|watch\?v=|v\/)?([A-Za-z0-9._%-]*)(\&\S+)?/); |
|
| |
2133
| + |
|
| |
2134
| + if (id[3].indexOf('youtu') > -1) { |
|
| |
2135
| + type = 'youtube'; |
|
| |
2136
| + } else if (id[3].indexOf('vimeo') > -1) { |
|
| |
2137
| + type = 'vimeo'; |
|
| |
2138
| + } else { |
|
| |
2139
| + throw new Error('Video URL not supported.'); |
|
| |
2140
| + } |
|
| |
2141
| + id = id[6]; |
|
| |
2142
| + } else { |
|
| |
2143
| + throw new Error('Missing video URL.'); |
|
| |
2144
| + } |
|
| |
2145
| + |
|
| |
2146
| + this._videos[url] = { |
|
| |
2147
| + type: type, |
|
| |
2148
| + id: id, |
|
| |
2149
| + width: width, |
|
| |
2150
| + height: height |
|
| |
2151
| + }; |
|
| |
2152
| + |
|
| |
2153
| + item.attr('data-video', url); |
|
| |
2154
| + |
|
| |
2155
| + this.thumbnail(target, this._videos[url]); |
|
| |
2156
| + }; |
|
| |
2157
| + |
|
| |
2158
| + /** |
|
| |
2159
| + * Creates video thumbnail. |
|
| |
2160
| + * @protected |
|
| |
2161
| + * @param {jQuery} target - The target containing the video data. |
|
| |
2162
| + * @param {Object} info - The video info object. |
|
| |
2163
| + * @see `fetch` |
|
| |
2164
| + */ |
|
| |
2165
| + Video.prototype.thumbnail = function(target, video) { |
|
| |
2166
| + |
|
| |
2167
| + var tnLink, |
|
| |
2168
| + icon, |
|
| |
2169
| + path, |
|
| |
2170
| + dimensions = video.width && video.height ? 'style="width:' + video.width + 'px;height:' + video.height + 'px;"' : '', |
|
| |
2171
| + customTn = target.find('img'), |
|
| |
2172
| + srcType = 'src', |
|
| |
2173
| + lazyClass = '', |
|
| |
2174
| + settings = this._core.settings, |
|
| |
2175
| + create = function(path) { |
|
| |
2176
| + icon = '<div class="owl-video-play-icon"></div>'; |
|
| |
2177
| + |
|
| |
2178
| + if (settings.lazyLoad) { |
|
| |
2179
| + tnLink = '<div class="owl-video-tn ' + lazyClass + '" ' + srcType + '="' + path + '"></div>'; |
|
| |
2180
| + } else { |
|
| |
2181
| + tnLink = '<div class="owl-video-tn" style="opacity:1;background-image:url(' + path + ')"></div>'; |
|
| |
2182
| + } |
|
| |
2183
| + target.after(tnLink); |
|
| |
2184
| + target.after(icon); |
|
| |
2185
| + }; |
|
| |
2186
| + |
|
| |
2187
| + // wrap video content into owl-video-wrapper div |
|
| |
2188
| + target.wrap('<div class="owl-video-wrapper"' + dimensions + '></div>'); |
|
| |
2189
| + |
|
| |
2190
| + if (this._core.settings.lazyLoad) { |
|
| |
2191
| + srcType = 'data-src'; |
|
| |
2192
| + lazyClass = 'owl-lazy'; |
|
| |
2193
| + } |
|
| |
2194
| + |
|
| |
2195
| + // custom thumbnail |
|
| |
2196
| + if (customTn.length) { |
|
| |
2197
| + create(customTn.attr(srcType)); |
|
| |
2198
| + customTn.remove(); |
|
| |
2199
| + return false; |
|
| |
2200
| + } |
|
| |
2201
| + |
|
| |
2202
| + if (video.type === 'youtube') { |
|
| |
2203
| + path = "http://img.youtube.com/vi/" + video.id + "/hqdefault.jpg"; |
|
| |
2204
| + create(path); |
|
| |
2205
| + } else if (video.type === 'vimeo') { |
|
| |
2206
| + $.ajax({ |
|
| |
2207
| + type: 'GET', |
|
| |
2208
| + url: 'http://vimeo.com/api/v2/video/' + video.id + '.json', |
|
| |
2209
| + jsonp: 'callback', |
|
| |
2210
| + dataType: 'jsonp', |
|
| |
2211
| + success: function(data) { |
|
| |
2212
| + path = data[0].thumbnail_large; |
|
| |
2213
| + create(path); |
|
| |
2214
| + } |
|
| |
2215
| + }); |
|
| |
2216
| + } |
|
| |
2217
| + }; |
|
| |
2218
| + |
|
| |
2219
| + /** |
|
| |
2220
| + * Stops the current video. |
|
| |
2221
| + * @public |
|
| |
2222
| + */ |
|
| |
2223
| + Video.prototype.stop = function() { |
|
| |
2224
| + this._core.trigger('stop', null, 'video'); |
|
| |
2225
| + this._playing.find('.owl-video-frame').remove(); |
|
| |
2226
| + this._playing.removeClass('owl-video-playing'); |
|
| |
2227
| + this._playing = null; |
|
| |
2228
| + }; |
|
| |
2229
| + |
|
| |
2230
| + /** |
|
| |
2231
| + * Starts the current video. |
|
| |
2232
| + * @public |
|
| |
2233
| + * @param {Event} ev - The event arguments. |
|
| |
2234
| + */ |
|
| |
2235
| + Video.prototype.play = function(ev) { |
|
| |
2236
| + this._core.trigger('play', null, 'video'); |
|
| |
2237
| + |
|
| |
2238
| + if (this._playing) { |
|
| |
2239
| + this.stop(); |
|
| |
2240
| + } |
|
| |
2241
| + |
|
| |
2242
| + var target = $(ev.target || ev.srcElement), |
|
| |
2243
| + item = target.closest('.' + this._core.settings.itemClass), |
|
| |
2244
| + video = this._videos[item.attr('data-video')], |
|
| |
2245
| + width = video.width || '100%', |
|
| |
2246
| + height = video.height || this._core.$stage.height(), |
|
| |
2247
| + html, wrap; |
|
| |
2248
| + |
|
| |
2249
| + if (video.type === 'youtube') { |
|
| |
2250
| + html = '<iframe width="' + width + '" height="' + height + '" src="http://www.youtube.com/embed/' |
|
| |
2251
| + + video.id + '?autoplay=1&v=' + video.id + '" frameborder="0" allowfullscreen></iframe>'; |
|
| |
2252
| + } else if (video.type === 'vimeo') { |
|
| |
2253
| + html = '<iframe src="http://player.vimeo.com/video/' + video.id + '?autoplay=1" width="' + width |
|
| |
2254
| + + '" height="' + height |
|
| |
2255
| + + '" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>'; |
|
| |
2256
| + } |
|
| |
2257
| + |
|
| |
2258
| + item.addClass('owl-video-playing'); |
|
| |
2259
| + this._playing = item; |
|
| |
2260
| + |
|
| |
2261
| + wrap = $('<div style="height:' + height + 'px; width:' + width + 'px" class="owl-video-frame">' |
|
| |
2262
| + + html + '</div>'); |
|
| |
2263
| + target.after(wrap); |
|
| |
2264
| + }; |
|
| |
2265
| + |
|
| |
2266
| + /** |
|
| |
2267
| + * Checks whether an video is currently in full screen mode or not. |
|
| |
2268
| + * @todo Bad style because looks like a readonly method but changes members. |
|
| |
2269
| + * @protected |
|
| |
2270
| + * @returns {Boolean} |
|
| |
2271
| + */ |
|
| |
2272
| + Video.prototype.isInFullScreen = function() { |
|
| |
2273
| + |
|
| |
2274
| + // if Vimeo Fullscreen mode |
|
| |
2275
| + var element = document.fullscreenElement || document.mozFullScreenElement |
|
| |
2276
| + || document.webkitFullscreenElement; |
|
| |
2277
| + |
|
| |
2278
| + if (element && $(element).parent().hasClass('owl-video-frame')) { |
|
| |
2279
| + this._core.speed(0); |
|
| |
2280
| + this._fullscreen = true; |
|
| |
2281
| + } |
|
| |
2282
| + |
|
| |
2283
| + if (element && this._fullscreen && this._playing) { |
|
| |
2284
| + return false; |
|
| |
2285
| + } |
|
| |
2286
| + |
|
| |
2287
| + // comming back from fullscreen |
|
| |
2288
| + if (this._fullscreen) { |
|
| |
2289
| + this._fullscreen = false; |
|
| |
2290
| + return false; |
|
| |
2291
| + } |
|
| |
2292
| + |
|
| |
2293
| + // check full screen mode and window orientation |
|
| |
2294
| + if (this._playing) { |
|
| |
2295
| + if (this._core.state.orientation !== window.orientation) { |
|
| |
2296
| + this._core.state.orientation = window.orientation; |
|
| |
2297
| + return false; |
|
| |
2298
| + } |
|
| |
2299
| + } |
|
| |
2300
| + |
|
| |
2301
| + return true; |
|
| |
2302
| + }; |
|
| |
2303
| + |
|
| |
2304
| + /** |
|
| |
2305
| + * Destroys the plugin. |
|
| |
2306
| + */ |
|
| |
2307
| + Video.prototype.destroy = function() { |
|
| |
2308
| + var handler, property; |
|
| |
2309
| + |
|
| |
2310
| + this._core.$element.off('click.owl.video'); |
|
| |
2311
| + |
|
| |
2312
| + for (handler in this._handlers) { |
|
| |
2313
| + this._core.$element.off(handler, this._handlers[handler]); |
|
| |
2314
| + } |
|
| |
2315
| + for (property in Object.getOwnPropertyNames(this)) { |
|
| |
2316
| + typeof this[property] != 'function' && (this[property] = null); |
|
| |
2317
| + } |
|
| |
2318
| + }; |
|
| |
2319
| + |
|
| |
2320
| + $.fn.owlCarousel.Constructor.Plugins.Video = Video; |
|
| |
2321
| + |
|
| |
2322
| +})(window.Zepto || window.jQuery, window, document); |
|
| |
2323
| + |
|
| |
2324
| +/** |
|
| |
2325
| + * Animate Plugin |
|
| |
2326
| + * @version 2.0.0 |
|
| |
2327
| + * @author Bartosz Wojciechowski |
|
| |
2328
| + * @license The MIT License (MIT) |
|
| |
2329
| + */ |
|
| |
2330
| +;(function($, window, document, undefined) { |
|
| |
2331
| + |
|
| |
2332
| + /** |
|
| |
2333
| + * Creates the animate plugin. |
|
| |
2334
| + * @class The Navigation Plugin |
|
| |
2335
| + * @param {Owl} scope - The Owl Carousel |
|
| |
2336
| + */ |
|
| |
2337
| + var Animate = function(scope) { |
|
| |
2338
| + this.core = scope; |
|
| |
2339
| + this.core.options = $.extend({}, Animate.Defaults, this.core.options); |
|
| |
2340
| + this.swapping = true; |
|
| |
2341
| + this.previous = undefined; |
|
| |
2342
| + this.next = undefined; |
|
| |
2343
| + |
|
| |
2344
| + this.handlers = { |
|
| |
2345
| + 'change.owl.carousel': $.proxy(function(e) { |
|
| |
2346
| + if (e.property.name == 'position') { |
|
| |
2347
| + this.previous = this.core.current(); |
|
| |
2348
| + this.next = e.property.value; |
|
| |
2349
| + } |
|
| |
2350
| + }, this), |
|
| |
2351
| + 'drag.owl.carousel dragged.owl.carousel translated.owl.carousel': $.proxy(function(e) { |
|
| |
2352
| + this.swapping = e.type == 'translated'; |
|
| |
2353
| + }, this), |
|
| |
2354
| + 'translate.owl.carousel': $.proxy(function(e) { |
|
| |
2355
| + if (this.swapping && (this.core.options.animateOut || this.core.options.animateIn)) { |
|
| |
2356
| + this.swap(); |
|
| |
2357
| + } |
|
| |
2358
| + }, this) |
|
| |
2359
| + }; |
|
| |
2360
| + |
|
| |
2361
| + this.core.$element.on(this.handlers); |
|
| |
2362
| + }; |
|
| |
2363
| + |
|
| |
2364
| + /** |
|
| |
2365
| + * Default options. |
|
| |
2366
| + * @public |
|
| |
2367
| + */ |
|
| |
2368
| + Animate.Defaults = { |
|
| |
2369
| + animateOut: false, |
|
| |
2370
| + animateIn: false |
|
| |
2371
| + }; |
|
| |
2372
| + |
|
| |
2373
| + /** |
|
| |
2374
| + * Toggles the animation classes whenever an translations starts. |
|
| |
2375
| + * @protected |
|
| |
2376
| + * @returns {Boolean|undefined} |
|
| |
2377
| + */ |
|
| |
2378
| + Animate.prototype.swap = function() { |
|
| |
2379
| + |
|
| |
2380
| + if (this.core.settings.items !== 1 || !this.core.support3d) { |
|
| |
2381
| + return; |
|
| |
2382
| + } |
|
| |
2383
| + |
|
| |
2384
| + this.core.speed(0); |
|
| |
2385
| + |
|
| |
2386
| + var left, |
|
| |
2387
| + clear = $.proxy(this.clear, this), |
|
| |
2388
| + previous = this.core.$stage.children().eq(this.previous), |
|
| |
2389
| + next = this.core.$stage.children().eq(this.next), |
|
| |
2390
| + incoming = this.core.settings.animateIn, |
|
| |
2391
| + outgoing = this.core.settings.animateOut; |
|
| |
2392
| + |
|
| |
2393
| + if (this.core.current() === this.previous) { |
|
| |
2394
| + return; |
|
| |
2395
| + } |
|
| |
2396
| + |
|
| |
2397
| + if (outgoing) { |
|
| |
2398
| + left = this.core.coordinates(this.previous) - this.core.coordinates(this.next); |
|
| |
2399
| + previous.css( { 'left': left + 'px' } ) |
|
| |
2400
| + .addClass('animated owl-animated-out') |
|
| |
2401
| + .addClass(outgoing) |
|
| |
2402
| + .one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', clear); |
|
| |
2403
| + } |
|
| |
2404
| + |
|
| |
2405
| + if (incoming) { |
|
| |
2406
| + next.addClass('animated owl-animated-in') |
|
| |
2407
| + .addClass(incoming) |
|
| |
2408
| + .one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', clear); |
|
| |
2409
| + } |
|
| |
2410
| + }; |
|
| |
2411
| + |
|
| |
2412
| + Animate.prototype.clear = function(e) { |
|
| |
2413
| + $(e.target).css( { 'left': '' } ) |
|
| |
2414
| + .removeClass('animated owl-animated-out owl-animated-in') |
|
| |
2415
| + .removeClass(this.core.settings.animateIn) |
|
| |
2416
| + .removeClass(this.core.settings.animateOut); |
|
| |
2417
| + this.core.transitionEnd(); |
|
| |
2418
| + } |
|
| |
2419
| + |
|
| |
2420
| + /** |
|
| |
2421
| + * Destroys the plugin. |
|
| |
2422
| + * @public |
|
| |
2423
| + */ |
|
| |
2424
| + Animate.prototype.destroy = function() { |
|
| |
2425
| + var handler, property; |
|
| |
2426
| + |
|
| |
2427
| + for (handler in this.handlers) { |
|
| |
2428
| + this.core.$element.off(handler, this.handlers[handler]); |
|
| |
2429
| + } |
|
| |
2430
| + for (property in Object.getOwnPropertyNames(this)) { |
|
| |
2431
| + typeof this[property] != 'function' && (this[property] = null); |
|
| |
2432
| + } |
|
| |
2433
| + }; |
|
| |
2434
| + |
|
| |
2435
| + $.fn.owlCarousel.Constructor.Plugins.Animate = Animate; |
|
| |
2436
| + |
|
| |
2437
| +})(window.Zepto || window.jQuery, window, document); |
|
| |
2438
| + |
|
| |
2439
| +/** |
|
| |
2440
| + * Autoplay Plugin |
|
| |
2441
| + * @version 2.0.0 |
|
| |
2442
| + * @author Bartosz Wojciechowski |
|
| |
2443
| + * @license The MIT License (MIT) |
|
| |
2444
| + */ |
|
| |
2445
| +;(function($, window, document, undefined) { |
|
| |
2446
| + |
|
| |
2447
| + /** |
|
| |
2448
| + * Creates the autoplay plugin. |
|
| |
2449
| + * @class The Autoplay Plugin |
|
| |
2450
| + * @param {Owl} scope - The Owl Carousel |
|
| |
2451
| + */ |
|
| |
2452
| + var Autoplay = function(scope) { |
|
| |
2453
| + this.core = scope; |
|
| |
2454
| + this.core.options = $.extend({}, Autoplay.Defaults, this.core.options); |
|
| |
2455
| + |
|
| |
2456
| + this.handlers = { |
|
| |
2457
| + 'translated.owl.carousel refreshed.owl.carousel': $.proxy(function() { |
|
| |
2458
| + this.autoplay(); |
|
| |
2459
| + }, this), |
|
| |
2460
| + 'play.owl.autoplay': $.proxy(function(e, t, s) { |
|
| |
2461
| + this.play(t, s); |
|
| |
2462
| + }, this), |
|
| |
2463
| + 'stop.owl.autoplay': $.proxy(function() { |
|
| |
2464
| + this.stop(); |
|
| |
2465
| + }, this), |
|
| |
2466
| + 'mouseover.owl.autoplay': $.proxy(function() { |
|
| |
2467
| + if (this.core.settings.autoplayHoverPause) { |
|
| |
2468
| + this.pause(); |
|
| |
2469
| + } |
|
| |
2470
| + }, this), |
|
| |
2471
| + 'mouseleave.owl.autoplay': $.proxy(function() { |
|
| |
2472
| + if (this.core.settings.autoplayHoverPause) { |
|
| |
2473
| + this.autoplay(); |
|
| |
2474
| + } |
|
| |
2475
| + }, this) |
|
| |
2476
| + }; |
|
| |
2477
| + |
|
| |
2478
| + this.core.$element.on(this.handlers); |
|
| |
2479
| + }; |
|
| |
2480
| + |
|
| |
2481
| + /** |
|
| |
2482
| + * Default options. |
|
| |
2483
| + * @public |
|
| |
2484
| + */ |
|
| |
2485
| + Autoplay.Defaults = { |
|
| |
2486
| + autoplay: false, |
|
| |
2487
| + autoplayTimeout: 5000, |
|
| |
2488
| + autoplayHoverPause: false, |
|
| |
2489
| + autoplaySpeed: false |
|
| |
2490
| + }; |
|
| |
2491
| + |
|
| |
2492
| + /** |
|
| |
2493
| + * @protected |
|
| |
2494
| + * @todo Must be documented. |
|
| |
2495
| + */ |
|
| |
2496
| + Autoplay.prototype.autoplay = function() { |
|
| |
2497
| + if (this.core.settings.autoplay && !this.core.state.videoPlay) { |
|
| |
2498
| + window.clearInterval(this.interval); |
|
| |
2499
| + |
|
| |
2500
| + this.interval = window.setInterval($.proxy(function() { |
|
| |
2501
| + this.play(); |
|
| |
2502
| + }, this), this.core.settings.autoplayTimeout); |
|
| |
2503
| + } else { |
|
| |
2504
| + window.clearInterval(this.interval); |
|
| |
2505
| + } |
|
| |
2506
| + }; |
|
| |
2507
| + |
|
| |
2508
| + /** |
|
| |
2509
| + * Starts the autoplay. |
|
| |
2510
| + * @public |
|
| |
2511
| + * @param {Number} [timeout] - ... |
|
| |
2512
| + * @param {Number} [speed] - ... |
|
| |
2513
| + * @returns {Boolean|undefined} - ... |
|
| |
2514
| + * @todo Must be documented. |
|
| |
2515
| + */ |
|
| |
2516
| + Autoplay.prototype.play = function(timeout, speed) { |
|
| |
2517
| + // if tab is inactive - doesnt work in <IE10 |
|
| |
2518
| + if (document.hidden === true) { |
|
| |
2519
| + return; |
|
| |
2520
| + } |
|
| |
2521
| + |
|
| |
2522
| + if (this.core.state.isTouch || this.core.state.isScrolling |
|
| |
2523
| + || this.core.state.isSwiping || this.core.state.inMotion) { |
|
| |
2524
| + return; |
|
| |
2525
| + } |
|
| |
2526
| + |
|
| |
2527
| + if (this.core.settings.autoplay === false) { |
|
| |
2528
| + window.clearInterval(this.interval); |
|
| |
2529
| + return; |
|
| |
2530
| + } |
|
| |
2531
| + |
|
| |
2532
| + this.core.next(this.core.settings.autoplaySpeed); |
|
| |
2533
| + }; |
|
| |
2534
| + |
|
| |
2535
| + /** |
|
| |
2536
| + * Stops the autoplay. |
|
| |
2537
| + * @public |
|
| |
2538
| + */ |
|
| |
2539
| + Autoplay.prototype.stop = function() { |
|
| |
2540
| + window.clearInterval(this.interval); |
|
| |
2541
| + }; |
|
| |
2542
| + |
|
| |
2543
| + /** |
|
| |
2544
| + * Pauses the autoplay. |
|
| |
2545
| + * @public |
|
| |
2546
| + */ |
|
| |
2547
| + Autoplay.prototype.pause = function() { |
|
| |
2548
| + window.clearInterval(this.interval); |
|
| |
2549
| + }; |
|
| |
2550
| + |
|
| |
2551
| + /** |
|
| |
2552
| + * Destroys the plugin. |
|
| |
2553
| + */ |
|
| |
2554
| + Autoplay.prototype.destroy = function() { |
|
| |
2555
| + var handler, property; |
|
| |
2556
| + |
|
| |
2557
| + window.clearInterval(this.interval); |
|
| |
2558
| + |
|
| |
2559
| + for (handler in this.handlers) { |
|
| |
2560
| + this.core.$element.off(handler, this.handlers[handler]); |
|
| |
2561
| + } |
|
| |
2562
| + for (property in Object.getOwnPropertyNames(this)) { |
|
| |
2563
| + typeof this[property] != 'function' && (this[property] = null); |
|
| |
2564
| + } |
|
| |
2565
| + }; |
|
| |
2566
| + |
|
| |
2567
| + $.fn.owlCarousel.Constructor.Plugins.autoplay = Autoplay; |
|
| |
2568
| + |
|
| |
2569
| +})(window.Zepto || window.jQuery, window, document); |
|
| |
2570
| + |
|
| |
2571
| +/** |
|
| |
2572
| + * Navigation Plugin |
|
| |
2573
| + * @version 2.0.0 |
|
| |
2574
| + * @author Artus Kolanowski |
|
| |
2575
| + * @license The MIT License (MIT) |
|
| |
2576
| + */ |
|
| |
2577
| +;(function($, window, document, undefined) { |
|
| |
2578
| + 'use strict'; |
|
| |
2579
| + |
|
| |
2580
| + /** |
|
| |
2581
| + * Creates the navigation plugin. |
|
| |
2582
| + * @class The Navigation Plugin |
|
| |
2583
| + * @param {Owl} carousel - The Owl Carousel. |
|
| |
2584
| + */ |
|
| |
2585
| + var Navigation = function(carousel) { |
|
| |
2586
| + /** |
|
| |
2587
| + * Reference to the core. |
|
| |
2588
| + * @protected |
|
| |
2589
| + * @type {Owl} |
|
| |
2590
| + */ |
|
| |
2591
| + this._core = carousel; |
|
| |
2592
| + |
|
| |
2593
| + /** |
|
| |
2594
| + * Indicates whether the plugin is initialized or not. |
|
| |
2595
| + * @protected |
|
| |
2596
| + * @type {Boolean} |
|
| |
2597
| + */ |
|
| |
2598
| + this._initialized = false; |
|
| |
2599
| + |
|
| |
2600
| + /** |
|
| |
2601
| + * The current paging indexes. |
|
| |
2602
| + * @protected |
|
| |
2603
| + * @type {Array} |
|
| |
2604
| + */ |
|
| |
2605
| + this._pages = []; |
|
| |
2606
| + |
|
| |
2607
| + /** |
|
| |
2608
| + * All DOM elements of the user interface. |
|
| |
2609
| + * @protected |
|
| |
2610
| + * @type {Object} |
|
| |
2611
| + */ |
|
| |
2612
| + this._controls = {}; |
|
| |
2613
| + |
|
| |
2614
| + /** |
|
| |
2615
| + * Markup for an indicator. |
|
| |
2616
| + * @protected |
|
| |
2617
| + * @type {Array.<String>} |
|
| |
2618
| + */ |
|
| |
2619
| + this._templates = []; |
|
| |
2620
| + |
|
| |
2621
| + /** |
|
| |
2622
| + * The carousel element. |
|
| |
2623
| + * @type {jQuery} |
|
| |
2624
| + */ |
|
| |
2625
| + this.$element = this._core.$element; |
|
| |
2626
| + |
|
| |
2627
| + /** |
|
| |
2628
| + * Overridden methods of the carousel. |
|
| |
2629
| + * @protected |
|
| |
2630
| + * @type {Object} |
|
| |
2631
| + */ |
|
| |
2632
| + this._overrides = { |
|
| |
2633
| + next: this._core.next, |
|
| |
2634
| + prev: this._core.prev, |
|
| |
2635
| + to: this._core.to |
|
| |
2636
| + }; |
|
| |
2637
| + |
|
| |
2638
| + /** |
|
| |
2639
| + * All event handlers. |
|
| |
2640
| + * @protected |
|
| |
2641
| + * @type {Object} |
|
| |
2642
| + */ |
|
| |
2643
| + this._handlers = { |
|
| |
2644
| + 'prepared.owl.carousel': $.proxy(function(e) { |
|
| |
2645
| + if (this._core.settings.dotsData) { |
|
| |
2646
| + this._templates.push($(e.content).find('[data-dot]').andSelf('[data-dot]').attr('data-dot')); |
|
| |
2647
| + } |
|
| |
2648
| + }, this), |
|
| |
2649
| + 'add.owl.carousel': $.proxy(function(e) { |
|
| |
2650
| + if (this._core.settings.dotsData) { |
|
| |
2651
| + this._templates.splice(e.position, 0, $(e.content).find('[data-dot]').andSelf('[data-dot]').attr('data-dot')); |
|
| |
2652
| + } |
|
| |
2653
| + }, this), |
|
| |
2654
| + 'remove.owl.carousel prepared.owl.carousel': $.proxy(function(e) { |
|
| |
2655
| + if (this._core.settings.dotsData) { |
|
| |
2656
| + this._templates.splice(e.position, 1); |
|
| |
2657
| + } |
|
| |
2658
| + }, this), |
|
| |
2659
| + 'change.owl.carousel': $.proxy(function(e) { |
|
| |
2660
| + if (e.property.name == 'position') { |
|
| |
2661
| + if (!this._core.state.revert && !this._core.settings.loop && this._core.settings.navRewind) { |
|
| |
2662
| + var current = this._core.current(), |
|
| |
2663
| + maximum = this._core.maximum(), |
|
| |
2664
| + minimum = this._core.minimum(); |
|
| |
2665
| + e.data = e.property.value > maximum |
|
| |
2666
| + ? current >= maximum ? minimum : maximum |
|
| |
2667
| + : e.property.value < minimum ? maximum : e.property.value; |
|
| |
2668
| + } |
|
| |
2669
| + } |
|
| |
2670
| + }, this), |
|
| |
2671
| + 'changed.owl.carousel': $.proxy(function(e) { |
|
| |
2672
| + if (e.property.name == 'position') { |
|
| |
2673
| + this.draw(); |
|
| |
2674
| + } |
|
| |
2675
| + }, this), |
|
| |
2676
| + 'refreshed.owl.carousel': $.proxy(function() { |
|
| |
2677
| + if (!this._initialized) { |
|
| |
2678
| + this.initialize(); |
|
| |
2679
| + this._initialized = true; |
|
| |
2680
| + } |
|
| |
2681
| + this._core.trigger('refresh', null, 'navigation'); |
|
| |
2682
| + this.update(); |
|
| |
2683
| + this.draw(); |
|
| |
2684
| + this._core.trigger('refreshed', null, 'navigation'); |
|
| |
2685
| + }, this) |
|
| |
2686
| + }; |
|
| |
2687
| + |
|
| |
2688
| + // set default options |
|
| |
2689
| + this._core.options = $.extend({}, Navigation.Defaults, this._core.options); |
|
| |
2690
| + |
|
| |
2691
| + // register event handlers |
|
| |
2692
| + this.$element.on(this._handlers); |
|
| |
2693
| + } |
|
| |
2694
| + |
|
| |
2695
| + /** |
|
| |
2696
| + * Default options. |
|
| |
2697
| + * @public |
|
| |
2698
| + * @todo Rename `slideBy` to `navBy` |
|
| |
2699
| + */ |
|
| |
2700
| + Navigation.Defaults = { |
|
| |
2701
| + nav: false, |
|
| |
2702
| + navRewind: true, |
|
| |
2703
| + navText: [ 'prev', 'next' ], |
|
| |
2704
| + navSpeed: false, |
|
| |
2705
| + navElement: 'div', |
|
| |
2706
| + navContainer: false, |
|
| |
2707
| + navContainerClass: 'owl-nav', |
|
| |
2708
| + navClass: [ 'owl-prev', 'owl-next' ], |
|
| |
2709
| + slideBy: 1, |
|
| |
2710
| + dotClass: 'owl-dot', |
|
| |
2711
| + dotsClass: 'owl-dots', |
|
| |
2712
| + dots: true, |
|
| |
2713
| + dotsEach: false, |
|
| |
2714
| + dotData: false, |
|
| |
2715
| + dotsSpeed: false, |
|
| |
2716
| + dotsContainer: false, |
|
| |
2717
| + controlsClass: 'owl-controls' |
|
| |
2718
| + } |
|
| |
2719
| + |
|
| |
2720
| + /** |
|
| |
2721
| + * Initializes the layout of the plugin and extends the carousel. |
|
| |
2722
| + * @protected |
|
| |
2723
| + */ |
|
| |
2724
| + Navigation.prototype.initialize = function() { |
|
| |
2725
| + var $container, override, |
|
| |
2726
| + options = this._core.settings; |
|
| |
2727
| + |
|
| |
2728
| + // create the indicator template |
|
| |
2729
| + if (!options.dotsData) { |
|
| |
2730
| + this._templates = [ $('<div>') |
|
| |
2731
| + .addClass(options.dotClass) |
|
| |
2732
| + .append($('<span>')) |
|
| |
2733
| + .prop('outerHTML') ]; |
|
| |
2734
| + } |
|
| |
2735
| + |
|
| |
2736
| + // create controls container if needed |
|
| |
2737
| + if (!options.navContainer || !options.dotsContainer) { |
|
| |
2738
| + this._controls.$container = $('<div>') |
|
| |
2739
| + .addClass(options.controlsClass) |
|
| |
2740
| + .appendTo(this.$element); |
|
| |
2741
| + } |
|
| |
2742
| + |
|
| |
2743
| + // create DOM structure for absolute navigation |
|
| |
2744
| + this._controls.$indicators = options.dotsContainer ? $(options.dotsContainer) |
|
| |
2745
| + : $('<div>').hide().addClass(options.dotsClass).appendTo(this._controls.$container); |
|
| |
2746
| + |
|
| |
2747
| + this._controls.$indicators.on('click', 'div', $.proxy(function(e) { |
|
| |
2748
| + var index = $(e.target).parent().is(this._controls.$indicators) |
|
| |
2749
| + ? $(e.target).index() : $(e.target).parent().index(); |
|
| |
2750
| + |
|
| |
2751
| + e.preventDefault(); |
|
| |
2752
| + |
|
| |
2753
| + this.to(index, options.dotsSpeed); |
|
| |
2754
| + }, this)); |
|
| |
2755
| + |
|
| |
2756
| + // create DOM structure for relative navigation |
|
| |
2757
| + $container = options.navContainer ? $(options.navContainer) |
|
| |
2758
| + : $('<div>').addClass(options.navContainerClass).prependTo(this._controls.$container); |
|
| |
2759
| + |
|
| |
2760
| + this._controls.$next = $('<' + options.navElement + '>'); |
|
| |
2761
| + this._controls.$previous = this._controls.$next.clone(); |
|
| |
2762
| + |
|
| |
2763
| + this._controls.$previous |
|
| |
2764
| + .addClass(options.navClass[0]) |
|
| |
2765
| + .html(options.navText[0]) |
|
| |
2766
| + .hide() |
|
| |
2767
| + .prependTo($container) |
|
| |
2768
| + .on('click', $.proxy(function(e) { |
|
| |
2769
| + this.prev(options.navSpeed); |
|
| |
2770
| + }, this)); |
|
| |
2771
| + this._controls.$next |
|
| |
2772
| + .addClass(options.navClass[1]) |
|
| |
2773
| + .html(options.navText[1]) |
|
| |
2774
| + .hide() |
|
| |
2775
| + .appendTo($container) |
|
| |
2776
| + .on('click', $.proxy(function(e) { |
|
| |
2777
| + this.next(options.navSpeed); |
|
| |
2778
| + }, this)); |
|
| |
2779
| + |
|
| |
2780
| + // override public methods of the carousel |
|
| |
2781
| + for (override in this._overrides) { |
|
| |
2782
| + this._core[override] = $.proxy(this[override], this); |
|
| |
2783
| + } |
|
| |
2784
| + } |
|
| |
2785
| + |
|
| |
2786
| + /** |
|
| |
2787
| + * Destroys the plugin. |
|
| |
2788
| + * @protected |
|
| |
2789
| + */ |
|
| |
2790
| + Navigation.prototype.destroy = function() { |
|
| |
2791
| + var handler, control, property, override; |
|
| |
2792
| + |
|
| |
2793
| + for (handler in this._handlers) { |
|
| |
2794
| + this.$element.off(handler, this._handlers[handler]); |
|
| |
2795
| + } |
|
| |
2796
| + for (control in this._controls) { |
|
| |
2797
| + this._controls[control].remove(); |
|
| |
2798
| + } |
|
| |
2799
| + for (override in this.overides) { |
|
| |
2800
| + this._core[override] = this._overrides[override]; |
|
| |
2801
| + } |
|
| |
2802
| + for (property in Object.getOwnPropertyNames(this)) { |
|
| |
2803
| + typeof this[property] != 'function' && (this[property] = null); |
|
| |
2804
| + } |
|
| |
2805
| + } |
|
| |
2806
| + |
|
| |
2807
| + /** |
|
| |
2808
| + * Updates the internal state. |
|
| |
2809
| + * @protected |
|
| |
2810
| + */ |
|
| |
2811
| + Navigation.prototype.update = function() { |
|
| |
2812
| + var i, j, k, |
|
| |
2813
| + options = this._core.settings, |
|
| |
2814
| + lower = this._core.clones().length / 2, |
|
| |
2815
| + upper = lower + this._core.items().length, |
|
| |
2816
| + size = options.center || options.autoWidth || options.dotData |
|
| |
2817
| + ? 1 : options.dotsEach || options.items; |
|
| |
2818
| + |
|
| |
2819
| + if (options.slideBy !== 'page') { |
|
| |
2820
| + options.slideBy = Math.min(options.slideBy, options.items); |
|
| |
2821
| + } |
|
| |
2822
| + |
|
| |
2823
| + if (options.dots || options.slideBy == 'page') { |
|
| |
2824
| + this._pages = []; |
|
| |
2825
| + |
|
| |
2826
| + for (i = lower, j = 0, k = 0; i < upper; i++) { |
|
| |
2827
| + if (j >= size || j === 0) { |
|
| |
2828
| + this._pages.push({ |
|
| |
2829
| + start: i - lower, |
|
| |
2830
| + end: i - lower + size - 1 |
|
| |
2831
| + }); |
|
| |
2832
| + j = 0, ++k; |
|
| |
2833
| + } |
|
| |
2834
| + j += this._core.mergers(this._core.relative(i)); |
|
| |
2835
| + } |
|
| |
2836
| + } |
|
| |
2837
| + } |
|
| |
2838
| + |
|
| |
2839
| + /** |
|
| |
2840
| + * Draws the user interface. |
|
| |
2841
| + * @todo The option `dotData` wont work. |
|
| |
2842
| + * @protected |
|
| |
2843
| + */ |
|
| |
2844
| + Navigation.prototype.draw = function() { |
|
| |
2845
| + var difference, i, html = '', |
|
| |
2846
| + options = this._core.settings, |
|
| |
2847
| + $items = this._core.$stage.children(), |
|
| |
2848
| + index = this._core.relative(this._core.current()); |
|
| |
2849
| + |
|
| |
2850
| + if (options.nav && !options.loop && !options.navRewind) { |
|
| |
2851
| + this._controls.$previous.toggleClass('disabled', index <= 0); |
|
| |
2852
| + this._controls.$next.toggleClass('disabled', index >= this._core.maximum()); |
|
| |
2853
| + } |
|
| |
2854
| + |
|
| |
2855
| + this._controls.$previous.toggle(options.nav); |
|
| |
2856
| + this._controls.$next.toggle(options.nav); |
|
| |
2857
| + |
|
| |
2858
| + if (options.dots) { |
|
| |
2859
| + difference = this._pages.length - this._controls.$indicators.children().length; |
|
| |
2860
| + |
|
| |
2861
| + if (options.dotData && difference !== 0) { |
|
| |
2862
| + for (i = 0; i < this._controls.$indicators.children().length; i++) { |
|
| |
2863
| + html += this._templates[this._core.relative(i)]; |
|
| |
2864
| + } |
|
| |
2865
| + this._controls.$indicators.html(html); |
|
| |
2866
| + } else if (difference > 0) { |
|
| |
2867
| + html = new Array(difference + 1).join(this._templates[0]); |
|
| |
2868
| + this._controls.$indicators.append(html); |
|
| |
2869
| + } else if (difference < 0) { |
|
| |
2870
| + this._controls.$indicators.children().slice(difference).remove(); |
|
| |
2871
| + } |
|
| |
2872
| + |
|
| |
2873
| + this._controls.$indicators.find('.active').removeClass('active'); |
|
| |
2874
| + this._controls.$indicators.children().eq($.inArray(this.current(), this._pages)).addClass('active'); |
|
| |
2875
| + } |
|
| |
2876
| + |
|
| |
2877
| + this._controls.$indicators.toggle(options.dots); |
|
| |
2878
| + } |
|
| |
2879
| + |
|
| |
2880
| + /** |
|
| |
2881
| + * Extends event data. |
|
| |
2882
| + * @protected |
|
| |
2883
| + * @param {Event} event - The event object which gets thrown. |
|
| |
2884
| + */ |
|
| |
2885
| + Navigation.prototype.onTrigger = function(event) { |
|
| |
2886
| + var settings = this._core.settings; |
|
| |
2887
| + |
|
| |
2888
| + event.page = { |
|
| |
2889
| + index: $.inArray(this.current(), this._pages), |
|
| |
2890
| + count: this._pages.length, |
|
| |
2891
| + size: settings && (settings.center || settings.autoWidth || settings.dotData |
|
| |
2892
| + ? 1 : settings.dotsEach || settings.items) |
|
| |
2893
| + }; |
|
| |
2894
| + } |
|
| |
2895
| + |
|
| |
2896
| + /** |
|
| |
2897
| + * Gets the current page position of the carousel. |
|
| |
2898
| + * @protected |
|
| |
2899
| + * @returns {Number} |
|
| |
2900
| + */ |
|
| |
2901
| + Navigation.prototype.current = function() { |
|
| |
2902
| + var index = this._core.relative(this._core.current()); |
|
| |
2903
| + return $.grep(this._pages, function(o) { |
|
| |
2904
| + return o.start <= index && o.end >= index; |
|
| |
2905
| + }).pop(); |
|
| |
2906
| + } |
|
| |
2907
| + |
|
| |
2908
| + /** |
|
| |
2909
| + * Gets the current succesor/predecessor position. |
|
| |
2910
| + * @protected |
|
| |
2911
| + * @returns {Number} |
|
| |
2912
| + */ |
|
| |
2913
| + Navigation.prototype.getPosition = function(successor) { |
|
| |
2914
| + var position, length, |
|
| |
2915
| + options = this._core.settings; |
|
| |
2916
| + |
|
| |
2917
| + if (options.slideBy == 'page') { |
|
| |
2918
| + position = $.inArray(this.current(), this._pages); |
|
| |
2919
| + length = this._pages.length; |
|
| |
2920
| + successor ? ++position : --position; |
|
| |
2921
| + position = this._pages[((position % length) + length) % length].start; |
|
| |
2922
| + } else { |
|
| |
2923
| + position = this._core.relative(this._core.current()); |
|
| |
2924
| + length = this._core.items().length; |
|
| |
2925
| + successor ? position += options.slideBy : position -= options.slideBy; |
|
| |
2926
| + } |
|
| |
2927
| + return position; |
|
| |
2928
| + } |
|
| |
2929
| + |
|
| |
2930
| + /** |
|
| |
2931
| + * Slides to the next item or page. |
|
| |
2932
| + * @public |
|
| |
2933
| + * @param {Number} [speed=false] - The time in milliseconds for the transition. |
|
| |
2934
| + */ |
|
| |
2935
| + Navigation.prototype.next = function(speed) { |
|
| |
2936
| + $.proxy(this._overrides.to, this._core)(this.getPosition(true), speed); |
|
| |
2937
| + } |
|
| |
2938
| + |
|
| |
2939
| + /** |
|
| |
2940
| + * Slides to the previous item or page. |
|
| |
2941
| + * @public |
|
| |
2942
| + * @param {Number} [speed=false] - The time in milliseconds for the transition. |
|
| |
2943
| + */ |
|
| |
2944
| + Navigation.prototype.prev = function(speed) { |
|
| |
2945
| + $.proxy(this._overrides.to, this._core)(this.getPosition(false), speed); |
|
| |
2946
| + } |
|
| |
2947
| + |
|
| |
2948
| + /** |
|
| |
2949
| + * Slides to the specified item or page. |
|
| |
2950
| + * @public |
|
| |
2951
| + * @param {Number} position - The position of the item or page. |
|
| |
2952
| + * @param {Number} [speed] - The time in milliseconds for the transition. |
|
| |
2953
| + * @param {Boolean} [standard=false] - Whether to use the standard behaviour or not. |
|
| |
2954
| + */ |
|
| |
2955
| + Navigation.prototype.to = function(position, speed, standard) { |
|
| |
2956
| + var length; |
|
| |
2957
| + |
|
| |
2958
| + if (!standard) { |
|
| |
2959
| + length = this._pages.length; |
|
| |
2960
| + $.proxy(this._overrides.to, this._core)(this._pages[((position % length) + length) % length].start, speed); |
|
| |
2961
| + } else { |
|
| |
2962
| + $.proxy(this._overrides.to, this._core)(position, speed); |
|
| |
2963
| + } |
|
| |
2964
| + } |
|
| |
2965
| + |
|
| |
2966
| + $.fn.owlCarousel.Constructor.Plugins.Navigation = Navigation; |
|
| |
2967
| + |
|
| |
2968
| +})(window.Zepto || window.jQuery, window, document); |
|
| |
2969
| + |
|
| |
2970
| +/** |
|
| |
2971
| + * Hash Plugin |
|
| |
2972
| + * @version 2.0.0 |
|
| |
2973
| + * @author Artus Kolanowski |
|
| |
2974
| + * @license The MIT License (MIT) |
|
| |
2975
| + */ |
|
| |
2976
| +;(function($, window, document, undefined) { |
|
| |
2977
| + 'use strict'; |
|
| |
2978
| + |
|
| |
2979
| + /** |
|
| |
2980
| + * Creates the hash plugin. |
|
| |
2981
| + * @class The Hash Plugin |
|
| |
2982
| + * @param {Owl} carousel - The Owl Carousel |
|
| |
2983
| + */ |
|
| |
2984
| + var Hash = function(carousel) { |
|
| |
2985
| + /** |
|
| |
2986
| + * Reference to the core. |
|
| |
2987
| + * @protected |
|
| |
2988
| + * @type {Owl} |
|
| |
2989
| + */ |
|
| |
2990
| + this._core = carousel; |
|
| |
2991
| + |
|
| |
2992
| + /** |
|
| |
2993
| + * Hash table for the hashes. |
|
| |
2994
| + * @protected |
|
| |
2995
| + * @type {Object} |
|
| |
2996
| + */ |
|
| |
2997
| + this._hashes = {}; |
|
| |
2998
| + |
|
| |
2999
| + /** |
|
| |
3000
| + * The carousel element. |
|
| |
3001
| + * @type {jQuery} |
|
| |
3002
| + */ |
|
| |
3003
| + this.$element = this._core.$element; |
|
| |
3004
| + |
|
| |
3005
| + /** |
|
| |
3006
| + * All event handlers. |
|
| |
3007
| + * @protected |
|
| |
3008
| + * @type {Object} |
|
| |
3009
| + */ |
|
| |
3010
| + this._handlers = { |
|
| |
3011
| + 'initialized.owl.carousel': $.proxy(function() { |
|
| |
3012
| + if (this._core.settings.startPosition == 'URLHash') { |
|
| |
3013
| + $(window).trigger('hashchange.owl.navigation'); |
|
| |
3014
| + } |
|
| |
3015
| + }, this), |
|
| |
3016
| + 'prepared.owl.carousel': $.proxy(function(e) { |
|
| |
3017
| + var hash = $(e.content).find('[data-hash]').andSelf('[data-hash]').attr('data-hash'); |
|
| |
3018
| + this._hashes[hash] = e.content; |
|
| |
3019
| + }, this) |
|
| |
3020
| + }; |
|
| |
3021
| + |
|
| |
3022
| + // set default options |
|
| |
3023
| + this._core.options = $.extend({}, Hash.Defaults, this._core.options); |
|
| |
3024
| + |
|
| |
3025
| + // register the event handlers |
|
| |
3026
| + this.$element.on(this._handlers); |
|
| |
3027
| + |
|
| |
3028
| + // register event listener for hash navigation |
|
| |
3029
| + $(window).on('hashchange.owl.navigation', $.proxy(function() { |
|
| |
3030
| + var hash = window.location.hash.substring(1), |
|
| |
3031
| + items = this._core.$stage.children(), |
|
| |
3032
| + position = this._hashes[hash] && items.index(this._hashes[hash]) || 0; |
|
| |
3033
| + |
|
| |
3034
| + if (!hash) { |
|
| |
3035
| + return false; |
|
| |
3036
| + } |
|
| |
3037
| + |
|
| |
3038
| + this._core.to(position, false, true); |
|
| |
3039
| + }, this)); |
|
| |
3040
| + } |
|
| |
3041
| + |
|
| |
3042
| + /** |
|
| |
3043
| + * Default options. |
|
| |
3044
| + * @public |
|
| |
3045
| + */ |
|
| |
3046
| + Hash.Defaults = { |
|
| |
3047
| + URLhashListener: false |
|
| |
3048
| + } |
|
| |
3049
| + |
|
| |
3050
| + /** |
|
| |
3051
| + * Destroys the plugin. |
|
| |
3052
| + * @public |
|
| |
3053
| + */ |
|
| |
3054
| + Hash.prototype.destroy = function() { |
|
| |
3055
| + var handler, property; |
|
| |
3056
| + |
|
| |
3057
| + $(window).off('hashchange.owl.navigation'); |
|
| |
3058
| + |
|
| |
3059
| + for (handler in this._handlers) { |
|
| |
3060
| + this._core.$element.off(handler, this._handlers[handler]); |
|
| |
3061
| + } |
|
| |
3062
| + for (property in Object.getOwnPropertyNames(this)) { |
|
| |
3063
| + typeof this[property] != 'function' && (this[property] = null); |
|
| |
3064
| + } |
|
| |
3065
| + } |
|
| |
3066
| + |
|
| |
3067
| + $.fn.owlCarousel.Constructor.Plugins.Hash = Hash; |
|
| |
3068
| + |
|
| |
3069
| +})(window.Zepto || window.jQuery, window, document); |
