/*
* jQuery Cycle Plugin for light-weight slideshows
* Examples and documentation at: http://malsup.com/jquery/cycle/
* Copyright (c) 2007-2008 M. Alsup
* Version: 2.18 (05/06/2008)
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
* Requires: jQuery v1.1.3.1 or later
*
* Based on the work of:
* 1) Matt Oakes (http://portfolio.gizone.co.uk/applications/slideshow/)
* 2) Torsten Baldes (http://medienfreunde.com/lab/innerfade/)
* 3) Benjamin Sterling (http://www.benjaminsterling.com/experiments/jqShuffle/)
*/
(function($) {
var ver = '2.18';
var ie6 = $.browser.msie && /MSIE 6.0/.test(navigator.userAgent);
function log() {
if (window.console && window.console.log)
window.console.log('[cycle] ' + Array.prototype.join.call(arguments,''));
};
$.fn.cycle = function(options) {
return this.each(function() {
options = options || {};
if (options.constructor == String) {
switch(options) {
case 'stop':
if (this.cycleTimeout) clearTimeout(this.cycleTimeout);
this.cycleTimeout = 0;
return;
case 'pause':
this.cyclePause = 1;
return;
case 'resume':
this.cyclePause = 0;
return;
default:
options = { fx: options };
};
}
// stop existing slideshow for this container (if there is one)
if (this.cycleTimeout) clearTimeout(this.cycleTimeout);
this.cycleTimeout = 0;
this.cyclePause = 0;
var $cont = $(this);
var $slides = options.slideExpr ? $(options.slideExpr, this) : $cont.children();
var els = $slides.get();
if (els.length < 2) {
log('terminating; too few slides: ' + els.length);
return; // don't bother
}
// 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;
opts.before = opts.before ? [opts.before] : [];
opts.after = opts.after ? [opts.after] : [];
opts.after.unshift(function(){ opts.busy=0; });
if (opts.continuous)
opts.after.push(function() { go(els,opts,0,!opts.rev); });
// clearType corrections
if (ie6 && opts.cleartype && !opts.cleartypeNoBg)
clearTypeFix($slides);
// allow shorthand overrides of width, height and timeout
var cls = this.className;
opts.width = parseInt((cls.match(/w:(\d+)/)||[])[1]) || opts.width;
opts.height = parseInt((cls.match(/h:(\d+)/)||[])[1]) || opts.height;
opts.timeout = parseInt((cls.match(/t:(\d+)/)||[])[1]) || opts.timeout;
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.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 = 0;
opts.startingSlide = opts.randomMap[0];
}
else if (opts.startingSlide >= els.length)
opts.startingSlide = 0; // catch bogus input
var first = opts.startingSlide || 0;
$slides.css({position: 'absolute', top:0, left:0}).hide().each(function(i) {
var z = first ? i >= first ? els.length - (i-first) : first-i : els.length-i;
$(this).css('z-index', z)
});
$(els[first]).css('opacity',1).show(); // opacity bit needed to handle reinit case
if ($.browser.msie) els[first].style.removeAttribute('filter');
if (opts.fit && opts.width)
$slides.width(opts.width);
if (opts.fit && opts.height && opts.height != 'auto')
$slides.height(opts.height);
if (opts.pause)
$cont.hover(function(){this.cyclePause=1;}, function(){this.cyclePause=0;});
// run transition init fn
var init = $.fn.cycle.transitions[opts.fx];
if ($.isFunction(init))
init($cont, $slides, opts);
else if (opts.fx != 'custom')
log('unknown transition: ' + opts.fx);
$slides.each(function() {
var $el = $(this);
this.cycleH = (opts.fit && opts.height) ? opts.height : $el.height();
this.cycleW = (opts.fit && opts.width) ? opts.width : $el.width();
});
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) {
// ensure that timeout and speed settings are sane
if (opts.speed.constructor == String)
opts.speed = {slow: 600, fast: 200}[opts.speed] || 400;
if (!opts.sync)
opts.speed = opts.speed / 2;
while((opts.timeout - opts.speed) < 250)
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 = first;
if (opts.random) {
opts.nextSlide = opts.currSlide;
if (++opts.randomIndex == els.length)
opts.randomIndex = 0;
opts.nextSlide = opts.randomMap[opts.randomIndex];
}
else
opts.nextSlide = opts.startingSlide >= (els.length-1) ? 0 : opts.startingSlide+1;
// 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.click && !opts.next)
opts.next = opts.click;
if (opts.next)
$(opts.next).bind('click', function(){return advance(els,opts,opts.rev?-1:1)});
if (opts.prev)
$(opts.prev).bind('click', function(){return advance(els,opts,opts.rev?1:-1)});
if (opts.pager)
buildPager(els,opts);
if (opts.timeout || opts.continuous)
this.cycleTimeout = setTimeout(
function(){go(els,opts,0,!opts.rev)},
opts.continuous ? 10 : opts.timeout + (opts.delay||0));
// expose fn for adding slides after the show has started
opts.addSlide = function(newSlide) {
var $s = $(newSlide), s = $s[0];
if (!opts.autostopCount)
opts.countdown++;
els.push(s);
if (opts.els)
opts.els.push(s); // shuffle needs this
opts.slideCount = els.length;
$s.css('position','absolute').css(opts.cssBefore).appendTo($cont);
if (ie6 && 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();
};
});
};
function go(els, opts, manual, fwd) {
if (opts.busy) return;
var p = els[0].parentNode, curr = els[opts.currSlide], next = els[opts.nextSlide];
if (p.cycleTimeout === 0 && !manual)
return;
if (!manual && !p.cyclePause &&
((opts.autostop && (--opts.countdown <= 0)) ||
(opts.nowrap && !opts.random && opts.nextSlide < opts.currSlide))) {
if (opts.end)
opts.end(opts);
return;
}
if (manual || !p.cyclePause) {
if (opts.before.length)
$.each(opts.before, function(i,o) { o.apply(next, [curr, next, opts, fwd]); });
var after = function() {
if ($.browser.msie && opts.cleartype)
this.style.removeAttribute('filter');
$.each(opts.after, function(i,o) { o.apply(next, [curr, next, opts, fwd]); });
};
if (opts.nextSlide != opts.currSlide) {
opts.busy = 1;
if (opts.fxFn)
opts.fxFn(curr, next, opts, after, fwd);
else if ($.isFunction($.fn.cycle[opts.fx]))
$.fn.cycle[opts.fx](curr, next, opts, after);
else
$.fn.cycle.custom(curr, next, opts, after);
}
if (opts.random) {
opts.currSlide = opts.nextSlide;
if (++opts.randomIndex == els.length)
opts.randomIndex = 0;
opts.nextSlide = opts.randomMap[opts.randomIndex];
}
else { // sequence
var roll = (opts.nextSlide + 1) == els.length;
opts.nextSlide = roll ? 0 : opts.nextSlide+1;
opts.currSlide = roll ? els.length-1 : opts.nextSlide-1;
}
if (opts.pager)
$(opts.pager).find('a').removeClass('activeSlide').filter('a:eq('+opts.currSlide+')').addClass('activeSlide');
}
if (opts.timeout && !opts.continuous)
p.cycleTimeout = setTimeout(function() { go(els,opts,0,!opts.rev) }, opts.timeout);
else if (opts.continuous && p.cyclePause)
p.cycleTimeout = setTimeout(function() { go(els,opts,0,!opts.rev) }, 10);
};
// advance slide forward or back
function advance(els, opts, val) {
var p = els[0].parentNode, timeout = p.cycleTimeout;
if (timeout) {
clearTimeout(timeout);
p.cycleTimeout = 0;
}
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;
}
if (opts.prevNextClick && typeof opts.prevNextClick == 'function')
opts.prevNextClick(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) {
var $a = (typeof opts.pagerAnchorBuilder == 'function')
? $(opts.pagerAnchorBuilder(i,o))
: $(''+(i+1)+'');
// don't reparent if anchor is in the dom
if ($a.parents('body').length == 0)
$a.appendTo($p);
$a.bind(opts.pagerEvent, function() {
opts.nextSlide = i;
var p = els[0].parentNode, timeout = p.cycleTimeout;
if (timeout) {
clearTimeout(timeout);
p.cycleTimeout = 0;
}
if (typeof opts.pagerClick == 'function')
opts.pagerClick(opts.nextSlide, els[opts.nextSlide]);
go(els,opts,1,!opts.rev);
return false;
});
});
$p.find('a').filter('a:eq('+opts.startingSlide+')').addClass('activeSlide');
};
// this fixes clearType problems in ie6 by setting an explicit bg color
function clearTypeFix($slides) {
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)); });
};
$.fn.cycle.custom = function(curr, next, opts, cb) {
var $l = $(curr), $n = $(next);
$n.css(opts.cssBefore);
var fn = function() {$n.animate(opts.animIn, opts.speedIn, opts.easeIn, cb)};
$l.animate(opts.animOut, opts.speedOut, opts.easeOut, function() {
if (opts.cssAfter) $l.css(opts.cssAfter);
if (!opts.sync) fn();
});
if (opts.sync) fn();
};
$.fn.cycle.transitions = {
fade: function($cont, $slides, opts) {
$slides.not(':eq('+opts.startingSlide+')').css('opacity',0);
opts.before.push(function() { $(this).show() });
//opts.animIn = { opacity: 1 };
//opts.animOut = { opacity: 0 };
opts.animIn = { opacity: .99};
opts.animOut = { opacity: 0};
opts.cssAfter = { display: 'none' };
}
};
$.fn.cycle.ver = function() { return ver; };
// override these globally if you like (they are all optional)
$.fn.cycle.defaults = {
fx: 'fade', // one of: fade, shuffle, zoom, scrollLeft, etc
timeout: 4000, // milliseconds between slide transitions (0 to disable auto advance)
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, // id of element to use as click trigger for next slide
prev: null, // id of element to use as click trigger for previous slide
prevNextClick: null, // callback fn for prev/next clicks: function(isNext, zeroBasedSlideIndex, slideElement)
pager: null, // id of element to use as pager container
pagerClick: null, // callback fn for pager clicks: function(zeroBasedSlideIndex, slideElement)
pagerEvent: 'click', // event which drives the pager navigation
pagerAnchorBuilder: null, // callback fn for building anchor links
before: null, // transition callback (scope set to element to be shown)
after: null, // transition callback (scope set to element that was shown)
end: null, // callback invoked when the slideshow terminates (use with autostop or nowrap 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
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
pause: 0, // true to enable "pause on hover"
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: 0, // true if clearType corrections should be applied (for IE)
nowrap: 0 // true to prevent slideshow from wrapping
};
})(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-2008 M. Alsup
* Version: 2.18
* 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.
//
// scrollUp/Down/Left/Right
$.fn.cycle.transitions.scrollUp = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.cssBefore.top = next.offsetHeight;
opts.animOut.top = 0-curr.offsetHeight;
});
opts.cssFirst = { top: 0 };
opts.animIn = { top: 0 };
opts.cssAfter = { display: 'none' };
};
$.fn.cycle.transitions.scrollDown = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.cssBefore.top = 0-next.offsetHeight;
opts.animOut.top = curr.offsetHeight;
});
opts.cssFirst = { top: 0 };
opts.animIn = { top: 0 };
opts.cssAfter = { display: 'none' };
};
$.fn.cycle.transitions.scrollLeft = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.cssBefore.left = next.offsetWidth;
opts.animOut.left = 0-curr.offsetWidth;
});
opts.cssFirst = { left: 0 };
opts.animIn = { left: 0 };
};
$.fn.cycle.transitions.scrollRight = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.cssBefore.left = 0-next.offsetWidth;
opts.animOut.left = curr.offsetWidth;
});
opts.cssFirst = { left: 0 };
opts.animIn = { left: 0 };
};
$.fn.cycle.transitions.scrollHorz = function($cont, $slides, opts) {
$cont.css('overflow','hidden').width();
// $slides.show();
opts.before.push(function(curr, next, opts, fwd) {
$(this).show();
var currW = curr.offsetWidth, nextW = next.offsetWidth;
opts.cssBefore = fwd ? { left: nextW } : { left: -nextW };
opts.animIn.left = 0;
opts.animOut.left = fwd ? -currW : currW;
$slides.not(curr).css(opts.cssBefore);
});
opts.cssFirst = { left: 0 };
opts.cssAfter = { display: 'none' }
};
$.fn.cycle.transitions.scrollVert = function($cont, $slides, opts) {
$cont.css('overflow','hidden');
// $slides.show();
opts.before.push(function(curr, next, opts, fwd) {
$(this).show();
var currH = curr.offsetHeight, nextH = next.offsetHeight;
opts.cssBefore = fwd ? { top: -nextH } : { top: nextH };
opts.animIn.top = 0;
opts.animOut.top = fwd ? currH : -currH;
$slides.not(curr).css(opts.cssBefore);
});
opts.cssFirst = { top: 0 };
opts.cssAfter = { display: 'none' }
};
// slideX/slideY
$.fn.cycle.transitions.slideX = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(curr).css('zIndex',1);
});
opts.cssBefore = { zIndex: 2 };
opts.animIn = { width: 'show' };
opts.animOut = { width: 'hide' };
};
$.fn.cycle.transitions.slideY = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(curr).css('zIndex',1);
});
opts.cssBefore = { zIndex: 2 };
opts.animIn = { height: 'show' };
opts.animOut = { height: 'hide' };
};
// shuffle
$.fn.cycle.transitions.shuffle = function($cont, $slides, opts) {
var w = $cont.css('overflow', 'visible').width();
$slides.css({left: 0, top: 0});
opts.before.push(function() { $(this).show() });
opts.speed = opts.speed / 2; // shuffle has 2 transitions
opts.random = 0;
opts.shuffle = opts.shuffle || {left:-w, top:15};
opts.els = [];
for (var i=0; i < $slides.length; i++)
opts.els.push($slides[i]);
for (var i=0; i < opts.startingSlide; 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);
$el.animate(opts.shuffle, opts.speedIn, opts.easeIn, function() {
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);
else {
var z = $(curr).css('z-index');
$el.css('z-index', parseInt(z)+1);
}
$el.animate({left:0, top:0}, opts.speedOut, opts.easeOut, function() {
$(fwd ? this : curr).hide();
if (cb) cb();
});
});
};
};
// turnUp/Down/Left/Right
$.fn.cycle.transitions.turnUp = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.cssBefore.top = next.cycleH;
opts.animIn.height = next.cycleH;
});
opts.cssFirst = { top: 0 };
opts.cssBefore = { height: 0 };
opts.animIn = { top: 0 };
opts.animOut = { height: 0 };
opts.cssAfter = { display: 'none' };
};
$.fn.cycle.transitions.turnDown = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.animIn.height = next.cycleH;
opts.animOut.top = curr.cycleH;
});
opts.cssFirst = { top: 0 };
opts.cssBefore = { top: 0, height: 0 };
opts.animOut = { height: 0 };
opts.cssAfter = { display: 'none' };
};
$.fn.cycle.transitions.turnLeft = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.cssBefore.left = next.cycleW;
opts.animIn.width = next.cycleW;
});
opts.cssBefore = { width: 0 };
opts.animIn = { left: 0 };
opts.animOut = { width: 0 };
opts.cssAfter = { display: 'none' };
};
$.fn.cycle.transitions.turnRight = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.animIn.width = next.cycleW;
opts.animOut.left = curr.cycleW;
});
opts.cssBefore = { left: 0, width: 0 };
opts.animIn = { left: 0 };
opts.animOut = { width: 0 };
opts.cssAfter = { display: 'none' };
};
// zoom
$.fn.cycle.transitions.zoom = function($cont, $slides, opts) {
opts.cssFirst = { top:0, left: 0 };
opts.cssAfter = { display: 'none' };
opts.before.push(function(curr, next, opts) {
$(this).show();
opts.cssBefore = { width: 0, height: 0, top: next.cycleH/2, 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 };
});
};
// fadeZoom
$.fn.cycle.transitions.fadeZoom = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
opts.cssBefore = { width: 0, height: 0, opacity: 1, left: next.cycleW/2, top: next.cycleH/2, zIndex: 1 };
opts.animIn = { top: 0, left: 0, width: next.cycleW, height: next.cycleH };
});
opts.animOut = { opacity: 0 };
opts.cssAfter = { zIndex: 0 };
};
// blindX
$.fn.cycle.transitions.blindX = function($cont, $slides, opts) {
var w = $cont.css('overflow','hidden').width();
$slides.show();
opts.before.push(function(curr, next, opts) {
$(curr).css('zIndex',1);
});
opts.cssBefore = { left: w, zIndex: 2 };
opts.cssAfter = { zIndex: 1 };
opts.animIn = { left: 0 };
opts.animOut = { left: w };
};
// blindY
$.fn.cycle.transitions.blindY = function($cont, $slides, opts) {
var h = $cont.css('overflow','hidden').height();
$slides.show();
opts.before.push(function(curr, next, opts) {
$(curr).css('zIndex',1);
});
opts.cssBefore = { top: h, zIndex: 2 };
opts.cssAfter = { zIndex: 1 };
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();
$slides.show();
opts.before.push(function(curr, next, opts) {
$(curr).css('zIndex',1);
});
opts.cssBefore = { top: h, left: w, zIndex: 2 };
opts.cssAfter = { zIndex: 1 };
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) {
opts.cssBefore = { left: this.cycleW/2, width: 0, zIndex: 2 };
opts.animIn = { left: 0, width: this.cycleW };
opts.animOut = { left: 0 };
$(curr).css('zIndex',1);
});
};
// growX - grow vertically from centered 0 height
$.fn.cycle.transitions.growY = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
opts.cssBefore = { top: this.cycleH/2, height: 0, zIndex: 2 };
opts.animIn = { top: 0, height: this.cycleH };
opts.animOut = { top: 0 };
$(curr).css('zIndex',1);
});
};
// curtainX - squeeze in both edges horizontally
$.fn.cycle.transitions.curtainX = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
opts.cssBefore = { left: next.cycleW/2, width: 0, zIndex: 1, display: 'block' };
opts.animIn = { left: 0, width: this.cycleW };
opts.animOut = { left: curr.cycleW/2, width: 0 };
$(curr).css('zIndex',2);
});
opts.cssAfter = { zIndex: 1, display: 'none' };
};
// curtainX - squeeze in both edges vertically
$.fn.cycle.transitions.curtainY = function($cont, $slides, opts) {
opts.before.push(function(curr, next, opts) {
opts.cssBefore = { top: next.cycleH/2, height: 0, zIndex: 1, display: 'block' };
opts.animIn = { top: 0, height: this.cycleH };
opts.animOut = { top: curr.cycleH/2, height: 0 };
$(curr).css('zIndex',2);
});
opts.cssAfter = { zIndex: 1, display: 'none' };
};
// 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) {
opts.cssBefore = { zIndex: 2, display: 'block' };
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;
$(curr).css('zIndex',1);
});
opts.animIn = { left: 0, top: 0 };
opts.animOut = { left: 0, top: 0 };
opts.cssAfter = { zIndex: 2, display: 'none' };
};
// 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) {
opts.cssBefore.display = 'block';
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;
$(curr).css('zIndex',2);
});
opts.animIn = { left: 0, top: 0 };
opts.cssBefore = { zIndex: 1, top: 0, left: 0 };
opts.cssAfter = { zIndex: 1, display: 'none' };
};
// 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) {
$(curr).css('zIndex',2);
opts.cssBefore.display = 'block';
// 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, zIndex: 1, opacity: 1 };
opts.animIn = { left: 0 };
opts.cssAfter = { zIndex: 2, display: 'none' };
};
})(jQuery);
/**
* jQuery lightBox plugin
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
* and adapted to me for use like a plugin from jQuery.
* @name jquery-lightbox-0.5.js
* @author Leandro Vieira Pinho - http://leandrovieira.com
* @version 0.5
* @date April 11, 2008
* @category jQuery plugin
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
* @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
*/
// Offering a Custom Alias suport - More info: http://docs.jquery.com/Plugins/Authoring#Custom_Alias
(function($) {
/**
* $ is an alias to jQuery object
*
*/
$.fn.lightBox = function(settings) {
// Settings to configure the jQuery lightBox plugin how you like
settings = jQuery.extend({
// Configuration related to overlay
overlayBgColor: '#000', // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color.
overlayOpacity: 0.8, // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9
// Configuration related to navigation
fixedNavigation: false, // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.
// Configuration related to images
imageLoading: 'images/lightbox/lightbox-ico-loading.gif', // (string) Path and the name of the loading icon
imageBtnPrev: 'images/lightbox/lightbox-btn-prev.gif', // (string) Path and the name of the prev button image
imageBtnNext: 'images/lightbox/lightbox-btn-next.gif', // (string) Path and the name of the next button image
imageBtnClose: 'images/lightbox/lightbox-btn-close.gif', // (string) Path and the name of the close btn
imageBlank: 'images/lightbox/lightbox-blank.gif', // (string) Path and the name of a blank image (one pixel)
// Configuration related to container image box
containerBorderSize: 10, // (integer) If you adjust the padding in the CSS for the container, #lightbox-container-image-box, you will need to update this value
containerResizeSpeed: 400, // (integer) Specify the resize duration of container image. These number are miliseconds. 400 is default.
// Configuration related to texts in caption. For example: Image 2 of 8. You can alter either "Image" and "of" texts.
txtImage: 'Image', // (string) Specify text "Image"
txtOf: 'of', // (string) Specify text "of"
// Configuration related to keyboard navigation
keyToClose: 'c', // (string) (c = close) Letter to close the jQuery lightBox interface. Beyond this letter, the letter X and the SCAPE key is used to.
keyToPrev: 'p', // (string) (p = previous) Letter to show the previous image
keyToNext: 'n', // (string) (n = next) Letter to show the next image.
// Don¥t alter these variables in any way
imageArray: [],
activeImage: 0
},settings);
// Caching the jQuery object with all elements matched
var jQueryMatchedObj = this; // This, in this context, refer to jQuery object
/**
* Initializing the plugin calling the start function
*
* @return boolean false
*/
function _initialize() {
_start(this,jQueryMatchedObj); // This, in this context, refer to object (link) which the user have clicked
return false; // Avoid the browser following the link
}
/**
* Start the jQuery lightBox plugin
*
* @param object objClicked The object (link) whick the user have clicked
* @param object jQueryMatchedObj The jQuery object with all elements matched
*/
function _start(objClicked,jQueryMatchedObj) {
// Hime some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
$('embed, object, select').css({ 'visibility' : 'hidden' });
// Call the function to create the markup structure; style some elements; assign events in some elements.
_set_interface();
// Unset total images in imageArray
settings.imageArray.length = 0;
// Unset image active information
settings.activeImage = 0;
// We have an image set? Or just an image? Let¥s see it.
if ( jQueryMatchedObj.length == 1 ) {
settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title')));
} else {
// Add an Array (as many as we have), with href and title atributes, inside the Array that storage the images references
for ( var i = 0; i < jQueryMatchedObj.length; i++ ) {
settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title')));
}
}
while ( settings.imageArray[settings.activeImage][0] != objClicked.getAttribute('href') ) {
settings.activeImage++;
}
// Call the function that prepares image exibition
_set_image_to_view();
}
/**
* Create the jQuery lightBox plugin interface
*
* The HTML markup will be like that:
*
*/
function _set_interface() {
// Apply the HTML markup into body tag
$('body').append('');
// Get page sizes
var arrPageSizes = ___getPageSize();
// Style overlay and show it
$('#jquery-overlay').css({
backgroundColor: settings.overlayBgColor,
opacity: settings.overlayOpacity,
width: arrPageSizes[0],
height: arrPageSizes[1]
}).fadeIn();
// Get page scroll
var arrPageScroll = ___getPageScroll();
// Calculate top and left offset for the jquery-lightbox div object and show it
$('#jquery-lightbox').css({
top: arrPageScroll[1] + (arrPageSizes[3] / 10),
left: arrPageScroll[0]
}).show();
// Assigning click events in elements to close overlay
$('#jquery-overlay,#jquery-lightbox').click(function() {
_finish();
});
// Assign the _finish function to lightbox-loading-link and lightbox-secNav-btnClose objects
$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function() {
_finish();
return false;
});
// If window was resized, calculate the new overlay dimensions
$(window).resize(function() {
// Get page sizes
var arrPageSizes = ___getPageSize();
// Style overlay and show it
$('#jquery-overlay').css({
width: arrPageSizes[0],
height: arrPageSizes[1]
});
// Get page scroll
var arrPageScroll = ___getPageScroll();
// Calculate top and left offset for the jquery-lightbox div object and show it
$('#jquery-lightbox').css({
top: arrPageScroll[1] + (arrPageSizes[3] / 10),
left: arrPageScroll[0]
});
});
}
/**
* Prepares image exibition; doing a image¥s preloader to calculate it¥s size
*
*/
function _set_image_to_view() { // show the loading
// Show the loading
$('#lightbox-loading').show();
if ( settings.fixedNavigation ) {
$('#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
} else {
// Hide some elements
$('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
}
// Image preload process
var objImagePreloader = new Image();
objImagePreloader.onload = function() {
$('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]);
// Perfomance an effect in the image container resizing it
_resize_container_image_box(objImagePreloader.width,objImagePreloader.height);
// clear onLoad, IE behaves irratically with animated gifs otherwise
objImagePreloader.onload=function(){};
};
objImagePreloader.src = settings.imageArray[settings.activeImage][0];
};
/**
* Perfomance an effect in the image container resizing it
*
* @param integer intImageWidth The image¥s width that will be showed
* @param integer intImageHeight The image¥s height that will be showed
*/
function _resize_container_image_box(intImageWidth,intImageHeight) {
// Get current width and height
var intCurrentWidth = $('#lightbox-container-image-box').width();
var intCurrentHeight = $('#lightbox-container-image-box').height();
// Get the width and height of the selected image plus the padding
var intWidth = (intImageWidth + (settings.containerBorderSize * 2)); // Plus the image¥s width and the left and right padding value
var intHeight = (intImageHeight + (settings.containerBorderSize * 2)); // Plus the image¥s height and the left and right padding value
// Diferences
var intDiffW = intCurrentWidth - intWidth;
var intDiffH = intCurrentHeight - intHeight;
// Perfomance the effect
$('#lightbox-container-image-box').animate({ width: intWidth, height: intHeight },settings.containerResizeSpeed,function() { _show_image(); });
if ( ( intDiffW == 0 ) && ( intDiffH == 0 ) ) {
if ( $.browser.msie ) {
___pause(250);
} else {
___pause(100);
}
}
$('#lightbox-container-image-data-box').css({ width: intImageWidth });
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ height: intImageHeight + (settings.containerBorderSize * 2) });
};
/**
* Show the prepared image
*
*/
function _show_image() {
$('#lightbox-loading').hide();
$('#lightbox-image').fadeIn(function() {
_show_image_data();
_set_navigation();
});
_preload_neighbor_images();
};
/**
* Show the image information
*
*/
function _show_image_data() {
$('#lightbox-container-image-data-box').slideDown('fast');
$('#lightbox-image-details-caption').hide();
if ( settings.imageArray[settings.activeImage][1] ) {
$('#lightbox-image-details-caption').html(settings.imageArray[settings.activeImage][1]).show();
}
// If we have a image set, display 'Image X of X'
if ( settings.imageArray.length > 1 ) {
$('#lightbox-image-details-currentNumber').html(settings.txtImage + ' ' + ( settings.activeImage + 1 ) + ' ' + settings.txtOf + ' ' + settings.imageArray.length).show();
}
}
/**
* Display the button navigations
*
*/
function _set_navigation() {
$('#lightbox-nav').show();
// Instead to define this configuration in CSS file, we define here. And it¥s need to IE. Just.
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
// Show the prev button, if not the first image in set
if ( settings.activeImage != 0 ) {
if ( settings.fixedNavigation ) {
$('#lightbox-nav-btnPrev').css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' })
.unbind()
.bind('click',function() {
settings.activeImage = settings.activeImage - 1;
_set_image_to_view();
return false;
});
} else {
// Show the images button for Next buttons
$('#lightbox-nav-btnPrev').unbind().hover(function() {
$(this).css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' });
},function() {
$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
}).show().bind('click',function() {
settings.activeImage = settings.activeImage - 1;
_set_image_to_view();
return false;
});
}
}
// Show the next button, if not the last image in set
if ( settings.activeImage != ( settings.imageArray.length -1 ) ) {
if ( settings.fixedNavigation ) {
$('#lightbox-nav-btnNext').css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' })
.unbind()
.bind('click',function() {
settings.activeImage = settings.activeImage + 1;
_set_image_to_view();
return false;
});
} else {
// Show the images button for Next buttons
$('#lightbox-nav-btnNext').unbind().hover(function() {
$(this).css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' });
},function() {
$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
}).show().bind('click',function() {
settings.activeImage = settings.activeImage + 1;
_set_image_to_view();
return false;
});
}
}
// Enable keyboard navigation
_enable_keyboard_navigation();
}
/**
* Enable a support to keyboard navigation
*
*/
function _enable_keyboard_navigation() {
$(document).keydown(function(objEvent) {
_keyboard_action(objEvent);
});
}
/**
* Disable the support to keyboard navigation
*
*/
function _disable_keyboard_navigation() {
$(document).unbind();
}
/**
* Perform the keyboard actions
*
*/
function _keyboard_action(objEvent) {
// To ie
if ( objEvent == null ) {
keycode = event.keyCode;
escapeKey = 27;
// To Mozilla
} else {
keycode = objEvent.keyCode;
escapeKey = objEvent.DOM_VK_ESCAPE;
}
// Get the key in lower case form
key = String.fromCharCode(keycode).toLowerCase();
// Verify the keys to close the ligthBox
if ( ( key == settings.keyToClose ) || ( key == 'x' ) || ( keycode == escapeKey ) ) {
_finish();
}
// Verify the key to show the previous image
if ( ( key == settings.keyToPrev ) || ( keycode == 37 ) ) {
// If we¥re not showing the first image, call the previous
if ( settings.activeImage != 0 ) {
settings.activeImage = settings.activeImage - 1;
_set_image_to_view();
_disable_keyboard_navigation();
}
}
// Verify the key to show the next image
if ( ( key == settings.keyToNext ) || ( keycode == 39 ) ) {
// If we¥re not showing the last image, call the next
if ( settings.activeImage != ( settings.imageArray.length - 1 ) ) {
settings.activeImage = settings.activeImage + 1;
_set_image_to_view();
_disable_keyboard_navigation();
}
}
}
/**
* Preload prev and next images being showed
*
*/
function _preload_neighbor_images() {
if ( (settings.imageArray.length -1) > settings.activeImage ) {
objNext = new Image();
objNext.src = settings.imageArray[settings.activeImage + 1][0];
}
if ( settings.activeImage > 0 ) {
objPrev = new Image();
objPrev.src = settings.imageArray[settings.activeImage -1][0];
}
}
/**
* Remove jQuery lightBox plugin HTML markup
*
*/
function _finish() {
$('#jquery-lightbox').remove();
$('#jquery-overlay').fadeOut(function() { $('#jquery-overlay').remove(); });
// Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
$('embed, object, select').css({ 'visibility' : 'visible' });
}
/**
/ THIRD FUNCTION
* getPageSize() by quirksmode.com
*
* @return Array Return an array with page width, height and window width, height
*/
function ___getPageSize() {
var xScroll, yScroll;
if (window.innerHeight && window.scrollMaxY) {
xScroll = window.innerWidth + window.scrollMaxX;
yScroll = window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}
var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
if(document.documentElement.clientWidth){
windowWidth = document.documentElement.clientWidth;
} else {
windowWidth = self.innerWidth;
}
windowHeight = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
windowWidth = document.documentElement.clientWidth;
windowHeight = document.documentElement.clientHeight;
} else if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
}
// for small pages with total height less then height of the viewport
if(yScroll < windowHeight){
pageHeight = windowHeight;
} else {
pageHeight = yScroll;
}
// for small pages with total width less then width of the viewport
if(xScroll < windowWidth){
pageWidth = xScroll;
} else {
pageWidth = windowWidth;
}
arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
return arrayPageSize;
};
/**
/ THIRD FUNCTION
* getPageScroll() by quirksmode.com
*
* @return Array Return an array with x,y page scroll values.
*/
function ___getPageScroll() {
var xScroll, yScroll;
if (self.pageYOffset) {
yScroll = self.pageYOffset;
xScroll = self.pageXOffset;
} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
yScroll = document.documentElement.scrollTop;
xScroll = document.documentElement.scrollLeft;
} else if (document.body) {// all other Explorers
yScroll = document.body.scrollTop;
xScroll = document.body.scrollLeft;
}
arrayPageScroll = new Array(xScroll,yScroll);
return arrayPageScroll;
};
/**
* Stop the code execution from a escified time in milisecond
*
*/
function ___pause(ms) {
var date = new Date();
curDate = null;
do { var curDate = new Date(); }
while ( curDate - date < ms);
};
// Return the jQuery object for chaining. The unbind method is used to avoid click conflict when the plugin is called more than once
return this.unbind('click').click(_initialize);
};
})(jQuery); // Call and execute the function immediately passing the jQuery object
/*
* jQuery ifixpng plugin
* (previously known as pngfix)
* Version 2.1 (23/04/2008)
* @requires jQuery v1.1.3 or above
*
* Examples at: http://jquery.khurshid.com
* Copyright (c) 2007 Kush M.
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*/
/**
*
* @example
*
* optional if location of pixel.gif if different to default which is images/pixel.gif
* $.ifixpng('media/pixel.gif');
*
* $('img[@src$=.png], #panel').ifixpng();
*
* @apply hack to all png images and #panel which icluded png img in its css
*
* @name ifixpng
* @type jQuery
* @cat Plugins/Image
* @return jQuery
* @author jQuery Community
*/
(function($) {
/**
* helper variables and function
*/
$.ifixpng = function(customPixel) {
$.ifixpng.pixel = customPixel;
};
$.ifixpng.getPixel = function() {
return $.ifixpng.pixel || 'images/pixel.gif';
};
var hack = {
ltie7 : $.browser.msie && $.browser.version < 7,
filter : function(src) {
return "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='"+src+"')";
}
};
/**
* Applies ie png hack to selected dom elements
*
* $('img[@src$=.png]').ifixpng();
* @desc apply hack to all images with png extensions
*
* $('#panel, img[@src$=.png]').ifixpng();
* @desc apply hack to element #panel and all images with png extensions
*
* @name ifixpng
*/
$.fn.ifixpng = hack.ltie7 ? function() {
return this.each(function() {
var $$ = $(this);
// in case rewriting urls
var base = $('base').attr('href');
if (base) {
// remove anything after the last '/'
base = base.replace(/\/[^\/]+$/,'/');
}
if ($$.is('img') || $$.is('input')) { // hack image tags present in dom
if ($$.attr('src')) {
if ($$.attr('src').match(/.*\.png([?].*)?$/i)) { // make sure it is png image
// use source tag value if set
var source = (base && $$.attr('src').search(/^(\/|http:)/i)) ? base + $$.attr('src') : $$.attr('src');
// apply filter
$$.css({filter:hack.filter(source), width:$$.width(), height:$$.height()})
.attr({src:$.ifixpng.getPixel()})
.positionFix();
}
}
} else { // hack png css properties present inside css
var image = $$.css('backgroundImage');
if (image.match(/^url\(["']?(.*\.png([?].*)?)["']?\)$/i)) {
image = RegExp.$1;
image = (base && image.substring(0,1)!='/') ? base + image : image;
$$.css({backgroundImage:'none', filter:hack.filter(image)})
.children().children().positionFix();
}
}
});
} : function() { return this; };
/**
* Removes any png hack that may have been applied previously
*
* $('img[@src$=.png]').iunfixpng();
* @desc revert hack on all images with png extensions
*
* $('#panel, img[@src$=.png]').iunfixpng();
* @desc revert hack on element #panel and all images with png extensions
*
* @name iunfixpng
*/
$.fn.iunfixpng = hack.ltie7 ? function() {
return this.each(function() {
var $$ = $(this);
var src = $$.css('filter');
if (src.match(/src=["']?(.*\.png([?].*)?)["']?/i)) { // get img source from filter
src = RegExp.$1;
if ($$.is('img') || $$.is('input')) {
$$.attr({src:src}).css({filter:''});
} else {
$$.css({filter:'', background:'url('+src+')'});
}
}
});
} : function() { return this; };
/**
* positions selected item relatively
*/
$.fn.positionFix = function() {
return this.each(function() {
var $$ = $(this);
var position = $$.css('position');
if (position != 'absolute' && position != 'relative') {
$$.css({position:'relative'});
}
});
};
})(jQuery);
