122 lines
2.9 KiB
JavaScript
122 lines
2.9 KiB
JavaScript
|
/**
|
||
|
* Animate Plugin
|
||
|
* @version 2.3.4
|
||
|
* @author Bartosz Wojciechowski
|
||
|
* @author David Deutsch
|
||
|
* @license The MIT License (MIT)
|
||
|
*/
|
||
|
;(function($, window, document, undefined) {
|
||
|
|
||
|
/**
|
||
|
* Creates the animate plugin.
|
||
|
* @class The Navigation Plugin
|
||
|
* @param {Owl} scope - The Owl Carousel
|
||
|
*/
|
||
|
var Animate = function(scope) {
|
||
|
this.core = scope;
|
||
|
this.core.options = $.extend({}, Animate.Defaults, this.core.options);
|
||
|
this.swapping = true;
|
||
|
this.previous = undefined;
|
||
|
this.next = undefined;
|
||
|
|
||
|
this.handlers = {
|
||
|
'change.owl.carousel': $.proxy(function(e) {
|
||
|
if (e.namespace && e.property.name == 'position') {
|
||
|
this.previous = this.core.current();
|
||
|
this.next = e.property.value;
|
||
|
}
|
||
|
}, this),
|
||
|
'drag.owl.carousel dragged.owl.carousel translated.owl.carousel': $.proxy(function(e) {
|
||
|
if (e.namespace) {
|
||
|
this.swapping = e.type == 'translated';
|
||
|
}
|
||
|
}, this),
|
||
|
'translate.owl.carousel': $.proxy(function(e) {
|
||
|
if (e.namespace && this.swapping && (this.core.options.animateOut || this.core.options.animateIn)) {
|
||
|
this.swap();
|
||
|
}
|
||
|
}, this)
|
||
|
};
|
||
|
|
||
|
this.core.$element.on(this.handlers);
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* Default options.
|
||
|
* @public
|
||
|
*/
|
||
|
Animate.Defaults = {
|
||
|
animateOut: false,
|
||
|
animateIn: false
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* Toggles the animation classes whenever an translations starts.
|
||
|
* @protected
|
||
|
* @returns {Boolean|undefined}
|
||
|
*/
|
||
|
Animate.prototype.swap = function() {
|
||
|
|
||
|
if (this.core.settings.items !== 1) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
if (!$.support.animation || !$.support.transition) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
this.core.speed(0);
|
||
|
|
||
|
var left,
|
||
|
clear = $.proxy(this.clear, this),
|
||
|
previous = this.core.$stage.children().eq(this.previous),
|
||
|
next = this.core.$stage.children().eq(this.next),
|
||
|
incoming = this.core.settings.animateIn,
|
||
|
outgoing = this.core.settings.animateOut;
|
||
|
|
||
|
if (this.core.current() === this.previous) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
if (outgoing) {
|
||
|
left = this.core.coordinates(this.previous) - this.core.coordinates(this.next);
|
||
|
previous.one($.support.animation.end, clear)
|
||
|
.css( { 'left': left + 'px' } )
|
||
|
.addClass('animated owl-animated-out')
|
||
|
.addClass(outgoing);
|
||
|
}
|
||
|
|
||
|
if (incoming) {
|
||
|
next.one($.support.animation.end, clear)
|
||
|
.addClass('animated owl-animated-in')
|
||
|
.addClass(incoming);
|
||
|
}
|
||
|
};
|
||
|
|
||
|
Animate.prototype.clear = function(e) {
|
||
|
$(e.target).css( { 'left': '' } )
|
||
|
.removeClass('animated owl-animated-out owl-animated-in')
|
||
|
.removeClass(this.core.settings.animateIn)
|
||
|
.removeClass(this.core.settings.animateOut);
|
||
|
this.core.onTransitionEnd();
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* Destroys the plugin.
|
||
|
* @public
|
||
|
*/
|
||
|
Animate.prototype.destroy = function() {
|
||
|
var handler, property;
|
||
|
|
||
|
for (handler in this.handlers) {
|
||
|
this.core.$element.off(handler, this.handlers[handler]);
|
||
|
}
|
||
|
for (property in Object.getOwnPropertyNames(this)) {
|
||
|
typeof this[property] != 'function' && (this[property] = null);
|
||
|
}
|
||
|
};
|
||
|
|
||
|
$.fn.owlCarousel.Constructor.Plugins.Animate = Animate;
|
||
|
|
||
|
})(window.Zepto || window.jQuery, window, document);
|