"
Team:Imperial/js/carousel
From 2014.igem.org
(function($) { var aux = { // navigates left / right navigate : function( dir, $el, $wrapper, opts, cache ) {
var scroll = opts.scroll, factor = 1, idxClicked = 0;
if( cache.expanded ) { scroll = 1; // scroll is always 1 in full mode factor = 3; // the width of the expanded item will be 3 times bigger than 1 collapsed item idxClicked = cache.idxClicked; // the index of the clicked item }
// clone the elements on the right / left and append / prepend them according to dir and scroll if( dir === 1 ) { $wrapper.find('div.ca-item:lt(' + scroll + ')').each(function(i) { $(this).clone(true).css( 'left', ( cache.totalItems - idxClicked + i ) * cache.itemW * factor + 'px' ).appendTo( $wrapper ); }); } else { var $first = $wrapper.children().eq(0);
$wrapper.find('div.ca-item:gt(' + ( cache.totalItems - 1 - scroll ) + ')').each(function(i) { // insert before $first so they stay in the right order $(this).clone(true).css( 'left', - ( scroll - i + idxClicked ) * cache.itemW * factor + 'px' ).insertBefore( $first ); }); }
// animate the left of each item // the calculations are dependent on dir and on the cache.expanded value $wrapper.find('div.ca-item').each(function(i) { var $item = $(this); $item.stop().animate({ left : ( dir === 1 ) ? '-=' + ( cache.itemW * factor * scroll ) + 'px' : '+=' + ( cache.itemW * factor * scroll ) + 'px' }, opts.sliderSpeed, opts.sliderEasing, function() { if( ( dir === 1 && $item.position().left < - idxClicked * cache.itemW * factor ) || ( dir === -1 && $item.position().left > ( ( cache.totalItems - 1 - idxClicked ) * cache.itemW * factor ) ) ) { // remove the item that was cloned $item.remove(); } cache.isAnimating = false; }); });
}, // opens an item (animation) -> opens all the others openItem : function( $wrapper, $item, opts, cache ) { cache.idxClicked = $item.index(); // the item's position (1, 2, or 3) on the viewport (the visible items) cache.winpos = aux.getWinPos( $item.position().left, cache ); $wrapper.find('div.ca-item').not( $item ).hide(); $item.find('div.ca-content-wrapper').css( 'left', cache.itemW + 'px' ).stop().animate({ width : cache.itemW * 2 + 'px', left : cache.itemW + 'px' }, opts.itemSpeed, opts.itemEasing) .end() .stop() .animate({ left : '0px' }, opts.itemSpeed, opts.itemEasing, function() { cache.isAnimating = false; cache.expanded = true;
aux.openItems( $wrapper, $item, opts, cache ); });
}, // opens all the items openItems : function( $wrapper, $openedItem, opts, cache ) { var openedIdx = $openedItem.index();
$wrapper.find('div.ca-item').each(function(i) { var $item = $(this), idx = $item.index();
if( idx !== openedIdx ) { $item.css( 'left', - ( openedIdx - idx ) * ( cache.itemW * 3 ) + 'px' ).show().find('div.ca-content-wrapper').css({ left : cache.itemW + 'px', width : cache.itemW * 2 + 'px' });
// hide more link aux.toggleMore( $item, false ); } }); }, // show / hide the item's more button toggleMore : function( $item, show ) { ( show ) ? $item.find('a.ca-more').show() : $item.find('a.ca-more').hide(); }, // close all the items // the current one is animated closeItems : function( $wrapper, $openedItem, opts, cache ) { var openedIdx = $openedItem.index();
$openedItem.find('div.ca-content-wrapper').stop().animate({ width : '0px' }, opts.itemSpeed, opts.itemEasing) .end() .stop() .animate({ left : cache.itemW * ( cache.winpos - 1 ) + 'px' }, opts.itemSpeed, opts.itemEasing, function() { cache.isAnimating = false; cache.expanded = false; });
// show more link aux.toggleMore( $openedItem, true );
$wrapper.find('div.ca-item').each(function(i) { var $item = $(this), idx = $item.index();
if( idx !== openedIdx ) { $item.find('div.ca-content-wrapper').css({ width : '0px' }) .end() .css( 'left', ( ( cache.winpos - 1 ) - ( openedIdx - idx ) ) * cache.itemW + 'px' ) .show();
// show more link aux.toggleMore( $item, true ); } }); }, // gets the item's position (1, 2, or 3) on the viewport (the visible items) // val is the left of the item getWinPos : function( val, cache ) { switch( val ) { case 0 : return 1; break; case cache.itemW : return 2; break; case cache.itemW * 2 : return 3; break; } } }, methods = { init : function( options ) {
if( this.length ) {
var settings = { sliderSpeed : 500, // speed for the sliding animation sliderEasing : 'easeOutExpo',// easing for the sliding animation itemSpeed : 500, // speed for the item animation (open / close) itemEasing : 'easeOutExpo',// easing for the item animation (open / close) scroll : 1 // number of items to scroll at a time };
return this.each(function() {
// if options exist, lets merge them with our default settings if ( options ) { $.extend( settings, options ); }
var $el = $(this), $wrapper = $el.find('div.ca-wrapper'), $items = $wrapper.children('div.ca-item'), cache = {};
// save the with of one item cache.itemW = $items.width(); // save the number of total items cache.totalItems = $items.length;
// add navigation buttons if( cache.totalItems > 3 )
$el.prepend('// control the scroll value if( settings.scroll < 1 ) settings.scroll = 1; else if( settings.scroll > 3 ) settings.scroll = 3;
var $navPrev = $el.find('span.ca-nav-prev'), $navNext = $el.find('span.ca-nav-next');
// hide the items except the first 3 $wrapper.css( 'overflow', 'hidden' );
// the items will have position absolute // calculate the left of each item $items.each(function(i) { $(this).css({ position : 'absolute', left : i * cache.itemW + 'px' }); });
// click to open the item(s) $el.find('a.ca-more').live('click.contentcarousel', function( event ) { if( cache.isAnimating ) return false; cache.isAnimating = true; $(this).hide(); var $item = $(this).closest('div.ca-item'); aux.openItem( $wrapper, $item, settings, cache ); return false; });
// click to close the item(s) $el.find('a.ca-close').live('click.contentcarousel', function( event ) { if( cache.isAnimating ) return false; cache.isAnimating = true; var $item = $(this).closest('div.ca-item'); aux.closeItems( $wrapper, $item, settings, cache ); return false; });
// navigate left $navPrev.bind('click.contentcarousel', function( event ) { if( cache.isAnimating ) return false; cache.isAnimating = true; aux.navigate( -1, $el, $wrapper, settings, cache ); });
// navigate right $navNext.bind('click.contentcarousel', function( event ) { if( cache.isAnimating ) return false; cache.isAnimating = true; aux.navigate( 1, $el, $wrapper, settings, cache ); });
// adds events to the mouse
});
}
}
};
$.fn.contentcarousel = function(method) { if ( methods[method] ) { return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 )); } else if ( typeof method === 'object' || ! method ) { return methods.init.apply( this, arguments ); } else { $.error( 'Method ' + method + ' does not exist on jQuery.contentcarousel' ); } };
})(jQuery);
/*
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/ * * Uses the built in easing capabilities added In jQuery 1.1 * to offer multiple easing options * * TERMS OF USE - jQuery Easing * * Open source under the BSD License. * * Copyright © 2008 George McGinley Smith * All rights reserved. * * Redistribution and use in source and binary forms, with or without modification, * are permitted provided that the following conditions are met: * * Redistributions of source code must retain the above copyright notice, this list of * conditions and the following disclaimer. * Redistributions in binary form must reproduce the above copyright notice, this list * of conditions and the following disclaimer in the documentation and/or other materials * provided with the distribution. * * Neither the name of the author nor the names of contributors may be used to endorse * or promote products derived from this software without specific prior written permission. * * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED * OF THE POSSIBILITY OF SUCH DAMAGE. *
- /
// t: current time, b: begInnIng value, c: change In value, d: duration jQuery.easing['jswing'] = jQuery.easing['swing'];
jQuery.extend( jQuery.easing, { def: 'easeOutQuad', swing: function (x, t, b, c, d) { //alert(jQuery.easing.default); return jQuery.easing[jQuery.easing.def](x, t, b, c, d); }, easeInQuad: function (x, t, b, c, d) { return c*(t/=d)*t + b; }, easeOutQuad: function (x, t, b, c, d) { return -c *(t/=d)*(t-2) + b; }, easeInOutQuad: function (x, t, b, c, d) { if ((t/=d/2) < 1) return c/2*t*t + b; return -c/2 * ((--t)*(t-2) - 1) + b; }, easeInCubic: function (x, t, b, c, d) { return c*(t/=d)*t*t + b; }, easeOutCubic: function (x, t, b, c, d) { return c*((t=t/d-1)*t*t + 1) + b; }, easeInOutCubic: function (x, t, b, c, d) { if ((t/=d/2) < 1) return c/2*t*t*t + b; return c/2*((t-=2)*t*t + 2) + b; }, easeInQuart: function (x, t, b, c, d) { return c*(t/=d)*t*t*t + b; }, easeOutQuart: function (x, t, b, c, d) { return -c * ((t=t/d-1)*t*t*t - 1) + b; }, easeInOutQuart: function (x, t, b, c, d) { if ((t/=d/2) < 1) return c/2*t*t*t*t + b; return -c/2 * ((t-=2)*t*t*t - 2) + b; }, easeInQuint: function (x, t, b, c, d) { return c*(t/=d)*t*t*t*t + b; }, easeOutQuint: function (x, t, b, c, d) { return c*((t=t/d-1)*t*t*t*t + 1) + b; }, easeInOutQuint: function (x, t, b, c, d) { if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b; return c/2*((t-=2)*t*t*t*t + 2) + b; }, easeInSine: function (x, t, b, c, d) { return -c * Math.cos(t/d * (Math.PI/2)) + c + b; }, easeOutSine: function (x, t, b, c, d) { return c * Math.sin(t/d * (Math.PI/2)) + b; }, easeInOutSine: function (x, t, b, c, d) { return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b; }, easeInExpo: function (x, t, b, c, d) { return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; }, easeOutExpo: function (x, t, b, c, d) { return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; }, easeInOutExpo: function (x, t, b, c, d) { if (t==0) return b; if (t==d) return b+c; if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b; return c/2 * (-Math.pow(2, -10 * --t) + 2) + b; }, easeInCirc: function (x, t, b, c, d) { return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b; }, easeOutCirc: function (x, t, b, c, d) { return c * Math.sqrt(1 - (t=t/d-1)*t) + b; }, easeInOutCirc: function (x, t, b, c, d) { if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b; return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b; }, easeInElastic: function (x, t, b, c, d) { var s=1.70158;var p=0;var a=c; if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3; if (a < Math.abs(c)) { a=c; var s=p/4; } else var s = p/(2*Math.PI) * Math.asin (c/a); return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; }, easeOutElastic: function (x, t, b, c, d) { var s=1.70158;var p=0;var a=c; if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3; if (a < Math.abs(c)) { a=c; var s=p/4; } else var s = p/(2*Math.PI) * Math.asin (c/a); return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b; }, easeInOutElastic: function (x, t, b, c, d) { var s=1.70158;var p=0;var a=c; if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5); if (a < Math.abs(c)) { a=c; var s=p/4; } else var s = p/(2*Math.PI) * Math.asin (c/a); if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b; }, easeInBack: function (x, t, b, c, d, s) { if (s == undefined) s = 1.70158; return c*(t/=d)*t*((s+1)*t - s) + b; }, easeOutBack: function (x, t, b, c, d, s) { if (s == undefined) s = 1.70158; return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b; }, easeInOutBack: function (x, t, b, c, d, s) { if (s == undefined) s = 1.70158; if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b; return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b; }, easeInBounce: function (x, t, b, c, d) { return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b; }, easeOutBounce: function (x, t, b, c, d) { if ((t/=d) < (1/2.75)) { return c*(7.5625*t*t) + b; } else if (t < (2/2.75)) { return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b; } else if (t < (2.5/2.75)) { return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b; } else { return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b; } }, easeInOutBounce: function (x, t, b, c, d) { if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b; return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b; } });
/*
* * TERMS OF USE - EASING EQUATIONS * * Open source under the BSD License. * * Copyright © 2001 Robert Penner * All rights reserved. * * Redistribution and use in source and binary forms, with or without modification, * are permitted provided that the following conditions are met: * * Redistributions of source code must retain the above copyright notice, this list of * conditions and the following disclaimer. * Redistributions in binary form must reproduce the above copyright notice, this list * of conditions and the following disclaimer in the documentation and/or other materials * provided with the distribution. * * Neither the name of the author nor the names of contributors may be used to endorse * or promote products derived from this software without specific prior written permission. * * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED * OF THE POSSIBILITY OF SUCH DAMAGE. * */
