window.log = function(){
log.history = log.history || [];
log.history.push(arguments);
arguments.callee = arguments.callee.caller;
if(this.console) console.log( Array.prototype.slice.call(arguments) );
};
(function(b){function c(){}for(var d="assert,count,debug,dir,dirxml,error,exception,group,groupCollapsed,groupEnd,info,log,markTimeline,profile,profileEnd,time,timeEnd,trace,warn".split(","),a;a=d.pop();)b[a]=b[a]||c})(window.console=window.console||{});
/*!
* jQuery Cycle Plugin (with Transition Definitions)
* Examples and documentation at: http://jquery.malsup.com/cycle/
* Copyright (c) 2007-2010 M. Alsup
* Version: 2.88 (08-JUN-2010)
* Dual licensed under the MIT and GPL licenses.
* http://jquery.malsup.com/license.html
* Requires: jQuery v1.2.6 or later
*/
;(function($) {
var ver = '2.88';
// if $.support is not defined (pre jQuery 1.3) add what I need
if ($.support == undefined) {
$.support = {
opacity: !($.browser.msie)
};
}
function debug(s) {
if ($.fn.cycle.debug)
log(s);
}
function log() {
if (window.console && window.console.log)
window.console.log('[cycle] ' + Array.prototype.join.call(arguments,' '));
};
// the options arg can be...
// a number - indicates an immediate transition should occur to the given slide index
// a string - 'pause', 'resume', 'toggle', 'next', 'prev', 'stop', 'destroy' or the name of a transition effect (ie, 'fade', 'zoom', etc)
// an object - properties to control the slideshow
//
// the arg2 arg can be...
// the name of an fx (only used in conjunction with a numeric value for 'options')
// the value true (only used in first arg == 'resume') and indicates
// that the resume should occur immediately (not wait for next timeout)
$.fn.cycle = function(options, arg2) {
var o = { s: this.selector, c: this.context };
// in 1.3+ we can fix mistakes with the ready state
if (this.length === 0 && options != 'stop') {
if (!$.isReady && o.s) {
log('DOM not ready, queuing slideshow');
$(function() {
$(o.s,o.c).cycle(options,arg2);
});
return this;
}
// is your DOM ready? http://docs.jquery.com/Tutorials:Introducing_$(document).ready()
log('terminating; zero elements found by selector' + ($.isReady ? '' : ' (DOM not ready)'));
return this;
}
// iterate the matched nodeset
return this.each(function() {
var opts = handleArguments(this, options, arg2);
if (opts === false)
return;
opts.updateActivePagerLink = opts.updateActivePagerLink || $.fn.cycle.updateActivePagerLink;
// stop existing slideshow for this container (if there is one)
if (this.cycleTimeout)
clearTimeout(this.cycleTimeout);
this.cycleTimeout = this.cyclePause = 0;
var $cont = $(this);
var $slides = opts.slideExpr ? $(opts.slideExpr, this) : $cont.children();
var els = $slides.get();
if (els.length < 2) {
log('terminating; too few slides: ' + els.length);
return;
}
var opts2 = buildOptions($cont, $slides, els, opts, o);
if (opts2 === false)
return;
var startTime = opts2.continuous ? 10 : getTimeout(els[opts2.currSlide], els[opts2.nextSlide], opts2, !opts2.rev);
// if it's an auto slideshow, kick it off
if (startTime) {
startTime += (opts2.delay || 0);
if (startTime < 10)
startTime = 10;
debug('first timeout: ' + startTime);
this.cycleTimeout = setTimeout(function(){go(els,opts2,0,(!opts2.rev && !opts.backwards))}, startTime);
}
});
};
// process the args that were passed to the plugin fn
function handleArguments(cont, options, arg2) {
if (cont.cycleStop == undefined)
cont.cycleStop = 0;
if (options === undefined || options === null)
options = {};
if (options.constructor == String) {
switch(options) {
case 'destroy':
case 'stop':
var opts = $(cont).data('cycle.opts');
if (!opts)
return false;
cont.cycleStop++; // callbacks look for change
if (cont.cycleTimeout)
clearTimeout(cont.cycleTimeout);
cont.cycleTimeout = 0;
$(cont).removeData('cycle.opts');
if (options == 'destroy')
destroy(opts);
return false;
case 'toggle':
cont.cyclePause = (cont.cyclePause === 1) ? 0 : 1;
checkInstantResume(cont.cyclePause, arg2, cont);
return false;
case 'pause':
cont.cyclePause = 1;
return false;
case 'resume':
cont.cyclePause = 0;
checkInstantResume(false, arg2, cont);
return false;
case 'prev':
case 'next':
var opts = $(cont).data('cycle.opts');
if (!opts) {
log('options not found, "prev/next" ignored');
return false;
}
$.fn.cycle[options](opts);
return false;
default:
options = { fx: options };
};
return options;
}
else if (options.constructor == Number) {
// go to the requested slide
var num = options;
options = $(cont).data('cycle.opts');
if (!options) {
log('options not found, can not advance slide');
return false;
}
if (num < 0 || num >= options.elements.length) {
log('invalid slide index: ' + num);
return false;
}
options.nextSlide = num;
if (cont.cycleTimeout) {
clearTimeout(cont.cycleTimeout);
cont.cycleTimeout = 0;
}
if (typeof arg2 == 'string')
options.oneTimeFx = arg2;
go(options.elements, options, 1, num >= options.currSlide);
return false;
}
return options;
function checkInstantResume(isPaused, arg2, cont) {
if (!isPaused && arg2 === true) { // resume now!
var options = $(cont).data('cycle.opts');
if (!options) {
log('options not found, can not resume');
return false;
}
if (cont.cycleTimeout) {
clearTimeout(cont.cycleTimeout);
cont.cycleTimeout = 0;
}
go(options.elements, options, 1, (!opts.rev && !opts.backwards));
}
}
};
function removeFilter(el, opts) {
if (!$.support.opacity && opts.cleartype && el.style.filter) {
try { el.style.removeAttribute('filter'); }
catch(smother) {} // handle old opera versions
}
};
// unbind event handlers
function destroy(opts) {
if (opts.next)
$(opts.next).unbind(opts.prevNextEvent);
if (opts.prev)
$(opts.prev).unbind(opts.prevNextEvent);
if (opts.pager || opts.pagerAnchorBuilder)
$.each(opts.pagerAnchors || [], function() {
this.unbind().remove();
});
opts.pagerAnchors = null;
if (opts.destroy) // callback
opts.destroy(opts);
};
// one-time initialization
function buildOptions($cont, $slides, els, options, o) {
// support metadata plugin (v1.0 and v2.0)
var opts = $.extend({}, $.fn.cycle.defaults, options || {}, $.metadata ? $cont.metadata() : $.meta ? $cont.data() : {});
if (opts.autostop)
opts.countdown = opts.autostopCount || els.length;
var cont = $cont[0];
$cont.data('cycle.opts', opts);
opts.$cont = $cont;
opts.stopCount = cont.cycleStop;
opts.elements = els;
opts.before = opts.before ? [opts.before] : [];
opts.after = opts.after ? [opts.after] : [];
opts.after.unshift(function(){ opts.busy=0; });
// push some after callbacks
if (!$.support.opacity && opts.cleartype)
opts.after.push(function() { removeFilter(this, opts); });
if (opts.continuous)
opts.after.push(function() { go(els,opts,0,(!opts.rev && !opts.backwards)); });
saveOriginalOpts(opts);
// clearType corrections
if (!$.support.opacity && opts.cleartype && !opts.cleartypeNoBg)
clearTypeFix($slides);
// container requires non-static position so that slides can be position within
if ($cont.css('position') == 'static')
$cont.css('position', 'relative');
if (opts.width)
$cont.width(opts.width);
if (opts.height && opts.height != 'auto')
$cont.height(opts.height);
if (opts.startingSlide)
opts.startingSlide = parseInt(opts.startingSlide);
else if (opts.backwards)
opts.startingSlide = els.length - 1;
// if random, mix up the slide array
if (opts.random) {
opts.randomMap = [];
for (var i = 0; i < els.length; i++)
opts.randomMap.push(i);
opts.randomMap.sort(function(a,b) {return Math.random() - 0.5;});
opts.randomIndex = 1;
opts.startingSlide = opts.randomMap[1];
}
else if (opts.startingSlide >= els.length)
opts.startingSlide = 0; // catch bogus input
opts.currSlide = opts.startingSlide || 0;
var first = opts.startingSlide;
// set position and zIndex on all the slides
$slides.css({position: 'absolute', top:0, left:0}).hide().each(function(i) {
var z;
if (opts.backwards)
z = first ? i <= first ? els.length + (i-first) : first-i : els.length-i;
else
z = first ? i >= first ? els.length - (i-first) : first-i : els.length-i;
$(this).css('z-index', z)
});
// make sure first slide is visible
$(els[first]).css('opacity',1).show(); // opacity bit needed to handle restart use case
removeFilter(els[first], opts);
// stretch slides
if (opts.fit && opts.width)
$slides.width(opts.width);
if (opts.fit && opts.height && opts.height != 'auto')
$slides.height(opts.height);
// stretch container
var reshape = opts.containerResize && !$cont.innerHeight();
if (reshape) { // do this only if container has no size http://tinyurl.com/da2oa9
var maxw = 0, maxh = 0;
for(var j=0; j < els.length; j++) {
var $e = $(els[j]), e = $e[0], w = $e.outerWidth(), h = $e.outerHeight();
if (!w) w = e.offsetWidth || e.width || $e.attr('width')
if (!h) h = e.offsetHeight || e.height || $e.attr('height');
maxw = w > maxw ? w : maxw;
maxh = h > maxh ? h : maxh;
}
if (maxw > 0 && maxh > 0)
$cont.css({width:maxw+'px',height:maxh+'px'});
}
if (opts.pause)
$cont.hover(function(){this.cyclePause++;},function(){this.cyclePause--;});
if (supportMultiTransitions(opts) === false)
return false;
// apparently a lot of people use image slideshows without height/width attributes on the images.
// Cycle 2.50+ requires the sizing info for every slide; this block tries to deal with that.
var requeue = false;
options.requeueAttempts = options.requeueAttempts || 0;
$slides.each(function() {
// try to get height/width of each slide
var $el = $(this);
this.cycleH = (opts.fit && opts.height) ? opts.height : ($el.height() || this.offsetHeight || this.height || $el.attr('height') || 0);
this.cycleW = (opts.fit && opts.width) ? opts.width : ($el.width() || this.offsetWidth || this.width || $el.attr('width') || 0);
if ( $el.is('img') ) {
// sigh.. sniffing, hacking, shrugging... this crappy hack tries to account for what browsers do when
// an image is being downloaded and the markup did not include sizing info (height/width attributes);
// there seems to be some "default" sizes used in this situation
var loadingIE = ($.browser.msie && this.cycleW == 28 && this.cycleH == 30 && !this.complete);
var loadingFF = ($.browser.mozilla && this.cycleW == 34 && this.cycleH == 19 && !this.complete);
var loadingOp = ($.browser.opera && ((this.cycleW == 42 && this.cycleH == 19) || (this.cycleW == 37 && this.cycleH == 17)) && !this.complete);
var loadingOther = (this.cycleH == 0 && this.cycleW == 0 && !this.complete);
// don't requeue for images that are still loading but have a valid size
if (loadingIE || loadingFF || loadingOp || loadingOther) {
if (o.s && opts.requeueOnImageNotLoaded && ++options.requeueAttempts < 100) { // track retry count so we don't loop forever
log(options.requeueAttempts,' - img slide not loaded, requeuing slideshow: ', this.src, this.cycleW, this.cycleH);
setTimeout(function() {$(o.s,o.c).cycle(options)}, opts.requeueTimeout);
requeue = true;
return false; // break each loop
}
else {
log('could not determine size of image: '+this.src, this.cycleW, this.cycleH);
}
}
}
return true;
});
if (requeue)
return false;
opts.cssBefore = opts.cssBefore || {};
opts.animIn = opts.animIn || {};
opts.animOut = opts.animOut || {};
$slides.not(':eq('+first+')').css(opts.cssBefore);
if (opts.cssFirst)
$($slides[first]).css(opts.cssFirst);
if (opts.timeout) {
opts.timeout = parseInt(opts.timeout);
// ensure that timeout and speed settings are sane
if (opts.speed.constructor == String)
opts.speed = $.fx.speeds[opts.speed] || parseInt(opts.speed);
if (!opts.sync)
opts.speed = opts.speed / 2;
var buffer = opts.fx == 'shuffle' ? 500 : 250;
while((opts.timeout - opts.speed) < buffer) // sanitize timeout
opts.timeout += opts.speed;
}
if (opts.easing)
opts.easeIn = opts.easeOut = opts.easing;
if (!opts.speedIn)
opts.speedIn = opts.speed;
if (!opts.speedOut)
opts.speedOut = opts.speed;
opts.slideCount = els.length;
opts.currSlide = opts.lastSlide = first;
if (opts.random) {
if (++opts.randomIndex == els.length)
opts.randomIndex = 0;
opts.nextSlide = opts.randomMap[opts.randomIndex];
}
else if (opts.backwards)
opts.nextSlide = opts.startingSlide == 0 ? (els.length-1) : opts.startingSlide-1;
else
opts.nextSlide = opts.startingSlide >= (els.length-1) ? 0 : opts.startingSlide+1;
// run transition init fn
if (!opts.multiFx) {
var init = $.fn.cycle.transitions[opts.fx];
if ($.isFunction(init))
init($cont, $slides, opts);
else if (opts.fx != 'custom' && !opts.multiFx) {
log('unknown transition: ' + opts.fx,'; slideshow terminating');
return false;
}
}
// fire artificial events
var e0 = $slides[first];
if (opts.before.length)
opts.before[0].apply(e0, [e0, e0, opts, true]);
if (opts.after.length > 1)
opts.after[1].apply(e0, [e0, e0, opts, true]);
if (opts.next)
$(opts.next).bind(opts.prevNextEvent,function(){return advance(opts,opts.rev?-1:1)});
if (opts.prev)
$(opts.prev).bind(opts.prevNextEvent,function(){return advance(opts,opts.rev?1:-1)});
if (opts.pager || opts.pagerAnchorBuilder)
buildPager(els,opts);
exposeAddSlide(opts, els);
return opts;
};
// save off original opts so we can restore after clearing state
function saveOriginalOpts(opts) {
opts.original = { before: [], after: [] };
opts.original.cssBefore = $.extend({}, opts.cssBefore);
opts.original.cssAfter = $.extend({}, opts.cssAfter);
opts.original.animIn = $.extend({}, opts.animIn);
opts.original.animOut = $.extend({}, opts.animOut);
$.each(opts.before, function() { opts.original.before.push(this); });
$.each(opts.after, function() { opts.original.after.push(this); });
};
function supportMultiTransitions(opts) {
var i, tx, txs = $.fn.cycle.transitions;
// look for multiple effects
if (opts.fx.indexOf(',') > 0) {
opts.multiFx = true;
opts.fxs = opts.fx.replace(/\s*/g,'').split(',');
// discard any bogus effect names
for (i=0; i < opts.fxs.length; i++) {
var fx = opts.fxs[i];
tx = txs[fx];
if (!tx || !txs.hasOwnProperty(fx) || !$.isFunction(tx)) {
log('discarding unknown transition: ',fx);
opts.fxs.splice(i,1);
i--;
}
}
// if we have an empty list then we threw everything away!
if (!opts.fxs.length) {
log('No valid transitions named; slideshow terminating.');
return false;
}
}
else if (opts.fx == 'all') { // auto-gen the list of transitions
opts.multiFx = true;
opts.fxs = [];
for (p in txs) {
tx = txs[p];
if (txs.hasOwnProperty(p) && $.isFunction(tx))
opts.fxs.push(p);
}
}
if (opts.multiFx && opts.randomizeEffects) {
// munge the fxs array to make effect selection random
var r1 = Math.floor(Math.random() * 20) + 30;
for (i = 0; i < r1; i++) {
var r2 = Math.floor(Math.random() * opts.fxs.length);
opts.fxs.push(opts.fxs.splice(r2,1)[0]);
}
debug('randomized fx sequence: ',opts.fxs);
}
return true;
};
// provide a mechanism for adding slides after the slideshow has started
function exposeAddSlide(opts, els) {
opts.addSlide = function(newSlide, prepend) {
var $s = $(newSlide), s = $s[0];
if (!opts.autostopCount)
opts.countdown++;
els[prepend?'unshift':'push'](s);
if (opts.els)
opts.els[prepend?'unshift':'push'](s); // shuffle needs this
opts.slideCount = els.length;
$s.css('position','absolute');
$s[prepend?'prependTo':'appendTo'](opts.$cont);
if (prepend) {
opts.currSlide++;
opts.nextSlide++;
}
if (!$.support.opacity && opts.cleartype && !opts.cleartypeNoBg)
clearTypeFix($s);
if (opts.fit && opts.width)
$s.width(opts.width);
if (opts.fit && opts.height && opts.height != 'auto')
$slides.height(opts.height);
s.cycleH = (opts.fit && opts.height) ? opts.height : $s.height();
s.cycleW = (opts.fit && opts.width) ? opts.width : $s.width();
$s.css(opts.cssBefore);
if (opts.pager || opts.pagerAnchorBuilder)
$.fn.cycle.createPagerAnchor(els.length-1, s, $(opts.pager), els, opts);
if ($.isFunction(opts.onAddSlide))
opts.onAddSlide($s);
else
$s.hide(); // default behavior
};
}
// reset internal state; we do this on every pass in order to support multiple effects
$.fn.cycle.resetState = function(opts, fx) {
fx = fx || opts.fx;
opts.before = []; opts.after = [];
opts.cssBefore = $.extend({}, opts.original.cssBefore);
opts.cssAfter = $.extend({}, opts.original.cssAfter);
opts.animIn = $.extend({}, opts.original.animIn);
opts.animOut = $.extend({}, opts.original.animOut);
opts.fxFn = null;
$.each(opts.original.before, function() { opts.before.push(this); });
$.each(opts.original.after, function() { opts.after.push(this); });
// re-init
var init = $.fn.cycle.transitions[fx];
if ($.isFunction(init))
init(opts.$cont, $(opts.elements), opts);
};
// this is the main engine fn, it handles the timeouts, callbacks and slide index mgmt
function go(els, opts, manual, fwd) {
// opts.busy is true if we're in the middle of an animation
if (manual && opts.busy && opts.manualTrump) {
// let manual transitions requests trump active ones
debug('manualTrump in go(), stopping active transition');
$(els).stop(true,true);
opts.busy = false;
}
// don't begin another timeout-based transition if there is one active
if (opts.busy) {
debug('transition active, ignoring new tx request');
return;
}
var p = opts.$cont[0], curr = els[opts.currSlide], next = els[opts.nextSlide];
// stop cycling if we have an outstanding stop request
if (p.cycleStop != opts.stopCount || p.cycleTimeout === 0 && !manual)
return;
// check to see if we should stop cycling based on autostop options
if (!manual && !p.cyclePause && !opts.bounce &&
((opts.autostop && (--opts.countdown <= 0)) ||
(opts.nowrap && !opts.random && opts.nextSlide < opts.currSlide))) {
if (opts.end)
opts.end(opts);
return;
}
// if slideshow is paused, only transition on a manual trigger
var changed = false;
if ((manual || !p.cyclePause) && (opts.nextSlide != opts.currSlide)) {
changed = true;
var fx = opts.fx;
// keep trying to get the slide size if we don't have it yet
curr.cycleH = curr.cycleH || $(curr).height();
curr.cycleW = curr.cycleW || $(curr).width();
next.cycleH = next.cycleH || $(next).height();
next.cycleW = next.cycleW || $(next).width();
// support multiple transition types
if (opts.multiFx) {
if (opts.lastFx == undefined || ++opts.lastFx >= opts.fxs.length)
opts.lastFx = 0;
fx = opts.fxs[opts.lastFx];
opts.currFx = fx;
}
// one-time fx overrides apply to: $('div').cycle(3,'zoom');
if (opts.oneTimeFx) {
fx = opts.oneTimeFx;
opts.oneTimeFx = null;
}
$.fn.cycle.resetState(opts, fx);
// run the before callbacks
if (opts.before.length)
$.each(opts.before, function(i,o) {
if (p.cycleStop != opts.stopCount) return;
o.apply(next, [curr, next, opts, fwd]);
});
// stage the after callacks
var after = function() {
$.each(opts.after, function(i,o) {
if (p.cycleStop != opts.stopCount) return;
o.apply(next, [curr, next, opts, fwd]);
});
};
debug('tx firing; currSlide: ' + opts.currSlide + '; nextSlide: ' + opts.nextSlide);
// get ready to perform the transition
opts.busy = 1;
if (opts.fxFn) // fx function provided?
opts.fxFn(curr, next, opts, after, fwd, manual && opts.fastOnEvent);
else if ($.isFunction($.fn.cycle[opts.fx])) // fx plugin ?
$.fn.cycle[opts.fx](curr, next, opts, after, fwd, manual && opts.fastOnEvent);
else
$.fn.cycle.custom(curr, next, opts, after, fwd, manual && opts.fastOnEvent);
}
if (changed || opts.nextSlide == opts.currSlide) {
// calculate the next slide
opts.lastSlide = opts.currSlide;
if (opts.random) {
opts.currSlide = opts.nextSlide;
if (++opts.randomIndex == els.length)
opts.randomIndex = 0;
opts.nextSlide = opts.randomMap[opts.randomIndex];
if (opts.nextSlide == opts.currSlide)
opts.nextSlide = (opts.currSlide == opts.slideCount - 1) ? 0 : opts.currSlide + 1;
}
else if (opts.backwards) {
var roll = (opts.nextSlide - 1) < 0;
if (roll && opts.bounce) {
opts.backwards = !opts.backwards;
opts.nextSlide = 1;
opts.currSlide = 0;
}
else {
opts.nextSlide = roll ? (els.length-1) : opts.nextSlide-1;
opts.currSlide = roll ? 0 : opts.nextSlide+1;
}
}
else { // sequence
var roll = (opts.nextSlide + 1) == els.length;
if (roll && opts.bounce) {
opts.backwards = !opts.backwards;
opts.nextSlide = els.length-2;
opts.currSlide = els.length-1;
}
else {
opts.nextSlide = roll ? 0 : opts.nextSlide+1;
opts.currSlide = roll ? els.length-1 : opts.nextSlide-1;
}
}
}
if (changed && opts.pager)
opts.updateActivePagerLink(opts.pager, opts.currSlide, opts.activePagerClass);
// stage the next transition
var ms = 0;
if (opts.timeout && !opts.continuous)
ms = getTimeout(els[opts.currSlide], els[opts.nextSlide], opts, fwd);
else if (opts.continuous && p.cyclePause) // continuous shows work off an after callback, not this timer logic
ms = 10;
if (ms > 0)
p.cycleTimeout = setTimeout(function(){ go(els, opts, 0, (!opts.rev && !opts.backwards)) }, ms);
};
// invoked after transition
$.fn.cycle.updateActivePagerLink = function(pager, currSlide, clsName) {
$(pager).each(function() {
$(this).children().removeClass(clsName).eq(currSlide).addClass(clsName);
});
};
// calculate timeout value for current transition
function getTimeout(curr, next, opts, fwd) {
if (opts.timeoutFn) {
// call user provided calc fn
var t = opts.timeoutFn.call(curr,curr,next,opts,fwd);
while ((t - opts.speed) < 250) // sanitize timeout
t += opts.speed;
debug('calculated timeout: ' + t + '; speed: ' + opts.speed);
if (t !== false)
return t;
}
return opts.timeout;
};
// expose next/prev function, caller must pass in state
$.fn.cycle.next = function(opts) { advance(opts, opts.rev?-1:1); };
$.fn.cycle.prev = function(opts) { advance(opts, opts.rev?1:-1);};
// advance slide forward or back
function advance(opts, val) {
var els = opts.elements;
var p = opts.$cont[0], timeout = p.cycleTimeout;
if (timeout) {
clearTimeout(timeout);
p.cycleTimeout = 0;
}
if (opts.random && val < 0) {
// move back to the previously display slide
opts.randomIndex--;
if (--opts.randomIndex == -2)
opts.randomIndex = els.length-2;
else if (opts.randomIndex == -1)
opts.randomIndex = els.length-1;
opts.nextSlide = opts.randomMap[opts.randomIndex];
}
else if (opts.random) {
opts.nextSlide = opts.randomMap[opts.randomIndex];
}
else {
opts.nextSlide = opts.currSlide + val;
if (opts.nextSlide < 0) {
if (opts.nowrap) return false;
opts.nextSlide = els.length - 1;
}
else if (opts.nextSlide >= els.length) {
if (opts.nowrap) return false;
opts.nextSlide = 0;
}
}
var cb = opts.onPrevNextEvent || opts.prevNextClick; // prevNextClick is deprecated
if ($.isFunction(cb))
cb(val > 0, opts.nextSlide, els[opts.nextSlide]);
go(els, opts, 1, val>=0);
return false;
};
function buildPager(els, opts) {
var $p = $(opts.pager);
$.each(els, function(i,o) {
$.fn.cycle.createPagerAnchor(i,o,$p,els,opts);
});
opts.updateActivePagerLink(opts.pager, opts.startingSlide, opts.activePagerClass);
};
$.fn.cycle.createPagerAnchor = function(i, el, $p, els, opts) {
var a;
if ($.isFunction(opts.pagerAnchorBuilder)) {
a = opts.pagerAnchorBuilder(i,el);
debug('pagerAnchorBuilder('+i+', el) returned: ' + a);
}
else
a = ''+(i+1)+'';
if (!a)
return;
var $a = $(a);
// don't reparent if anchor is in the dom
if ($a.parents('body').length === 0) {
var arr = [];
if ($p.length > 1) {
$p.each(function() {
var $clone = $a.clone(true);
$(this).append($clone);
arr.push($clone[0]);
});
$a = $(arr);
}
else {
$a.appendTo($p);
}
}
opts.pagerAnchors = opts.pagerAnchors || [];
opts.pagerAnchors.push($a);
$a.bind(opts.pagerEvent, function(e) {
e.preventDefault();
opts.nextSlide = i;
var p = opts.$cont[0], timeout = p.cycleTimeout;
if (timeout) {
clearTimeout(timeout);
p.cycleTimeout = 0;
}
var cb = opts.onPagerEvent || opts.pagerClick; // pagerClick is deprecated
if ($.isFunction(cb))
cb(opts.nextSlide, els[opts.nextSlide]);
go(els,opts,1,opts.currSlide < i); // trigger the trans
// return false; // <== allow bubble
});
if ( ! /^click/.test(opts.pagerEvent) && !opts.allowPagerClickBubble)
$a.bind('click.cycle', function(){return false;}); // suppress click
if (opts.pauseOnPagerHover)
$a.hover(function() { opts.$cont[0].cyclePause++; }, function() { opts.$cont[0].cyclePause--; } );
};
// helper fn to calculate the number of slides between the current and the next
$.fn.cycle.hopsFromLast = function(opts, fwd) {
var hops, l = opts.lastSlide, c = opts.currSlide;
if (fwd)
hops = c > l ? c - l : opts.slideCount - l;
else
hops = c < l ? l - c : l + opts.slideCount - c;
return hops;
};
// fix clearType problems in ie6 by setting an explicit bg color
// (otherwise text slides look horrible during a fade transition)
function clearTypeFix($slides) {
debug('applying clearType background-color hack');
function hex(s) {
s = parseInt(s).toString(16);
return s.length < 2 ? '0'+s : s;
};
function getBg(e) {
for ( ; e && e.nodeName.toLowerCase() != 'html'; e = e.parentNode) {
var v = $.css(e,'background-color');
if (v.indexOf('rgb') >= 0 ) {
var rgb = v.match(/\d+/g);
return '#'+ hex(rgb[0]) + hex(rgb[1]) + hex(rgb[2]);
}
if (v && v != 'transparent')
return v;
}
return '#ffffff';
};
$slides.each(function() { $(this).css('background-color', getBg(this)); });
};
// reset common props before the next transition
$.fn.cycle.commonReset = function(curr,next,opts,w,h,rev) {
$(opts.elements).not(curr).hide();
opts.cssBefore.opacity = 1;
opts.cssBefore.display = 'block';
if (w !== false && next.cycleW > 0)
opts.cssBefore.width = next.cycleW;
if (h !== false && next.cycleH > 0)
opts.cssBefore.height = next.cycleH;
opts.cssAfter = opts.cssAfter || {};
opts.cssAfter.display = 'none';
$(curr).css('zIndex',opts.slideCount + (rev === true ? 1 : 0));
$(next).css('zIndex',opts.slideCount + (rev === true ? 0 : 1));
};
// the actual fn for effecting a transition
$.fn.cycle.custom = function(curr, next, opts, cb, fwd, speedOverride) {
var $l = $(curr), $n = $(next);
var speedIn = opts.speedIn, speedOut = opts.speedOut, easeIn = opts.easeIn, easeOut = opts.easeOut;
$n.css(opts.cssBefore);
if (speedOverride) {
if (typeof speedOverride == 'number')
speedIn = speedOut = speedOverride;
else
speedIn = speedOut = 1;
easeIn = easeOut = null;
}
var fn = function() {$n.animate(opts.animIn, speedIn, easeIn, cb)};
$l.animate(opts.animOut, speedOut, easeOut, function() {
if (opts.cssAfter) $l.css(opts.cssAfter);
if (!opts.sync) fn();
});
if (opts.sync) fn();
};
// transition definitions - only fade is defined here, transition pack defines the rest
$.fn.cycle.transitions = {
fade: function($cont, $slides, opts) {
$slides.not(':eq('+opts.currSlide+')').css('opacity',0);
opts.before.push(function(curr,next,opts) {
$.fn.cycle.commonReset(curr,next,opts);
opts.cssBefore.opacity = 0;
});
opts.animIn = { opacity: 1 };
opts.animOut = { opacity: 0 };
opts.cssBefore = { top: 0, left: 0 };
}
};
$.fn.cycle.ver = function() { return ver; };
// override these globally if you like (they are all optional)
$.fn.cycle.defaults = {
fx: 'fade', // name of transition effect (or comma separated names, ex: 'fade,scrollUp,shuffle')
timeout: 4000, // milliseconds between slide transitions (0 to disable auto advance)
timeoutFn: null, // callback for determining per-slide timeout value: function(currSlideElement, nextSlideElement, options, forwardFlag)
continuous: 0, // true to start next transition immediately after current one completes
speed: 1000, // speed of the transition (any valid fx speed value)
speedIn: null, // speed of the 'in' transition
speedOut: null, // speed of the 'out' transition
next: null, // selector for element to use as event trigger for next slide
prev: null, // selector for element to use as event trigger for previous slide
// prevNextClick: null, // @deprecated; please use onPrevNextEvent instead
onPrevNextEvent: null, // callback fn for prev/next events: function(isNext, zeroBasedSlideIndex, slideElement)
prevNextEvent:'click.cycle',// event which drives the manual transition to the previous or next slide
pager: null, // selector for element to use as pager container
//pagerClick null, // @deprecated; please use onPagerEvent instead
onPagerEvent: null, // callback fn for pager events: function(zeroBasedSlideIndex, slideElement)
pagerEvent: 'click.cycle', // name of event which drives the pager navigation
allowPagerClickBubble: false, // allows or prevents click event on pager anchors from bubbling
pagerAnchorBuilder: null, // callback fn for building anchor links: function(index, DOMelement)
before: null, // transition callback (scope set to element to be shown): function(currSlideElement, nextSlideElement, options, forwardFlag)
after: null, // transition callback (scope set to element that was shown): function(currSlideElement, nextSlideElement, options, forwardFlag)
end: null, // callback invoked when the slideshow terminates (use with autostop or nowrap options): function(options)
easing: null, // easing method for both in and out transitions
easeIn: null, // easing for "in" transition
easeOut: null, // easing for "out" transition
shuffle: null, // coords for shuffle animation, ex: { top:15, left: 200 }
animIn: null, // properties that define how the slide animates in
animOut: null, // properties that define how the slide animates out
cssBefore: null, // properties that define the initial state of the slide before transitioning in
cssAfter: null, // properties that defined the state of the slide after transitioning out
fxFn: null, // function used to control the transition: function(currSlideElement, nextSlideElement, options, afterCalback, forwardFlag)
height: 'auto', // container height
startingSlide: 0, // zero-based index of the first slide to be displayed
sync: 1, // true if in/out transitions should occur simultaneously
random: 0, // true for random, false for sequence (not applicable to shuffle fx)
fit: 0, // force slides to fit container
containerResize: 1, // resize container to fit largest slide
pause: 0, // true to enable "pause on hover"
pauseOnPagerHover: 0, // true to pause when hovering over pager link
autostop: 0, // true to end slideshow after X transitions (where X == slide count)
autostopCount: 0, // number of transitions (optionally used with autostop to define X)
delay: 0, // additional delay (in ms) for first transition (hint: can be negative)
slideExpr: null, // expression for selecting slides (if something other than all children is required)
cleartype: !$.support.opacity, // true if clearType corrections should be applied (for IE)
cleartypeNoBg: false, // set to true to disable extra cleartype fixing (leave false to force background color setting on slides)
nowrap: 0, // true to prevent slideshow from wrapping
fastOnEvent: 0, // force fast transitions when triggered manually (via pager or prev/next); value == time in ms
randomizeEffects: 1, // valid when multiple effects are used; true to make the effect sequence random
rev: 0, // causes animations to transition in reverse
manualTrump: true, // causes manual transition to stop an active transition instead of being ignored
requeueOnImageNotLoaded: true, // requeue the slideshow if any image slides are not yet loaded
requeueTimeout: 250, // ms delay for requeue
activePagerClass: 'activeSlide', // class name used for the active pager link
updateActivePagerLink: null, // callback fn invoked to update the active pager link (adds/removes activePagerClass style)
backwards: false // true to start slideshow at last slide and move backwards through the stack
};
})(jQuery);
/*!
* jQuery Cycle Plugin Transition Definitions
* This script is a plugin for the jQuery Cycle Plugin
* Examples and documentation at: http://malsup.com/jquery/cycle/
* Copyright (c) 2007-2010 M. Alsup
* Version: 2.72
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*/
(function($) {
//
// These functions define one-time slide initialization for the named
// transitions. To save file size feel free to remove any of these that you
// don't need.
//
$.fn.cycle.transitions.none = function($cont, $slides, opts) {
opts.fxFn = function(curr,next,opts,after){
$(next).show();
$(curr).hide();
after();
};
}
// scrollUp/Down/Left/Right
$.fn.cycle.transitions.scrollUp = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push($.fn.cycle.commonReset);
var h = $cont.height();
opts.cssBefore ={ top: h, left: 0 };
opts.cssFirst = { top: 0 };
opts.animIn = { top: 0 };
opts.animOut = { top: -h };
};
$.fn.cycle.transitions.scrollDown = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push($.fn.cycle.commonReset);
var h = $cont.height();
opts.cssFirst = { top: 0 };
opts.cssBefore= { top: -h, left: 0 };
opts.animIn = { top: 0 };
opts.animOut = { top: h };
};
$.fn.cycle.transitions.scrollLeft = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push($.fn.cycle.commonReset);
var w = $cont.width();
opts.cssFirst = { left: 0 };
opts.cssBefore= { left: w, top: 0 };
opts.animIn = { left: 0 };
opts.animOut = { left: 0-w };
};
$.fn.cycle.transitions.scrollRight = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push($.fn.cycle.commonReset);
var w = $cont.width();
opts.cssFirst = { left: 0 };
opts.cssBefore= { left: -w, top: 0 };
opts.animIn = { left: 0 };
opts.animOut = { left: w };
};
$.fn.cycle.transitions.scrollHorz = function($cont, $slides, opts) {
$cont.css('overflow','hidden').width();
opts.before.push(function(curr, next, opts, fwd) {
$.fn.cycle.commonReset(curr,next,opts);
opts.cssBefore.left = fwd ? (next.cycleW-1) : (1-next.cycleW);
opts.animOut.left = fwd ? -curr.cycleW : curr.cycleW;
});
opts.cssFirst = { left: 0 };
opts.cssBefore= { top: 0 };
opts.animIn = { left: 0 };
opts.animOut = { top: 0 };
};
$.fn.cycle.transitions.scrollVert = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push(function(curr, next, opts, fwd) {
$.fn.cycle.commonReset(curr,next,opts);
opts.cssBefore.top = fwd ? (1-next.cycleH) : (next.cycleH-1);
opts.animOut.top = fwd ? curr.cycleH : -curr.cycleH;
});
opts.cssFirst = { top: 0 };
opts.cssBefore= { left: 0 };
opts.animIn = { top: 0 };
opts.animOut = { left: 0 };
};
// slideX/slideY
$.fn.cycle.transitions.slideX = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(opts.elements).not(curr).hide();
$.fn.cycle.commonReset(curr,next,opts,false,true);
opts.animIn.width = next.cycleW;
});
opts.cssBefore = { left: 0, top: 0, width: 0 };
opts.animIn = { width: 'show' };
opts.animOut = { width: 0 };
};
$.fn.cycle.transitions.slideY = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(opts.elements).not(curr).hide();
$.fn.cycle.commonReset(curr,next,opts,true,false);
opts.animIn.height = next.cycleH;
});
opts.cssBefore = { left: 0, top: 0, height: 0 };
opts.animIn = { height: 'show' };
opts.animOut = { height: 0 };
};
// shuffle
$.fn.cycle.transitions.shuffle = function($cont, $slides, opts) {
var i, w = $cont.css('overflow', 'visible').width();
$slides.css({left: 0, top: 0});
opts.before.push(function(curr,next,opts) {
$.fn.cycle.commonReset(curr,next,opts,true,true,true);
});
// only adjust speed once!
if (!opts.speedAdjusted) {
opts.speed = opts.speed / 2; // shuffle has 2 transitions
opts.speedAdjusted = true;
}
opts.random = 0;
opts.shuffle = opts.shuffle || {left:-w, top:15};
opts.els = [];
for (i=0; i < $slides.length; i++)
opts.els.push($slides[i]);
for (i=0; i < opts.currSlide; i++)
opts.els.push(opts.els.shift());
// custom transition fn (hat tip to Benjamin Sterling for this bit of sweetness!)
//opts.fxFn = function(curr, next, opts, cb, fwd) {
// var $el = fwd ? $(curr) : $(next);
// $(next).css(opts.cssBefore);
// var count = opts.slideCount;
// $el.animate(opts.shuffle, opts.speedIn, opts.easeIn, function() {
// var hops = $.fn.cycle.hopsFromLast(opts, fwd);
// for (var k=0; k < hops; k++)
// fwd ? opts.els.push(opts.els.shift()) : opts.els.unshift(opts.els.pop());
// if (fwd) {
// for (var i=0, len=opts.els.length; i < len; i++)
// $(opts.els[i]).css('z-index', len-i+count);
// }
// else {
// var z = $(curr).css('z-index');
// $el.css('z-index', parseInt(z)+1+count);
// }
// $el.animate({left:0, top:0}, opts.speedOut, opts.easeOut, function() {
// $(fwd ? this : curr).hide();
// if (cb) cb();
// });
// });
//};
opts.cssBefore = { display: 'block', opacity: 1, top: 0, left: 0 };
};
// turnUp/Down/Left/Right
$.fn.cycle.transitions.turnUp = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,true,false);
opts.cssBefore.top = next.cycleH;
opts.animIn.height = next.cycleH;
});
opts.cssFirst = { top: 0 };
opts.cssBefore = { left: 0, height: 0 };
opts.animIn = { top: 0 };
opts.animOut = { height: 0 };
};
$.fn.cycle.transitions.turnDown = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,true,false);
opts.animIn.height = next.cycleH;
opts.animOut.top = curr.cycleH;
});
opts.cssFirst = { top: 0 };
opts.cssBefore = { left: 0, top: 0, height: 0 };
opts.animOut = { height: 0 };
};
$.fn.cycle.transitions.turnLeft = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,false,true);
opts.cssBefore.left = next.cycleW;
opts.animIn.width = next.cycleW;
});
opts.cssBefore = { top: 0, width: 0 };
opts.animIn = { left: 0 };
opts.animOut = { width: 0 };
};
$.fn.cycle.transitions.turnRight = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,false,true);
opts.animIn.width = next.cycleW;
opts.animOut.left = curr.cycleW;
});
opts.cssBefore = { top: 0, left: 0, width: 0 };
opts.animIn = { left: 0 };
opts.animOut = { width: 0 };
};
// zoom
$.fn.cycle.transitions.zoom = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,false,false,true);
opts.cssBefore.top = next.cycleH/2;
opts.cssBefore.left = next.cycleW/2;
opts.animIn = { top: 0, left: 0, width: next.cycleW, height: next.cycleH };
opts.animOut = { width: 0, height: 0, top: curr.cycleH/2, left: curr.cycleW/2 };
});
opts.cssFirst = { top:0, left: 0 };
opts.cssBefore = { width: 0, height: 0 };
};
// fadeZoom
$.fn.cycle.transitions.fadeZoom = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,false,false);
opts.cssBefore.left = next.cycleW/2;
opts.cssBefore.top = next.cycleH/2;
opts.animIn = { top: 0, left: 0, width: next.cycleW, height: next.cycleH };
});
opts.cssBefore = { width: 0, height: 0 };
opts.animOut = { opacity: 0 };
};
// blindX
$.fn.cycle.transitions.blindX = function($cont, $slides, opts) {
var w = $cont.css('overflow','hidden').width();
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts);
opts.animIn.width = next.cycleW;
opts.animOut.left = curr.cycleW;
});
opts.cssBefore = { left: w, top: 0 };
opts.animIn = { left: 0 };
opts.animOut = { left: w };
};
// blindY
$.fn.cycle.transitions.blindY = function($cont, $slides, opts) {
var h = $cont.css('overflow','hidden').height();
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts);
opts.animIn.height = next.cycleH;
opts.animOut.top = curr.cycleH;
});
opts.cssBefore = { top: h, left: 0 };
opts.animIn = { top: 0 };
opts.animOut = { top: h };
};
// blindZ
$.fn.cycle.transitions.blindZ = function($cont, $slides, opts) {
var h = $cont.css('overflow','hidden').height();
var w = $cont.width();
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts);
opts.animIn.height = next.cycleH;
opts.animOut.top = curr.cycleH;
});
opts.cssBefore = { top: h, left: w };
opts.animIn = { top: 0, left: 0 };
opts.animOut = { top: h, left: w };
};
// growX - grow horizontally from centered 0 width
$.fn.cycle.transitions.growX = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,false,true);
opts.cssBefore.left = this.cycleW/2;
opts.animIn = { left: 0, width: this.cycleW };
opts.animOut = { left: 0 };
});
opts.cssBefore = { width: 0, top: 0 };
};
// growY - grow vertically from centered 0 height
$.fn.cycle.transitions.growY = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,true,false);
opts.cssBefore.top = this.cycleH/2;
opts.animIn = { top: 0, height: this.cycleH };
opts.animOut = { top: 0 };
});
opts.cssBefore = { height: 0, left: 0 };
};
// curtainX - squeeze in both edges horizontally
$.fn.cycle.transitions.curtainX = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,false,true,true);
opts.cssBefore.left = next.cycleW/2;
opts.animIn = { left: 0, width: this.cycleW };
opts.animOut = { left: curr.cycleW/2, width: 0 };
});
opts.cssBefore = { top: 0, width: 0 };
};
// curtainY - squeeze in both edges vertically
$.fn.cycle.transitions.curtainY = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,true,false,true);
opts.cssBefore.top = next.cycleH/2;
opts.animIn = { top: 0, height: next.cycleH };
opts.animOut = { top: curr.cycleH/2, height: 0 };
});
opts.cssBefore = { left: 0, height: 0 };
};
// cover - curr slide covered by next slide
$.fn.cycle.transitions.cover = function($cont, $slides, opts) {
var d = opts.direction || 'left';
var w = $cont.css('overflow','hidden').width();
var h = $cont.height();
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts);
if (d == 'right')
opts.cssBefore.left = -w;
else if (d == 'up')
opts.cssBefore.top = h;
else if (d == 'down')
opts.cssBefore.top = -h;
else
opts.cssBefore.left = w;
});
opts.animIn = { left: 0, top: 0};
opts.animOut = { opacity: 1 };
opts.cssBefore = { top: 0, left: 0 };
};
// uncover - curr slide moves off next slide
$.fn.cycle.transitions.uncover = function($cont, $slides, opts) {
var d = opts.direction || 'left';
var w = $cont.css('overflow','hidden').width();
var h = $cont.height();
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,true,true,true);
if (d == 'right')
opts.animOut.left = w;
else if (d == 'up')
opts.animOut.top = -h;
else if (d == 'down')
opts.animOut.top = h;
else
opts.animOut.left = -w;
});
opts.animIn = { left: 0, top: 0 };
opts.animOut = { opacity: 1 };
opts.cssBefore = { top: 0, left: 0 };
};
// toss - move top slide and fade away
$.fn.cycle.transitions.toss = function($cont, $slides, opts) {
var w = $cont.css('overflow','visible').width();
var h = $cont.height();
opts.before.push(function(curr, next, opts) {
$.fn.cycle.commonReset(curr,next,opts,true,true,true);
// provide default toss settings if animOut not provided
if (!opts.animOut.left && !opts.animOut.top)
opts.animOut = { left: w*2, top: -h/2, opacity: 0 };
else
opts.animOut.opacity = 0;
});
opts.cssBefore = { left: 0, top: 0 };
opts.animIn = { left: 0 };
};
// wipe - clip animation
$.fn.cycle.transitions.wipe = function($cont, $slides, opts) {
var w = $cont.css('overflow','hidden').width();
var h = $cont.height();
opts.cssBefore = opts.cssBefore || {};
var clip;
if (opts.clip) {
if (/l2r/.test(opts.clip))
clip = 'rect(0px 0px '+h+'px 0px)';
else if (/r2l/.test(opts.clip))
clip = 'rect(0px '+w+'px '+h+'px '+w+'px)';
else if (/t2b/.test(opts.clip))
clip = 'rect(0px '+w+'px 0px 0px)';
else if (/b2t/.test(opts.clip))
clip = 'rect('+h+'px '+w+'px '+h+'px 0px)';
else if (/zoom/.test(opts.clip)) {
var top = parseInt(h/2);
var left = parseInt(w/2);
clip = 'rect('+top+'px '+left+'px '+top+'px '+left+'px)';
}
}
opts.cssBefore.clip = opts.cssBefore.clip || clip || 'rect(0px 0px 0px 0px)';
var d = opts.cssBefore.clip.match(/(\d+)/g);
var t = parseInt(d[0]), r = parseInt(d[1]), b = parseInt(d[2]), l = parseInt(d[3]);
opts.before.push(function(curr, next, opts) {
if (curr == next) return;
var $curr = $(curr), $next = $(next);
$.fn.cycle.commonReset(curr,next,opts,true,true,false);
opts.cssAfter.display = 'block';
var step = 1, count = parseInt((opts.speedIn / 13)) - 1;
(function f() {
var tt = t ? t - parseInt(step * (t/count)) : 0;
var ll = l ? l - parseInt(step * (l/count)) : 0;
var bb = b < h ? b + parseInt(step * ((h-b)/count || 1)) : h;
var rr = r < w ? r + parseInt(step * ((w-r)/count || 1)) : w;
$next.css({ clip: 'rect('+tt+'px '+rr+'px '+bb+'px '+ll+'px)' });
(step++ <= count) ? setTimeout(f, 13) : $curr.css('display', 'none');
})();
});
opts.cssBefore = { display: 'block', opacity: 1, top: 0, left: 0 };
opts.animIn = { left: 0 };
opts.animOut = { left: 0 };
};
})(jQuery);
/*
* jQuery Color Animations
* Copyright 2007 John Resig
* Released under the MIT and GPL licenses.
*/
(function(jQuery){
// We override the animation for all of these color styles
jQuery.each(['backgroundColor', 'borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor', 'color', 'outlineColor'], function(i,attr){
jQuery.fx.step[attr] = function(fx){
if ( fx.state == 0 ) {
fx.start = getColor( fx.elem, attr );
fx.end = getRGB( fx.end );
}
fx.elem.style[attr] = "rgb(" + [
Math.max(Math.min( parseInt((fx.pos * (fx.end[0] - fx.start[0])) + fx.start[0]), 255), 0),
Math.max(Math.min( parseInt((fx.pos * (fx.end[1] - fx.start[1])) + fx.start[1]), 255), 0),
Math.max(Math.min( parseInt((fx.pos * (fx.end[2] - fx.start[2])) + fx.start[2]), 255), 0)
].join(",") + ")";
}
});
// Color Conversion functions from highlightFade
// By Blair Mitchelmore
// http://jquery.offput.ca/highlightFade/
// Parse strings looking for color tuples [255,255,255]
function getRGB(color) {
var result;
// Check if we're already dealing with an array of colors
if ( color && color.constructor == Array && color.length == 3 )
return color;
// Look for rgb(num,num,num)
if (result = /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(color))
return [parseInt(result[1]), parseInt(result[2]), parseInt(result[3])];
// Look for rgb(num%,num%,num%)
if (result = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(color))
return [parseFloat(result[1])*2.55, parseFloat(result[2])*2.55, parseFloat(result[3])*2.55];
// Look for #a0b1c2
if (result = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(color))
return [parseInt(result[1],16), parseInt(result[2],16), parseInt(result[3],16)];
// Look for #fff
if (result = /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(color))
return [parseInt(result[1]+result[1],16), parseInt(result[2]+result[2],16), parseInt(result[3]+result[3],16)];
// Otherwise, we're most likely dealing with a named color
return colors[jQuery.trim(color).toLowerCase()];
}
function getColor(elem, attr) {
var color;
do {
color = jQuery.curCSS(elem, attr);
// Keep going until we find an element that has color, or we hit the body
if ( color != '' && color != 'transparent' || jQuery.nodeName(elem, "body") )
break;
attr = "backgroundColor";
} while ( elem = elem.parentNode );
return getRGB(color);
};
// Some named colors to work with
// From Interface by Stefan Petre
// http://interface.eyecon.ro/
var colors = {
aqua:[0,255,255],
azure:[240,255,255],
beige:[245,245,220],
black:[0,0,0],
blue:[0,0,255],
brown:[165,42,42],
cyan:[0,255,255],
darkblue:[0,0,139],
darkcyan:[0,139,139],
darkgrey:[169,169,169],
darkgreen:[0,100,0],
darkkhaki:[189,183,107],
darkmagenta:[139,0,139],
darkolivegreen:[85,107,47],
darkorange:[255,140,0],
darkorchid:[153,50,204],
darkred:[139,0,0],
darksalmon:[233,150,122],
darkviolet:[148,0,211],
fuchsia:[255,0,255],
gold:[255,215,0],
green:[0,128,0],
indigo:[75,0,130],
khaki:[240,230,140],
lightblue:[173,216,230],
lightcyan:[224,255,255],
lightgreen:[144,238,144],
lightgrey:[211,211,211],
lightpink:[255,182,193],
lightyellow:[255,255,224],
lime:[0,255,0],
magenta:[255,0,255],
maroon:[128,0,0],
navy:[0,0,128],
olive:[128,128,0],
orange:[255,165,0],
pink:[255,192,203],
purple:[128,0,128],
violet:[128,0,128],
red:[255,0,0],
silver:[192,192,192],
white:[255,255,255],
yellow:[255,255,0]
};
})(jQuery);
/*!
* hoverFadeColor v1.1
* http://www.roslindesign.com
*
* Copyright 2011, Alex Urquhart-Taylor
* Dual licensed under the MIT or GPL Version 2 licenses.
*
*/
(function(a){a.fn.hoverFadeColor=function(e){var c={color:null,fadeToSpeed:250,fadeFromSpeed:300};e&&a.extend(c,e);this.each(function(){var d=a(this).css("color"),b=c.color;a(this).hover(function(){hoverElem=this;b==null&&a.browser.msie&&a.browser.version.substr(0,1)<9?setTimeout(function(){b==null&&(b=a(hoverElem).css("color"));a(hoverElem).css("color",d);a(hoverElem).stop().animate({color:b},c.fadeToSpeed)},0):(b==null&&(b=a(hoverElem).css("color")),a(hoverElem).css("color",d),a(hoverElem).stop().animate({color:b},
c.fadeToSpeed))},function(){a(hoverElem).stop().animate({color:d},c.fadeFromSpeed)})});return this}})(jQuery);
/* Image Flow Start */
/*
Name: ImageFlow
Version: 1.3.0 (March 9 2010)
Author: Finn Rudolph
Support: http://finnrudolph.de/ImageFlow
License: ImageFlow is licensed under a Creative Commons
Attribution-Noncommercial 3.0 Unported License
(http://creativecommons.org/licenses/by-nc/3.0/).
You are free:
+ to Share - to copy, distribute and transmit the work
+ to Remix - to adapt the work
Under the following conditions:
+ Attribution. You must attribute the work in the manner specified by the author or licensor
(but not in any way that suggests that they endorse you or your use of the work).
+ Noncommercial. You may not use this work for commercial purposes.
+ For any reuse or distribution, you must make clear to others the license terms of this work.
+ Any of the above conditions can be waived if you get permission from the copyright holder.
+ Nothing in this license impairs or restricts the author's moral rights.
Credits: This script is based on Michael L. Perrys Cover flow in Javascript [1].
The reflections are generated server-sided by a slightly hacked version
of Richard Daveys easyreflections [2] written in PHP. The mouse wheel
support is an implementation of Adomas Paltanavicius JavaScript mouse
wheel code [3]. It also uses the domReadyEvent from Tanny O'Haley [4].
[1] http://www.adventuresinsoftware.com/blog/?p=104#comment-1981
[2] http://reflection.corephp.co.uk/v2.php
[3] http://adomas.org/javascript-mouse-wheel/
[4] http://tanny.ica.com/ICA/TKO/tkoblog.nsf/dx/domcontentloaded-for-browsers-part-v
*/
/* ImageFlow constructor */
function ImageFlow ()
{
/* Setting option defaults */
this.defaults =
{
animationSpeed: 50, /* Animation speed in ms */
aspectRatio: 1.964, /* Aspect ratio of the ImageFlow container (width divided by height) */
buttons: false, /* Toggle navigation buttons */
captions: true, /* Toggle captions */
circular: false, /* Toggle circular rotation */
imageCursor: 'default', /* Cursor type for all images - default is 'default' */
ImageFlowID: 'imageflow', /* Default id of the ImageFlow container */
imageFocusM: 1.0, /* Multiplicator for the focussed image size in percent */
imageFocusMax: 4, /* Max number of images on each side of the focussed one */
imagePath: '../', /* Path to the images relative to the reflect_.php script */
imageScaling: true, /* Toggle image scaling */
imagesHeight: 0.80, /* Height of the images div container in percent */
imagesM: 0.8, /* Multiplicator for all images in percent */
onClick: '', /* Onclick behaviour */
opacity: true, /* Toggle image opacity */
opacityArray: [10,9,8,7,6], /* Image opacity (range: 0 to 10) first value is for the focussed image */
percentLandscape: 118, /* Scale landscape format */
percentOther: 100, /* Scale portrait and square format */
preloadImages: true, /* Toggles loading bar (false: requires img attributes height and width) */
reflections: false, /* Toggle reflections */
reflectionGET: '', /* Pass variables via the GET method to the reflect_.php script */
reflectionP: 0.5, /* Height of the reflection in percent of the source image */
reflectionPNG: false, /* Toggle reflect2.php or reflect3.php */
reflectPath: 'library/imageflow/', /* Path to the reflect_.php script */
scrollbarP: 0.6, /* Width of the scrollbar in percent */
slider: true, /* Toggle slider */
sliderCursor: 'e-resize', /* Slider cursor type - default is 'default' */
sliderWidth: 14, /* Width of the slider in px */
slideshow: false, /* Toggle slideshow */
slideshowSpeed: 1500, /* Time between slides in ms */
slideshowAutoplay: false, /* Toggle automatic slideshow play on startup */
startID: 1, /* Image ID to begin with */
glideToStartID: true, /* Toggle glide animation to start ID */
startAnimation: false, /* Animate images moving in from the right on startup */
xStep: 120 /* Step width on the x-axis in px */
};
/* Closure for this */
var my = this;
/* Initiate ImageFlow */
this.init = function (options)
{
/* Evaluate options */
for(var name in my.defaults)
{
this[name] = (options !== undefined && options[name] !== undefined) ? options[name] : my.defaults[name];
}
/* Try to get ImageFlow div element */
var ImageFlowDiv = document.getElementById(my.ImageFlowID);
if(ImageFlowDiv)
{
/* Set it global within the ImageFlow scope */
ImageFlowDiv.style.visibility = 'visible';
this.ImageFlowDiv = ImageFlowDiv;
/* Try to create XHTML structure */
if(this.createStructure())
{
this.imagesDiv = document.getElementById(my.ImageFlowID+'_images');
this.captionDiv = document.getElementById(my.ImageFlowID+'_caption');
this.navigationDiv = document.getElementById(my.ImageFlowID+'_navigation');
this.scrollbarDiv = document.getElementById(my.ImageFlowID+'_scrollbar');
this.sliderDiv = document.getElementById(my.ImageFlowID+'_slider');
this.buttonNextDiv = document.getElementById(my.ImageFlowID+'_next');
this.buttonPreviousDiv = document.getElementById(my.ImageFlowID+'_previous');
this.buttonSlideshow = document.getElementById(my.ImageFlowID+'_slideshow');
this.indexArray = [];
this.current = 0;
this.imageID = 0;
this.target = 0;
this.memTarget = 0;
this.firstRefresh = true;
this.firstCheck = true;
this.busy = false;
/* Set height of the ImageFlow container and center the loading bar */
var width = this.ImageFlowDiv.offsetWidth;
var height = Math.round(width / my.aspectRatio);
document.getElementById(my.ImageFlowID+'_loading_txt').style.paddingTop = ((height * 0.5) -22) + 'px';
ImageFlowDiv.style.height = height + 'px';
/* Init loading progress */
this.loadingProgress();
}
}
};
/* Create HTML Structure */
this.createStructure = function()
{
/* Create images div container */
var imagesDiv = my.Helper.createDocumentElement('div','images');
/* Shift all images into the images div */
var node, version, src, imageNode;
var max = my.ImageFlowDiv.childNodes.length;
for(var index = 0; index < max; index++)
{
node = my.ImageFlowDiv.childNodes[index];
if (node && node.nodeType == 1 && node.nodeName == 'IMG')
{
/* Add 'reflect.php?img=' */
if(my.reflections === true)
{
version = (my.reflectionPNG) ? '3' : '2';
src = my.imagePath+node.getAttribute('src',2);
src = my.reflectPath+'reflect'+version+'.php?img='+src+my.reflectionGET;
node.setAttribute('src',src);
}
/* Clone image nodes and append them to the images div */
imageNode = node.cloneNode(true);
imagesDiv.appendChild(imageNode);
}
}
/* Clone some more images to make a circular animation possible */
if(my.circular)
{
/* Create temporary elements to hold the cloned images */
var first = my.Helper.createDocumentElement('div','images');
var last = my.Helper.createDocumentElement('div','images');
/* Make sure, that there are enough images to use circular mode */
max = imagesDiv.childNodes.length;
if(max < my.imageFocusMax)
{
my.imageFocusMax = max;
}
/* Do not clone anything if there is only one image */
if(max > 1)
{
/* Clone the first and last images */
var i;
for(i = 0; i < max; i++)
{
/* Number of clones on each side equals the imageFocusMax */
node = imagesDiv.childNodes[i];
if(i < my.imageFocusMax)
{
imageNode = node.cloneNode(true);
first.appendChild(imageNode);
}
if(max-i < my.imageFocusMax+1)
{
imageNode = node.cloneNode(true);
last.appendChild(imageNode);
}
}
/* Sort the image nodes in the following order: last | originals | first */
for(i = 0; i < max; i++)
{
node = imagesDiv.childNodes[i];
imageNode = node.cloneNode(true);
last.appendChild(imageNode);
}
for(i = 0; i < my.imageFocusMax; i++)
{
node = first.childNodes[i];
imageNode = node.cloneNode(true);
last.appendChild(imageNode);
}
/* Overwrite the imagesDiv with the new order */
imagesDiv = last;
}
}
/* Create slideshow button div and append it to the images div */
if(my.slideshow)
{
var slideshowButton = my.Helper.createDocumentElement('div','slideshow');
imagesDiv.appendChild(slideshowButton);
}
/* Create loading text container */
var loadingP = my.Helper.createDocumentElement('p','loading_txt');
var loadingText = document.createTextNode(' ');
loadingP.appendChild(loadingText);
/* Create loading div container */
var loadingDiv = my.Helper.createDocumentElement('div','loading');
/* Create loading bar div container inside the loading div */
var loadingBarDiv = my.Helper.createDocumentElement('div','loading_bar');
loadingDiv.appendChild(loadingBarDiv);
/* Create captions div container */
var captionDiv = my.Helper.createDocumentElement('div','caption');
/* Create slider and button div container inside the scrollbar div */
var scrollbarDiv = my.Helper.createDocumentElement('div','scrollbar');
var sliderDiv = my.Helper.createDocumentElement('div','slider');
scrollbarDiv.appendChild(sliderDiv);
if(my.buttons)
{
var buttonPreviousDiv = my.Helper.createDocumentElement('div','previous', 'button');
var buttonNextDiv = my.Helper.createDocumentElement('div','next', 'button');
scrollbarDiv.appendChild(buttonPreviousDiv);
scrollbarDiv.appendChild(buttonNextDiv);
}
/* Create navigation div container beneath images div */
var navigationDiv = my.Helper.createDocumentElement('div','navigation');
navigationDiv.appendChild(captionDiv);
navigationDiv.appendChild(scrollbarDiv);
/* Update document structure and return true on success */
var success = false;
if (my.ImageFlowDiv.appendChild(imagesDiv) &&
my.ImageFlowDiv.appendChild(loadingP) &&
my.ImageFlowDiv.appendChild(loadingDiv) &&
my.ImageFlowDiv.appendChild(navigationDiv))
{
/* Remove image nodes outside the images div */
max = my.ImageFlowDiv.childNodes.length;
for(index = 0; index < max; index++)
{
node = my.ImageFlowDiv.childNodes[index];
if (node && node.nodeType == 1 && node.nodeName == 'IMG')
{
my.ImageFlowDiv.removeChild(node);
}
}
success = true;
}
return success;
};
/* Manage loading progress and call the refresh function */
this.loadingProgress = function()
{
var p = my.loadingStatus();
if((p < 100 || my.firstCheck) && my.preloadImages)
{
/* Insert a short delay if the browser loads rapidly from its cache */
if(my.firstCheck && p == 100)
{
my.firstCheck = false;
window.setTimeout(my.loadingProgress, 100);
}
else
{
window.setTimeout(my.loadingProgress, 40);
}
}
else
{
/* Hide loading elements */
document.getElementById(my.ImageFlowID+'_loading_txt').style.display = 'none';
document.getElementById(my.ImageFlowID+'_loading').style.display = 'none';
/* Refresh ImageFlow on window resize - delay adding this event for the IE */
window.setTimeout(my.Helper.addResizeEvent, 1000);
/* Call refresh once on startup to display images */
my.refresh();
/* Only initialize navigation elements if there is more than one image */
if(my.max > 1)
{
/* Initialize mouse, touch and key support */
my.MouseWheel.init();
my.MouseDrag.init();
my.Touch.init();
my.Key.init();
/* Toggle slideshow */
if(my.slideshow)
{
my.Slideshow.init();
}
/* Toggle scrollbar visibility */
if(my.slider)
{
my.scrollbarDiv.style.visibility = 'visible';
}
}
}
};
/* Return loaded images in percent, set loading bar width and loading text */
this.loadingStatus = function()
{
var max = my.imagesDiv.childNodes.length;
var i = 0, completed = 0;
var image = null;
for(var index = 0; index < max; index++)
{
image = my.imagesDiv.childNodes[index];
if(image && image.nodeType == 1 && image.nodeName == 'IMG')
{
if(image.complete)
{
completed++;
}
i++;
}
}
var finished = Math.round((completed/i)*100);
var loadingBar = document.getElementById(my.ImageFlowID+'_loading_bar');
loadingBar.style.width = finished+'%';
/* Do not count the cloned images */
if(my.circular)
{
i = i - (my.imageFocusMax*2);
completed = (finished < 1) ? 0 : Math.round((i/100)*finished);
}
var loadingP = document.getElementById(my.ImageFlowID+'_loading_txt');
var loadingTxt = document.createTextNode('loading images '+completed+'/'+i);
loadingP.replaceChild(loadingTxt,loadingP.firstChild);
return finished;
};
/* Cache EVERYTHING that only changes on refresh or resize of the window */
this.refresh = function()
{
/* Cache global variables */
this.imagesDivWidth = my.imagesDiv.offsetWidth+my.imagesDiv.offsetLeft;
this.maxHeight = Math.round(my.imagesDivWidth / my.aspectRatio);
this.maxFocus = my.imageFocusMax * my.xStep;
this.size = my.imagesDivWidth * 0.5;
this.sliderWidth = my.sliderWidth * 0.5;
this.scrollbarWidth = (my.imagesDivWidth - ( Math.round(my.sliderWidth) * 2)) * my.scrollbarP;
this.imagesDivHeight = Math.round(my.maxHeight * my.imagesHeight);
/* Change imageflow div properties */
my.ImageFlowDiv.style.height = my.maxHeight + 'px';
/* Change images div properties */
my.imagesDiv.style.height = my.imagesDivHeight + 'px';
/* Change images div properties */
my.navigationDiv.style.height = (my.maxHeight - my.imagesDivHeight) + 'px';
/* Change captions div properties */
my.captionDiv.style.width = my.imagesDivWidth + 'px';
my.captionDiv.style.paddingTop = Math.round(my.imagesDivWidth * 0.02) + 'px';
/* Change scrollbar div properties */
my.scrollbarDiv.style.width = my.scrollbarWidth + 'px';
my.scrollbarDiv.style.marginTop = Math.round(my.imagesDivWidth * 0.02) + 'px';
my.scrollbarDiv.style.marginLeft = Math.round(my.sliderWidth + ((my.imagesDivWidth - my.scrollbarWidth)/2)) + 'px';
/* Set slider attributes */
my.sliderDiv.style.cursor = my.sliderCursor;
my.sliderDiv.onmousedown = function () { my.MouseDrag.start(this); return false;};
if(my.buttons)
{
my.buttonPreviousDiv.onclick = function () { my.MouseWheel.handle(1); };
my.buttonNextDiv.onclick = function () { my.MouseWheel.handle(-1); };
}
/* Set the reflection multiplicator */
var multi = (my.reflections === true) ? my.reflectionP + 1 : 1;
/* Set image attributes */
var max = my.imagesDiv.childNodes.length;
var i = 0;
var image = null;
for (var index = 0; index < max; index++)
{
image = my.imagesDiv.childNodes[index];
if(image !== null && image.nodeType == 1 && image.nodeName == 'IMG')
{
this.indexArray[i] = index;
/* Set image attributes to store values */
image.url = image.getAttribute('longdesc');
image.xPosition = (-i * my.xStep);
image.i = i;
/* Add width and height as attributes only once */
if(my.firstRefresh)
{
if(image.getAttribute('width') !== null && image.getAttribute('height') !== null)
{
image.w = image.getAttribute('width');
image.h = image.getAttribute('height') * multi;
}
else{
image.w = image.width;
image.h = image.height;
}
}
/* Check source image format. Get image height minus reflection height! */
if((image.w) > (image.h / (my.reflectionP + 1)))
{
/* Landscape format */
image.pc = my.percentLandscape;
image.pcMem = my.percentLandscape;
}
else
{
/* Portrait and square format */
image.pc = my.percentOther;
image.pcMem = my.percentOther;
}
/* Change image positioning */
if(my.imageScaling === false)
{
image.style.position = 'relative';
image.style.display = 'inline';
}
/* Set image cursor type */
image.style.cursor = my.imageCursor;
i++;
}
}
this.max = my.indexArray.length;
/* Override dynamic sizes based on the first image */
if(my.imageScaling === false)
{
image = my.imagesDiv.childNodes[my.indexArray[0]];
/* Set left padding for the first image */
this.totalImagesWidth = image.w * my.max;
image.style.paddingLeft = (my.imagesDivWidth/2) + (image.w/2) + 'px';
/* Override images and navigation div height */
my.imagesDiv.style.height = image.h + 'px';
my.navigationDiv.style.height = (my.maxHeight - image.h) + 'px';
}
/* Handle startID on the first refresh */
if(my.firstRefresh)
{
/* Reset variable */
my.firstRefresh = false;
/* Set imageID to the startID */
my.imageID = my.startID-1;
if (my.imageID < 0 )
{
my.imageID = 0;
}
/* Map image id range in cicular mode (ignore the cloned images) */
if(my.circular)
{
my.imageID = my.imageID + my.imageFocusMax;
}
/* Make sure, that the id is smaller than the image count */
maxId = (my.circular) ? (my.max-(my.imageFocusMax))-1 : my.max-1;
if (my.imageID > maxId)
{
my.imageID = maxId;
}
/* Toggle glide animation to start ID */
if(my.glideToStartID === false)
{
my.moveTo(-my.imageID * my.xStep);
}
/* Animate images moving in from the right */
if(my.startAnimation)
{
my.moveTo(5000);
}
}
/* Only animate if there is more than one image */
if(my.max > 1)
{
my.glideTo(my.imageID);
}
/* Display images in current order */
my.moveTo(my.current);
};
/* Main animation function */
this.moveTo = function(x)
{
this.current = x;
this.zIndex = my.max;
/* Main loop */
for (var index = 0; index < my.max; index++)
{
var image = my.imagesDiv.childNodes[my.indexArray[index]];
var currentImage = index * -my.xStep;
/* Enabled image scaling */
if(my.imageScaling)
{
/* Don't display images that are not conf_focussed */
if ((currentImage + my.maxFocus) < my.memTarget || (currentImage - my.maxFocus) > my.memTarget)
{
image.style.visibility = 'hidden';
image.style.display = 'none';
}
else
{
var z = (Math.sqrt(10000 + x * x) + 100) * my.imagesM;
var xs = x / z * my.size + my.size;
/* Still hide images until they are processed, but set display style to block */
image.style.display = 'block';
/* Process new image height and width */
var newImageH = (image.h / image.w * image.pc) / z * my.size;
var newImageW = 0;
switch (newImageH > my.maxHeight)
{
case false:
newImageW = image.pc / z * my.size;
break;
default:
newImageH = my.maxHeight;
newImageW = image.w * newImageH / image.h;
break;
}
var newImageTop = (my.imagesDivHeight - newImageH) + ((newImageH / (my.reflectionP + 1)) * my.reflectionP);
/* Set new image properties */
image.style.left = xs - (image.pc / 2) / z * my.size + 'px';
if(newImageW && newImageH)
{
image.style.height = newImageH + 'px';
image.style.width = newImageW + 'px';
image.style.top = newImageTop + 'px';
}
image.style.visibility = 'visible';
/* Set image layer through zIndex */
switch ( x < 0 )
{
case true:
this.zIndex++;
break;
default:
this.zIndex = my.zIndex - 1;
break;
}
/* Change zIndex and onclick function of the focussed image */
switch ( image.i == my.imageID )
{
case false:
image.onclick = function() { my.glideTo(this.i);};
break;
default:
this.zIndex = my.zIndex + 1;
if(image.url !== '')
{
image.onclick = my.onClick;
}
break;
}
image.style.zIndex = my.zIndex;
}
}
/* Disabled image scaling */
else
{
if ((currentImage + my.maxFocus) < my.memTarget || (currentImage - my.maxFocus) > my.memTarget)
{
image.style.visibility = 'hidden';
}
else
{
image.style.visibility = 'visible';
/* Change onclick function of the focussed image */
switch ( image.i == my.imageID )
{
case false:
image.onclick = function() { my.glideTo(this.i);};
break;
default:
if(image.url !== '')
{
image.onclick = my.onClick;
}
break;
}
}
my.imagesDiv.style.marginLeft = (x - my.totalImagesWidth) + 'px';
}
x += my.xStep;
}
};
/* Initializes image gliding animation */
this.glideTo = function(imageID)
{
/* Check for jumppoints */
var jumpTarget, clonedImageID;
if(my.circular)
{
/* Trigger left jumppoint */
if(imageID+1 === my.imageFocusMax)
{
/* Set jump target to the same cloned image on the right */
clonedImageID = my.max - my.imageFocusMax;
jumpTarget = -clonedImageID * my.xStep;
/* Set the imageID to the last image */
imageID = clonedImageID-1 ;
}
/* Trigger right jumppoint */
if(imageID === (my.max - my.imageFocusMax))
{
/* Set jump target to the same cloned image on the left */
clonedImageID = my.imageFocusMax-1;
jumpTarget = -clonedImageID * my.xStep;
/* Set the imageID to the first image */
imageID = clonedImageID+1;
}
}
/* Calculate new image position target */
var x = -imageID * my.xStep;
this.target = x;
this.memTarget = x;
this.imageID = imageID;
/* Display new caption */
var caption = my.imagesDiv.childNodes[imageID].getAttribute('alt');
/* July 15, 2011: Jon Howard - Removed Description Rotation */
//var description = my.imagesDiv.childNodes[imageID].getAttribute('longdesc');
if (caption === '' || my.captions === false)
{
caption = ' ';
}
my.captionDiv.innerHTML = caption;
/* July 15, 2011: Jon Howard - Removed Description Rotation */
//document.getElementById('description').innerHTML = description;
/* Set scrollbar slider to new position */
if (my.MouseDrag.busy === false)
{
if(my.circular)
{
this.newSliderX = ((imageID-my.imageFocusMax) * my.scrollbarWidth) / (my.max-(my.imageFocusMax*2)-1) - my.MouseDrag.newX;
}
else
{
this.newSliderX = (imageID * my.scrollbarWidth) / (my.max-1) - my.MouseDrag.newX;
}
my.sliderDiv.style.marginLeft = (my.newSliderX - my.sliderWidth) + 'px';
}
/* Only process if opacity or a multiplicator for the focussed image has been set */
if(my.opacity === true || my.imageFocusM !== my.defaults.imageFocusM)
{
/* Set opacity for centered image */
my.Helper.setOpacity(my.imagesDiv.childNodes[imageID], my.opacityArray[0]);
my.imagesDiv.childNodes[imageID].pc = my.imagesDiv.childNodes[imageID].pc * my.imageFocusM;
/* Set opacity for the other images that are displayed */
var opacityValue = 0;
var rightID = 0;
var leftID = 0;
var last = my.opacityArray.length;
for (var i = 1; i < (my.imageFocusMax+1); i++)
{
if((i+1) > last)
{
opacityValue = my.opacityArray[last-1];
}
else
{
opacityValue = my.opacityArray[i];
}
rightID = imageID + i;
leftID = imageID - i;
if (rightID < my.max)
{
my.Helper.setOpacity(my.imagesDiv.childNodes[rightID], opacityValue);
my.imagesDiv.childNodes[rightID].pc = my.imagesDiv.childNodes[rightID].pcMem;
}
if (leftID >= 0)
{
my.Helper.setOpacity(my.imagesDiv.childNodes[leftID], opacityValue);
my.imagesDiv.childNodes[leftID].pc = my.imagesDiv.childNodes[leftID].pcMem;
}
}
}
/* Move the images to the jump target */
if(jumpTarget)
{
my.moveTo(jumpTarget);
}
/* Animate gliding to new x position */
if (my.busy === false)
{
my.busy = true;
my.animate();
}
};
/* Animates image gliding */
this.animate = function()
{
switch (my.target < my.current-1 || my.target > my.current+1)
{
case true:
my.moveTo(my.current + (my.target-my.current)/3);
window.setTimeout(my.animate, my.animationSpeed);
my.busy = true;
break;
default:
my.busy = false;
break;
}
};
/* Used by user events to call the glideTo function */
this.glideOnEvent = function(imageID)
{
/* Interrupt slideshow on mouse wheel, keypress, touch and mouse drag */
if(my.slideshow)
{
my.Slideshow.interrupt();
}
/* Glide to new imageID */
my.glideTo(imageID);
};
/* Slideshow function */
this.Slideshow =
{
direction: 1,
init: function()
{
/* Call start() if autoplay is enabled, stop() if it is disabled */
(my.slideshowAutoplay) ? my.Slideshow.start() : my.Slideshow.stop();
},
interrupt: function()
{
/* Remove interrupt event */
my.Helper.removeEvent(my.ImageFlowDiv,'click',my.Slideshow.interrupt);
/* Interrupt the slideshow */
my.Slideshow.stop();
},
addInterruptEvent: function()
{
/* A click anywhere inside the ImageFlow div interrupts the slideshow */
my.Helper.addEvent(my.ImageFlowDiv,'click',my.Slideshow.interrupt);
},
start: function()
{
/* Set button style to pause */
my.Helper.setClassName(my.buttonSlideshow, 'slideshow pause');
/* Set onclick behaviour to stop */
my.buttonSlideshow.onclick = function () { my.Slideshow.stop(); };
/* Set slide interval */
my.Slideshow.action = window.setInterval(my.Slideshow.slide, my.slideshowSpeed);
/* Allow the user to always interrupt the slideshow */
window.setTimeout(my.Slideshow.addInterruptEvent, 100);
},
stop: function()
{
/* Set button style to play */
my.Helper.setClassName(my.buttonSlideshow, 'slideshow play');
/* Set onclick behaviour to start */
my.buttonSlideshow.onclick = function () { my.Slideshow.start(); };
/* Clear slide interval */
window.clearInterval(my.Slideshow.action);
},
slide: function()
{
var newImageID = my.imageID + my.Slideshow.direction;
var reverseDirection = false;
/* Reverse direction at the last image on the right */
if(newImageID === my.max)
{
my.Slideshow.direction = -1;
reverseDirection = true;
}
/* Reverse direction at the last image on the left */
if(newImageID < 0)
{
my.Slideshow.direction = 1;
reverseDirection = true;
}
/* If direction is reversed recall this method, else call the glideTo method */
(reverseDirection) ? my.Slideshow.slide() : my.glideTo(newImageID);
}
};
/* Mouse Wheel support */
this.MouseWheel =
{
init: function()
{
/* Init mouse wheel listener */
if(window.addEventListener)
{
my.ImageFlowDiv.addEventListener('DOMMouseScroll', my.MouseWheel.get, false);
}
my.Helper.addEvent(my.ImageFlowDiv,'mousewheel',my.MouseWheel.get);
},
get: function(event)
{
var delta = 0;
if (!event)
{
event = window.event;
}
if (event.wheelDelta)
{
delta = event.wheelDelta / 120;
}
else if (event.detail)
{
delta = -event.detail / 3;
}
if (delta)
{
my.MouseWheel.handle(delta);
}
my.Helper.suppressBrowserDefault(event);
},
handle: function(delta)
{
var change = false;
var newImageID = 0;
if(delta > 0)
{
if(my.imageID >= 1)
{
newImageID = my.imageID -1;
change = true;
}
}
else
{
if(my.imageID < (my.max-1))
{
newImageID = my.imageID +1;
change = true;
}
}
/* Glide to next (mouse wheel down) / previous (mouse wheel up) image */
if(change)
{
my.glideOnEvent(newImageID);
}
}
};
/* Mouse Dragging */
this.MouseDrag =
{
object: null,
objectX: 0,
mouseX: 0,
newX: 0,
busy: false,
/* Init mouse event listener */
init: function()
{
my.Helper.addEvent(my.ImageFlowDiv,'mousemove',my.MouseDrag.drag);
my.Helper.addEvent(my.ImageFlowDiv,'mouseup',my.MouseDrag.stop);
my.Helper.addEvent(document,'mouseup',my.MouseDrag.stop);
/* Avoid text and image selection while dragging */
my.ImageFlowDiv.onselectstart = function ()
{
var selection = true;
if (my.MouseDrag.busy)
{
selection = false;
}
return selection;
};
},
start: function(o)
{
my.MouseDrag.object = o;
my.MouseDrag.objectX = my.MouseDrag.mouseX - o.offsetLeft + my.newSliderX;
},
stop: function()
{
my.MouseDrag.object = null;
my.MouseDrag.busy = false;
},
drag: function(e)
{
var posx = 0;
if (!e)
{
e = window.event;
}
if (e.pageX)
{
posx = e.pageX;
}
else if (e.clientX)
{
posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
}
my.MouseDrag.mouseX = posx;
if(my.MouseDrag.object !== null)
{
var newX = (my.MouseDrag.mouseX - my.MouseDrag.objectX) + my.sliderWidth;
/* Make sure, that the slider is moved in proper relation to previous movements by the glideTo function */
if(newX < ( - my.newSliderX))
{
newX = - my.newSliderX;
}
if(newX > (my.scrollbarWidth - my.newSliderX))
{
newX = my.scrollbarWidth - my.newSliderX;
}
/* Set new slider position */
var step, imageID;
if(my.circular)
{
step = (newX + my.newSliderX) / (my.scrollbarWidth / (my.max-(my.imageFocusMax*2)-1));
imageID = Math.round(step)+my.imageFocusMax;
}
else
{
step = (newX + my.newSliderX) / (my.scrollbarWidth / (my.max-1));
imageID = Math.round(step);
}
my.MouseDrag.newX = newX;
my.MouseDrag.object.style.left = newX + 'px';
if(my.imageID !== imageID)
{
my.glideOnEvent(imageID);
}
my.MouseDrag.busy = true;
}
}
};
/* Safari touch events on the iPhone and iPod Touch */
this.Touch =
{
x: 0,
startX: 0,
stopX: 0,
busy: false,
first: true,
/* Init touch event listener */
init: function()
{
my.Helper.addEvent(my.navigationDiv,'touchstart',my.Touch.start);
my.Helper.addEvent(document,'touchmove',my.Touch.handle);
my.Helper.addEvent(document,'touchend',my.Touch.stop);
},
isOnNavigationDiv: function(e)
{
var state = false;
if(e.touches)
{
var target = e.touches[0].target;
if(target === my.navigationDiv || target === my.sliderDiv || target === my.scrollbarDiv)
{
state = true;
}
}
return state;
},
getX: function(e)
{
var x = 0;
if(e.touches)
{
x = e.touches[0].pageX;
}
return x;
},
start: function(e)
{
my.Touch.startX = my.Touch.getX(e);
my.Touch.busy = true;
my.Helper.suppressBrowserDefault(e);
},
isBusy: function()
{
var busy = false;
if(my.Touch.busy)
{
busy = true;
}
return busy;
},
/* Handle touch event position within the navigation div */
handle: function(e)
{
if(my.Touch.isBusy && my.Touch.isOnNavigationDiv(e))
{
var max = (my.circular) ? (my.max-(my.imageFocusMax*2)-1) : (my.max-1);
if(my.Touch.first)
{
my.Touch.stopX = (max - my.imageID) * (my.imagesDivWidth / max);
my.Touch.first = false;
}
var newX = -(my.Touch.getX(e) - my.Touch.startX - my.Touch.stopX);
/* Map x-axis touch coordinates in range of the ImageFlow width */
if(newX < 0)
{
newX = 0;
}
if(newX > my.imagesDivWidth)
{
newX = my.imagesDivWidth;
}
my.Touch.x = newX;
var imageID = Math.round(newX / (my.imagesDivWidth / max));
imageID = max - imageID;
if(my.imageID !== imageID)
{
if(my.circular)
{
imageID = imageID + my.imageFocusMax;
}
my.glideOnEvent(imageID);
}
my.Helper.suppressBrowserDefault(e);
}
},
stop: function()
{
my.Touch.stopX = my.Touch.x;
my.Touch.busy = false;
}
};
/* Key support */
this.Key =
{
/* Init key event listener */
init: function()
{
document.onkeydown = function(event){ my.Key.handle(event); };
},
/* Handle the arrow keys */
handle: function(event)
{
var charCode = my.Key.get(event);
switch (charCode)
{
/* Right arrow key */
case 39:
my.MouseWheel.handle(-1);
break;
/* Left arrow key */
case 37:
my.MouseWheel.handle(1);
break;
}
},
/* Get the current keycode */
get: function(event)
{
event = event || window.event;
return event.keyCode;
}
};
/* Helper functions */
this.Helper =
{
/* Add events */
addEvent: function(obj, type, fn)
{
if(obj.addEventListener)
{
obj.addEventListener(type, fn, false);
}
else if(obj.attachEvent)
{
obj["e"+type+fn] = fn;
obj[type+fn] = function() { obj["e"+type+fn]( window.event ); };
obj.attachEvent( "on"+type, obj[type+fn] );
}
},
/* Remove events */
removeEvent: function( obj, type, fn )
{
if (obj.removeEventListener)
{
obj.removeEventListener( type, fn, false );
}
else if (obj.detachEvent)
{
/* The IE breaks if you're trying to detach an unattached event http://msdn.microsoft.com/en-us/library/ms536411(VS.85).aspx */
if(obj[type+fn] === undefined)
{
alert('Helper.removeEvent » Pointer to detach event is undefined - perhaps you are trying to detach an unattached event?');
}
obj.detachEvent( 'on'+type, obj[type+fn] );
obj[type+fn] = null;
obj['e'+type+fn] = null;
}
},
/* Set image opacity */
setOpacity: function(object, value)
{
if(my.opacity === true)
{
object.style.opacity = value/10;
object.style.filter = 'alpha(opacity=' + value*10 + ')';
}
},
/* Create HTML elements */
createDocumentElement: function(type, id, optionalClass)
{
var element = document.createElement(type);
element.setAttribute('id', my.ImageFlowID+'_'+id);
if(optionalClass !== undefined)
{
id += ' '+optionalClass;
}
my.Helper.setClassName(element, id);
return element;
},
/* Set CSS class */
setClassName: function(element, className)
{
if(element)
{
element.setAttribute('class', className);
element.setAttribute('className', className);
}
},
/* Suppress default browser behaviour to avoid image/text selection while dragging */
suppressBrowserDefault: function(e)
{
if(e.preventDefault)
{
e.preventDefault();
}
else
{
e.returnValue = false;
}
return false;
},
/* Add functions to the window.onresize event - can not be done by addEvent */
addResizeEvent: function()
{
var otherFunctions = window.onresize;
if(typeof window.onresize != 'function')
{
window.onresize = function()
{
my.refresh();
};
}
else
{
window.onresize = function(){
if (otherFunctions)
{
otherFunctions();
}
my.refresh();
};
}
}
};
}
/* DOMContentLoaded event handler - by Tanny O'Haley [4] */
var domReadyEvent =
{
name: "domReadyEvent",
/* Array of DOMContentLoaded event handlers.*/
events: {},
domReadyID: 1,
bDone: false,
DOMContentLoadedCustom: null,
/* Function that adds DOMContentLoaded listeners to the array.*/
add: function(handler)
{
/* Assign each event handler a unique ID. If the handler has an ID, it has already been added to the events object or been run.*/
if (!handler.$$domReadyID)
{
handler.$$domReadyID = this.domReadyID++;
/* If the DOMContentLoaded event has happened, run the function. */
if(this.bDone)
{
handler();
}
/* store the event handler in the hash table */
this.events[handler.$$domReadyID] = handler;
}
},
remove: function(handler)
{
/* Delete the event handler from the hash table */
if (handler.$$domReadyID)
{
delete this.events[handler.$$domReadyID];
}
},
/* Function to process the DOMContentLoaded events array. */
run: function()
{
/* quit if this function has already been called */
if (this.bDone)
{
return;
}
/* Flag this function so we don't do the same thing twice */
this.bDone = true;
/* iterates through array of registered functions */
for (var i in this.events)
{
this.events[i]();
}
},
schedule: function()
{
/* Quit if the init function has already been called*/
if (this.bDone)
{
return;
}
/* First, check for Safari or KHTML.*/
if(/KHTML|WebKit/i.test(navigator.userAgent))
{
if(/loaded|complete/.test(document.readyState))
{
this.run();
}
else
{
/* Not ready yet, wait a little more.*/
setTimeout(this.name + ".schedule()", 100);
}
}
else if(document.getElementById("__ie_onload"))
{
/* Second, check for IE.*/
return true;
}
/* Check for custom developer provided function.*/
if(typeof this.DOMContentLoadedCustom === "function")
{
/* if DOM methods are supported, and the body element exists (using a double-check
including document.body, for the benefit of older moz builds [eg ns7.1] in which
getElementsByTagName('body')[0] is undefined, unless this script is in the body section) */
if(typeof document.getElementsByTagName !== 'undefined' && (document.getElementsByTagName('body')[0] !== null || document.body !== null))
{
/* Call custom function. */
if(this.DOMContentLoadedCustom())
{
this.run();
}
else
{
/* Not ready yet, wait a little more. */
setTimeout(this.name + ".schedule()", 250);
}
}
}
return true;
},
init: function()
{
/* If addEventListener supports the DOMContentLoaded event.*/
if(document.addEventListener)
{
document.addEventListener("DOMContentLoaded", function() { domReadyEvent.run(); }, false);
}
/* Schedule to run the init function.*/
setTimeout("domReadyEvent.schedule()", 100);
function run()
{
domReadyEvent.run();
}
/* Just in case window.onload happens first, add it to onload using an available method.*/
if(typeof addEvent !== "undefined")
{
addEvent(window, "load", run);
}
else if(document.addEventListener)
{
document.addEventListener("load", run, false);
}
else if(typeof window.onload === "function")
{
var oldonload = window.onload;
window.onload = function()
{
domReadyEvent.run();
oldonload();
};
}
else
{
window.onload = run;
}
/* for Internet Explorer */
/*@cc_on
@if (@_win32 || @_win64)
document.write("