/** * Animate Plugin * @version 2.1.0 * @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);