if (this.running && this.timer) {
window.clearTimeout(this.timer);
}
// check if we are currenly running an animation.
if (this.animated && this.queue.length > 0) {
// wait for the last item in the queue to finish
this.queue[this.queue.length-1].done(function(){
that.selectFrame(frame, dfr); // and call again the selectFrame
})
return dfr.promise();
}
this.animated = true;
this.$elem.trigger("animationStart", [this, frame]);
this.queue.push(dfr);
// fade the frames
dFadeOut = this._fadeOutFrame(this.currentFrame);
// hide the fadetout frame
dFadeOut.done(function(){
that.$frames.eq(that.currentFrame).hide();
});
window.setTimeout(function(){ // then wait delayBetweenTransition and fadeIn the new frame
dFadeIn = that._fadeInFrame.call(that, frame).done(function(){
// when both the fadeIn and fadeOut are done we'll resolve the selectFrame promise
$.when(dFadeOut, dFadeIn).done(function(){
that.animated = false;
that.queue.shift();
that.$elem.trigger("animationEnd", [that]);
that.currentFrame = frame;
dfr.resolve();
});
});
}, c.delayBetweenTransition);
// navigation html change
if (this.config.navigation) {
this.$navigation.find(".selected").removeClass("selected").end()
.find("a").eq(frame).addClass("selected");
}
dfr.done(function(){ // we'll resume the loop animation after the transitions are done
if (that.running) {
that.start();
}
});
return dfr.promise();
},
_fadeFrame: function(frame, callback, direction) {
var dfr = $.Deferred(),
$frame = this.$frames.eq(frame),
$elements = this._$elementsByFrame[frame],
windowWidth = $(window).width(), // cache it before the animations, so we don't have to check it for each element
i, len,
that = this,
elementAnimations = [],
$disposeElements = this._$disposeElementsByFrame[frame],
$affectedElements,
frameLeft = $frame.offset().left;
direction = direction || "out";
if (!$.isFunction(callback)) return; // do nothing if there's no callback passed
$affectedElements = $elements.add($disposeElements);
// position absolute the animation and dispose elements
absolutize($affectedElements);
// toggle the dispose elements
if ($disposeElements.length > 0) {
window.setTimeout(function(){
$disposeElements[direction === "out" ? "fadeOut" : "fadeIn"](that.config.disposeSpeed);
}, this.config.disposeDelay);
}
// invoke the callback for each element
// the callback must return a promise
$elements.each(function(){
elementAnimations.push( callback.call(that, $(this), windowWidth, frameLeft) );
});
// wait for all the elements to finish their animation
$.when.apply(this, elementAnimations).done(function(){
