function setupBanners(container, autorotate, options) { var banner = Ojay(container), options = options || {}, banners = banner.descendants('.banner').setStyle({opacity: 0}).hide(), current = banners.at(0).setStyle({opacity: 1}).show(); var sequence = function() { var args = arguments; return function() { for (var i = 0, n = args.length; i < n; i += 1) args[i](); }; }; if(options.speed){ var speed = options.speed; }else{ var speed = 6500; } var time = Number(new Date), TIMEOUT = speed, timeout = TIMEOUT, index = 0, lock = false; if(autorotate){ stopAnimation = false; }else{ stopAnimation = true; } var update = function(idx) { if (lock) return; var next = banners.at(idx); lock = true; next.show().setStyle({zIndex: 4}) .animate({opacity: {to: 1}}, 0.8) ._(function() { current.hide().setStyle({opacity: 0}); next.setStyle({zIndex: 0}); current = next; index = idx; lock = false; }); numbers.children().wait(0.5) .removeClass('current') .at(idx).addClass('current'); }; var next = function() { if (lock) return; index = (index + 1) % banners.length; update(index); }; var previous = function() { if (lock) return; index -= 1; if (index < 0) index = banners.length - 1; update(index); }; var resetTime = function() { time = Number(new Date); timeout = 2 * TIMEOUT; }; //Only do work if banner links haven't been clicked and we have more than one banner or the timeout is exceeded setInterval(function() { if (stopAnimation) return; if (Number(new Date) - time < timeout || banners.length == 1) return; time = Number(new Date); timeout = TIMEOUT; next(); }, timeout / 2); var numbers = Ojay(Ojay.HTML.ul({className: 'banner-links'}, function(h) { banners.length.times(function(i) { var text = options.links ? options.links[i] : String(i+1), link = Ojay(h.li()); link.setContent(text); if (i === index) link.addClass('current'); link.on('click', function() { resetTime(); update(i); stopAnimation = true; }); }); })); banner.insert(numbers, 'before'); var previousBtn = Ojay(Ojay.HTML.div({className: 'previous'}, 'Previous')), nextBtn = Ojay(Ojay.HTML.div({className: 'next'}, 'Next')); numbers.insert(previousBtn, 'before') .insert(nextBtn, 'before'); previousBtn.on('click', sequence(resetTime, previous)); nextBtn.on('click', sequence(resetTime, next)); //Events which stop the banner animation Ojay('.banner .video-block').on('click', function() { stopAnimation = true; }); Ojay('.banner-container .previous').on('click', function() { stopAnimation = true; }); Ojay('.banner-container .next').on('click', function() { stopAnimation = true; }); } function setupVideoBanners(container, options) { var banner = Ojay(container), options = options || {}, banners = banner.descendants('.banner').setStyle({opacity: 0}).hide(), current = banners.at(0).setStyle({opacity: 1}).show(); var sequence = function() { var args = arguments; return function() { for (var i = 0, n = args.length; i < n; i += 1) args[i](); }; }; var time = Number(new Date), TIMEOUT = 4000, timeout = TIMEOUT, index = 0, lock = false; stopAnimation = true; var update = function(idx) { if (lock) return; var next = banners.at(idx); lock = true; next.show().setStyle({zIndex: 4}) .animate({opacity: {to: 1}}, 0.8) ._(function() { current.hide().setStyle({opacity: 0}); next.setStyle({zIndex: 0}); current = next; index = idx; lock = false; }); numbers.children().wait(0.5) .removeClass('current') .at(idx).addClass('current'); }; var next = function() { if (lock) return; index = (index + 1) % banners.length; update(index); }; var previous = function() { if (lock) return; index -= 1; if (index < 0) index = banners.length - 1; update(index); }; var resetTime = function() { time = Number(new Date); timeout = 2 * TIMEOUT; }; //Only do work if banner links haven't been clicked and we have more than one banner or the timeout is exceeded setInterval(function() { if (stopAnimation) return; if (Number(new Date) - time < timeout || banners.length == 1) return; time = Number(new Date); timeout = TIMEOUT; next(); }, timeout / 2); var numbers = Ojay(Ojay.HTML.ul({className: 'banner-links'}, function(h) { banners.length.times(function(i) { var text = options.links ? options.links[i] : String(i+1), link = Ojay(h.li()); link.setContent(text); if (i === index) link.addClass('current'); link.on('click', function() { resetTime(); update(i); stopAnimation = true; }); }); })); banner.insert(numbers, 'before'); var previousBtn = Ojay(Ojay.HTML.div({className: 'previous'}, 'Previous')), nextBtn = Ojay(Ojay.HTML.div({className: 'next'}, 'Next')); numbers.insert(previousBtn, 'before') .insert(nextBtn, 'before'); previousBtn.on('click', sequence(resetTime, previous)); nextBtn.on('click', sequence(resetTime, next)); //Events which stop the banner animation Ojay('.banner .video-block').on('click', function() { stopAnimation = true; }); Ojay('.banner-container .previous').on('click', function() { stopAnimation = true; }); Ojay('.banner-container .next').on('click', function() { stopAnimation = true; }); }