jquery.gridrotator.js 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748
  1. /* Modernizr 2.6.1 (Custom Build) | MIT & BSD
  2. * Build: http://modernizr.com/download/#-backgroundsize-csstransforms-csstransforms3d-csstransitions-shiv-cssclasses-teststyles-testprop-testallprops-prefixes-domprefixes-load
  3. */
  4. ;window.Modernizr=function(a,b,c){function z(a){j.cssText=a}function A(a,b){return z(m.join(a+";")+(b||""))}function B(a,b){return typeof a===b}function C(a,b){return!!~(""+a).indexOf(b)}function D(a,b){for(var d in a){var e=a[d];if(!C(e,"-")&&j[e]!==c)return b=="pfx"?e:!0}return!1}function E(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:B(f,"function")?f.bind(d||b):f}return!1}function F(a,b,c){var d=a.charAt(0).toUpperCase()+a.slice(1),e=(a+" "+o.join(d+" ")+d).split(" ");return B(b,"string")||B(b,"undefined")?D(e,b):(e=(a+" "+p.join(d+" ")+d).split(" "),E(e,b,c))}var d="2.6.1",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k,l={}.toString,m=" -webkit- -moz- -o- -ms- ".split(" "),n="Webkit Moz O ms",o=n.split(" "),p=n.toLowerCase().split(" "),q={},r={},s={},t=[],u=t.slice,v,w=function(a,c,d,e){var f,i,j,k=b.createElement("div"),l=b.body,m=l?l:b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),k.appendChild(j);return f=["&#173;",'<style id="s',h,'">',a,"</style>"].join(""),k.id=h,(l?k:m).innerHTML+=f,m.appendChild(k),l||(m.style.background="",g.appendChild(m)),i=c(k,a),l?k.parentNode.removeChild(k):m.parentNode.removeChild(m),!!i},x={}.hasOwnProperty,y;!B(x,"undefined")&&!B(x.call,"undefined")?y=function(a,b){return x.call(a,b)}:y=function(a,b){return b in a&&B(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=u.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(u.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(u.call(arguments)))};return e}),q.backgroundsize=function(){return F("backgroundSize")},q.csstransforms=function(){return!!F("transform")},q.csstransforms3d=function(){var a=!!F("perspective");return a&&"webkitPerspective"in g.style&&w("@media (transform-3d),(-webkit-transform-3d){#modernizr{left:9px;position:absolute;height:3px;}}",function(b,c){a=b.offsetLeft===9&&b.offsetHeight===3}),a},q.csstransitions=function(){return F("transition")};for(var G in q)y(q,G)&&(v=G.toLowerCase(),e[v]=q[G](),t.push((e[v]?"":"no-")+v));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)y(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},z(""),i=k=null,function(a,b){function k(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function l(){var a=r.elements;return typeof a=="string"?a.split(" "):a}function m(a){var b=i[a[g]];return b||(b={},h++,a[g]=h,i[h]=b),b}function n(a,c,f){c||(c=b);if(j)return c.createElement(a);f||(f=m(c));var g;return f.cache[a]?g=f.cache[a].cloneNode():e.test(a)?g=(f.cache[a]=f.createElem(a)).cloneNode():g=f.createElem(a),g.canHaveChildren&&!d.test(a)?f.frag.appendChild(g):g}function o(a,c){a||(a=b);if(j)return a.createDocumentFragment();c=c||m(a);var d=c.frag.cloneNode(),e=0,f=l(),g=f.length;for(;e<g;e++)d.createElement(f[e]);return d}function p(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return r.shivMethods?n(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+l().join().replace(/\w+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(r,b.frag)}function q(a){a||(a=b);var c=m(a);return r.shivCSS&&!f&&!c.hasCSS&&(c.hasCSS=!!k(a,"article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}")),j||p(a,c),a}var c=a.html5||{},d=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,e=/^<|^(?:a|b|button|code|div|fieldset|form|h1|h2|h3|h4|h5|h6|i|iframe|img|input|label|li|link|ol|option|p|param|q|script|select|span|strong|style|table|tbody|td|textarea|tfoot|th|thead|tr|ul)$/i,f,g="_html5shiv",h=0,i={},j;(function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",f="hidden"in a,j=a.childNodes.length==1||function(){b.createElement("a");var a=b.createDocumentFragment();return typeof a.cloneNode=="undefined"||typeof a.createDocumentFragment=="undefined"||typeof a.createElement=="undefined"}()}catch(c){f=!0,j=!0}})();var r={elements:c.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:c.shivCSS!==!1,supportsUnknownElements:j,shivMethods:c.shivMethods!==!1,type:"default",shivDocument:q,createElement:n,createDocumentFragment:o};a.html5=r,q(b)}(this,b),e._version=d,e._prefixes=m,e._domPrefixes=p,e._cssomPrefixes=o,e.testProp=function(a){return D([a])},e.testAllProps=F,e.testStyles=w,g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+t.join(" "):""),e}(this,this.document),function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1)},0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img"!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y[c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l.onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.insertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p=[],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script":u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f=0;f<d;f++)g=a[f].split("="),(e=z[g.shift()])&&(c=e(c,g));for(f=0;f<b;f++)c=x[f](c);return c}function g(a,e,f,g,h){var i=b(a),j=i.autoCallback;i.url.split(".").pop().split("?").shift(),i.bypass||(e&&(e=d(e)?e:e[a]||e[g]||e[a.split("/").pop().split("?")[0]]),i.instead?i.instead(a,e,f,g,h):(y[i.url]?i.noexec=!0:y[i.url]=1,f.load(i.url,i.forceCSS||!i.forceJS&&"css"==i.url.split(".").pop().split("?").shift()?"c":c,i.noexec,i.attrs,i.timeout),(d(e)||d(j))&&f.load(function(){k(),e&&e(i.origUrl,h,g),j&&j(i.origUrl,h,g),y[i.url]=2})))}function h(a,b){function c(a,c){if(a){if(e(a))c||(j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}),g(a,j,b,0,h);else if(Object(a)===a)for(n in m=function(){var b=0,c;for(c in a)a.hasOwnProperty(c)&&b++;return b}(),a)a.hasOwnProperty(n)&&(!c&&!--m&&(d(j)?j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}:j[n]=function(a){return function(){var b=[].slice.call(arguments);a&&a.apply(this,b),l()}}(k[n])),g(a[n],j,b,n,h))}else!c&&l()}var h=!!a.test,i=a.load||a.both,j=a.callback||f,k=j,l=a.complete||f,m,n;c(h?a.yep:a.nope,!!i),i&&c(i)}var i,j,l=this.yepnope.loader;if(e(a))g(a,0,l,0);else if(w(a))for(i=0;i<a.length;i++)j=a[i],e(j)?g(j,0,l,0):w(j)?B(j):Object(j)===j&&h(j,l);else Object(a)===a&&h(a,l)},B.addPrefix=function(a,b){z[a]=b},B.addFilter=function(a){x.push(a)},B.errorTimeout=1e4,null==b.readyState&&b.addEventListener&&(b.readyState="loading",b.addEventListener("DOMContentLoaded",A=function(){b.removeEventListener("DOMContentLoaded",A,0),b.readyState="complete"},0)),a.yepnope=k(),a.yepnope.executeStack=h,a.yepnope.injectJs=function(a,c,d,e,i,j){var k=b.createElement("script"),l,o,e=e||B.errorTimeout;k.src=a;for(o in d)k.setAttribute(o,d[o]);c=j?h:c||f,k.onreadystatechange=k.onload=function(){!l&&g(k.readyState)&&(l=1,c(),k.onload=k.onreadystatechange=null)},m(function(){l||(l=1,c(1))},e),i?k.onload():n.parentNode.insertBefore(k,n)},a.yepnope.injectCss=function(a,c,d,e,g,i){var e=b.createElement("link"),j,c=i?h:c||f;e.href=a,e.rel="stylesheet",e.type="text/css";for(j in d)e.setAttribute(j,d[j]);g||(n.parentNode.insertBefore(e,n),m(c,0))}}(this,document),Modernizr.load=function(){yepnope.apply(window,[].slice.call(arguments,0))};
  5. /**
  6. * jquery.gridrotator.js v1.0.0
  7. * http://www.codrops.com
  8. *
  9. * Licensed under the MIT license.
  10. * http://www.opensource.org/licenses/mit-license.php
  11. *
  12. * Copyright 2012, Codrops
  13. * http://www.codrops.com
  14. */
  15. ;( function( $, window, undefined ) {
  16. 'use strict';
  17. // http://www.hardcode.nl/subcategory_1/article_317-array-shuffle-function
  18. Array.prototype.shuffle = function() {
  19. var i=this.length,p,t;
  20. while (i--) {
  21. p = Math.floor(Math.random()*i);
  22. t = this[i];
  23. this[i]=this[p];
  24. this[p]=t;
  25. }
  26. return this;
  27. };
  28. /*
  29. * debouncedresize: special jQuery event that happens once after a window resize
  30. *
  31. * latest version and complete README available on Github:
  32. * https://github.com/louisremi/jquery-smartresize/blob/master/jquery.debouncedresize.js
  33. *
  34. * Copyright 2011 @louis_remi
  35. * Licensed under the MIT license.
  36. */
  37. var $event = $.event,
  38. $special,
  39. resizeTimeout;
  40. $special = $event.special.debouncedresize = {
  41. setup: function() {
  42. $( this ).on( "resize", $special.handler );
  43. },
  44. teardown: function() {
  45. $( this ).off( "resize", $special.handler );
  46. },
  47. handler: function( event, execAsap ) {
  48. // Save the context
  49. var context = this,
  50. args = arguments,
  51. dispatch = function() {
  52. // set correct event type
  53. event.type = "debouncedresize";
  54. $event.dispatch.apply( context, args );
  55. };
  56. if ( resizeTimeout ) {
  57. clearTimeout( resizeTimeout );
  58. }
  59. execAsap ?
  60. dispatch() :
  61. resizeTimeout = setTimeout( dispatch, $special.threshold );
  62. },
  63. threshold: 50
  64. };
  65. // global
  66. var $window = $( window ),
  67. Modernizr = window.Modernizr;
  68. $.GridRotator = function( options, element ) {
  69. this.$el = $( element );
  70. if( Modernizr.backgroundsize ) {
  71. var _self = this;
  72. this.$el.addClass( 'ri-grid-loading' );
  73. $( '<img/>' ).load( function() {
  74. _self._init( options );
  75. } ).attr( 'src', 'images/loading.gif' );
  76. }
  77. };
  78. $.GridRotator.defaults = {
  79. // number of rows
  80. rows : 4,
  81. // number of columns
  82. columns : 10,
  83. w1024 : {
  84. rows : 3,
  85. columns : 8
  86. },
  87. w768 : {
  88. rows : 3,
  89. columns : 7
  90. },
  91. w480 : {
  92. rows : 3,
  93. columns : 5
  94. },
  95. w320 : {
  96. rows : 2,
  97. columns : 4
  98. },
  99. w240 : {
  100. rows : 2,
  101. columns : 3
  102. },
  103. // step: number of items that are replaced at the same time
  104. // random || [some number]
  105. // note: for performance issues, the number "can't" be > options.maxStep
  106. step : 'random',
  107. maxStep : 3,
  108. // prevent user to click the items
  109. preventClick : true,
  110. // animation type
  111. // showHide || fadeInOut || slideLeft ||
  112. // slideRight || slideTop || slideBottom ||
  113. // rotateLeft || rotateRight || rotateTop ||
  114. // rotateBottom || scale || rotate3d ||
  115. // rotateLeftScale || rotateRightScale ||
  116. // rotateTopScale || rotateBottomScale || random
  117. animType : 'random',
  118. // animation speed
  119. animSpeed : 500,
  120. // animation easings
  121. animEasingOut : 'linear',
  122. animEasingIn : 'linear',
  123. // the item(s) will be replaced every 3 seconds
  124. // note: for performance issues, the time "can't" be < 300 ms
  125. interval : 3000
  126. };
  127. $.GridRotator.prototype = {
  128. _init : function( options ) {
  129. var _self = this;
  130. // options
  131. this.options = $.extend( true, {}, $.GridRotator.defaults, options );
  132. // all types of animations
  133. this.animTypesAll = [ 'fadeInOut', 'slideLeft', 'slideRight', 'slideTop', 'slideBottom', 'rotateLeft', 'rotateRight', 'rotateTop', 'rotateBottom', 'scale', 'rotate3d', 'rotateLeftScale', 'rotateRightScale', 'rotateTopScale', 'rotateBottomScale' ];
  134. // types of animations for "older" browsers
  135. this.animTypesCond = [ 'fadeInOut', 'slideLeft', 'slideRight', 'slideTop', 'slideBottom' ];
  136. // array containing the animation types to choose from when the options.animType is set to 'random'
  137. this.animTypes = this.animTypesCond;
  138. if( Modernizr.csstransforms3d ) {
  139. this.animTypes = this.animTypesAll;
  140. }
  141. this.animType = this.options.animType;
  142. if( this.animType !== 'random' ) {
  143. if( !Modernizr.csstransforms3d && $.inArray( this.animType, this.animTypesCond ) === -1 && this.animType !== 'showHide' ) {
  144. // fallback to 'fadeInOut' if user sets a type which is not supported
  145. this.animType = 'fadeInOut';
  146. }
  147. }
  148. this.animTypesTotal = this.animTypes.length;
  149. // the <ul> where the items are placed
  150. this.$list = this.$el.children( 'ul' );
  151. // remove img's and add background-image to anchors
  152. // preload the images before
  153. var loaded = 0,
  154. $imgs = this.$list.find( 'img' ),
  155. count = $imgs.length;
  156. $imgs.each( function() {
  157. var $img = $( this ),
  158. src = $img.attr( 'src' );
  159. $( '<img/>' ).load( function() {
  160. ++loaded;
  161. $img.parent().css( 'background-image', 'url(' + src + ')' );
  162. if( loaded === count ) {
  163. $imgs.remove();
  164. _self.$el.removeClass( 'ri-grid-loading' );
  165. // the items
  166. _self.$items = _self.$list.children( 'li' );
  167. // make a copy of the items
  168. _self.$itemsCache = _self.$items.clone();
  169. // total number of items
  170. _self.itemsTotal = _self.$items.length;
  171. // the items that will be out of the grid
  172. // actually the item's child (anchor element)
  173. _self.outItems = [];
  174. _self._layout();
  175. _self._initEvents();
  176. // replace "options.step" items after "options.interval" time
  177. // the items that go out are randomly chosen, while the ones that get in
  178. // respect the order (first in first out)
  179. _self._start();
  180. }
  181. } ).attr( 'src', src )
  182. } );
  183. },
  184. _layout : function( callback ) {
  185. var _self = this;
  186. // sets the grid dimentions based on the container's width
  187. this._setGridDim();
  188. // reset
  189. this.$list.empty();
  190. this.$items = this.$itemsCache.clone().appendTo( this.$list );
  191. var $outItems = this.$items.filter( ':gt(' + ( this.showTotal - 1 ) + ')' ),
  192. $outAItems = $outItems.children( 'a' );
  193. this.outItems.length = 0;
  194. $outAItems.each( function( i ) {
  195. _self.outItems.push( $( this ) );
  196. } );
  197. $outItems.remove();
  198. // container's width
  199. var containerWidth = ( document.defaultView ) ? parseInt( document.defaultView.getComputedStyle( this.$el.get( 0 ), null ).width ) : this.$el.width(),
  200. // item's width
  201. itemWidth = Math.floor( containerWidth / this.columns ),
  202. // calculate gap
  203. gapWidth = containerWidth - ( this.columns * Math.floor( itemWidth ) );
  204. for( var i = 0; i < this.rows; ++i ) {
  205. for( var j = 0; j < this.columns; ++j ) {
  206. var $item = this.$items.eq( this.columns * i + j ),
  207. h = itemWidth,
  208. w = ( j < Math.floor( gapWidth ) ) ? itemWidth + 1 : itemWidth;
  209. $item.css( {
  210. width : w,
  211. height : h
  212. } );
  213. /*
  214. if( gapWidth % 1 !== 0 && j === this.columns - 1 ) {
  215. $item.children( 'a' ).css( {
  216. width : '+=1'//,
  217. height : '+=1'
  218. } );
  219. }
  220. */
  221. }
  222. }
  223. if( this.options.preventClick ) {
  224. this.$items.children().css( 'cursor', 'default' ).on( 'click.gridrotator', false );
  225. }
  226. if( callback ) {
  227. callback.call();
  228. }
  229. },
  230. // set the grid rows and columns
  231. _setGridDim : function() {
  232. // container's width
  233. var c_w = this.$el.width();
  234. // we will choose the number of rows/columns according to the container's width and the values set on the plugin options
  235. switch( true ) {
  236. case ( c_w < 240 ) : this.rows = this.options.w240.rows; this.columns = this.options.w240.columns; break;
  237. case ( c_w < 320 ) : this.rows = this.options.w320.rows; this.columns = this.options.w320.columns; break;
  238. case ( c_w < 480 ) : this.rows = this.options.w480.rows; this.columns = this.options.w480.columns; break;
  239. case ( c_w < 768 ) : this.rows = this.options.w768.rows; this.columns = this.options.w768.columns; break;
  240. case ( c_w < 1024 ) : this.rows = this.options.w1024.rows; this.columns = this.options.w1024.columns; break;
  241. default : this.rows = this.options.rows; this.columns = this.options.columns; break;
  242. }
  243. this.showTotal = this.rows * this.columns;
  244. },
  245. // init window resize event
  246. _initEvents : function() {
  247. var _self = this;
  248. $window.on( 'debouncedresize.gridrotator', function( event ) {
  249. clearTimeout( _self.playtimeout );
  250. _self._layout( function() {
  251. _self._start();
  252. } );
  253. } );
  254. },
  255. // start rotating elements
  256. _start : function() {
  257. if( this.showTotal < this.itemsTotal ) {
  258. this._showNext();
  259. }
  260. },
  261. // get which type of animation
  262. _getAnimType : function() {
  263. if( this.animType === 'random' ) {
  264. return this.animTypes[ Math.floor( Math.random() * this.animTypesTotal ) ];
  265. }
  266. else {
  267. return this.animType;
  268. }
  269. },
  270. // get css properties for the transition effect
  271. _getAnimProperties : function( $in, $out ) {
  272. var startInProp = {},
  273. startOutProp = {},
  274. endInProp = {},
  275. endOutProp = {},
  276. animType = this._getAnimType(),
  277. speed;
  278. switch( animType ) {
  279. case 'showHide' :
  280. speed = 0;
  281. endOutProp.opacity = 0;
  282. break;
  283. case 'fadeInOut' :
  284. endOutProp.opacity = 0;
  285. break;
  286. case 'slideLeft' :
  287. startInProp.left = $out.width();
  288. endInProp.left = 0;
  289. endOutProp.left = -$out.width();
  290. break;
  291. case 'slideRight' :
  292. startInProp.left = -$out.width();
  293. endInProp.left = 0;
  294. endOutProp.left = $out.width();
  295. break;
  296. case 'slideTop' :
  297. startInProp.top = $out.height();
  298. endInProp.top = 0;
  299. endOutProp.top = -$out.height();
  300. break;
  301. case 'slideBottom' :
  302. startInProp.top = -$out.height();
  303. endInProp.top = 0;
  304. endOutProp.top = $out.height();
  305. break;
  306. case 'rotateLeft' :
  307. speed = this.options.animSpeed / 2;
  308. startInProp.rotateY = '90deg';
  309. endInProp.rotateY = '0deg';
  310. endInProp.delay = speed;
  311. endOutProp.rotateY = '-90deg';
  312. break;
  313. case 'rotateRight' :
  314. speed = this.options.animSpeed / 2;
  315. startInProp.rotateY = '-90deg';
  316. endInProp.rotateY = '0deg';
  317. endInProp.delay = speed;
  318. endOutProp.rotateY = '90deg';
  319. break;
  320. case 'rotateTop' :
  321. speed = this.options.animSpeed / 2;
  322. startInProp.rotateX = '90deg';
  323. endInProp.rotateX = '0deg';
  324. endInProp.delay = speed;
  325. endOutProp.rotateX = '-90deg';
  326. break;
  327. case 'rotateBottom' :
  328. speed = this.options.animSpeed / 2;
  329. startInProp.rotateX = '-90deg';
  330. endInProp.rotateX = '0deg';
  331. endInProp.delay = speed;
  332. endOutProp.rotateX = '90deg';
  333. break;
  334. case 'scale' :
  335. speed = this.options.animSpeed / 2;
  336. startInProp.scale = '0';
  337. startOutProp.scale = '1';
  338. endInProp.scale = '1';
  339. endInProp.delay = speed;
  340. endOutProp.scale = '0';
  341. break;
  342. case 'rotateLeftScale' :
  343. startInProp.scale = '0.3';
  344. startOutProp.scale = '1';
  345. endInProp.scale = '1';
  346. endOutProp.scale = '0.3';
  347. speed = this.options.animSpeed / 2;
  348. startInProp.rotateY = '90deg';
  349. endInProp.rotateY = '0deg';
  350. endInProp.delay = speed;
  351. endOutProp.rotateY = '-90deg';
  352. break;
  353. case 'rotateRightScale' :
  354. startInProp.scale = '0.3';
  355. startOutProp.scale = '1';
  356. endInProp.scale = '1';
  357. endOutProp.scale = '0.3';
  358. speed = this.options.animSpeed / 2;
  359. startInProp.rotateY = '-90deg';
  360. endInProp.rotateY = '0deg';
  361. endInProp.delay = speed;
  362. endOutProp.rotateY = '90deg';
  363. break;
  364. case 'rotateTopScale' :
  365. startInProp.scale = '0.3';
  366. startOutProp.scale = '1';
  367. endInProp.scale = '1';
  368. endOutProp.scale = '0.3';
  369. speed = this.options.animSpeed / 2;
  370. startInProp.rotateX = '90deg';
  371. endInProp.rotateX = '0deg';
  372. endInProp.delay = speed;
  373. endOutProp.rotateX = '-90deg';
  374. break;
  375. case 'rotateBottomScale' :
  376. startInProp.scale = '0.3';
  377. startOutProp.scale = '1';
  378. endInProp.scale = '1';
  379. endOutProp.scale = '0.3';
  380. speed = this.options.animSpeed / 2;
  381. startInProp.rotateX = '-90deg';
  382. endInProp.rotateX = '0deg';
  383. endInProp.delay = speed;
  384. endOutProp.rotateX = '90deg';
  385. break;
  386. case 'rotate3d' :
  387. speed = this.options.animSpeed / 2;
  388. startInProp.rotate3d = '1, 1, 0, 90deg';
  389. endInProp.rotate3d = '1, 1, 0, 0deg';
  390. endInProp.delay = speed;
  391. endOutProp.rotate3d = '1, 1, 0, -90deg';
  392. break;
  393. }
  394. var animSpeed = ( speed != undefined ) ? speed : this.options.animSpeed;
  395. return {
  396. startInProp : startInProp,
  397. startOutProp : startOutProp,
  398. endInProp : endInProp,
  399. endOutProp : endOutProp,
  400. animSpeed : animSpeed
  401. };
  402. },
  403. // show next "option.step" elements
  404. _showNext : function( t ) {
  405. var _self = this;
  406. clearTimeout( this.playtimeout );
  407. this.playtimeout = setTimeout( function() {
  408. var step = _self.options.step,
  409. max = _self.options.maxStep,
  410. min = 1;
  411. if( max > _self.showTotal ) {
  412. max = _self.showTotal;
  413. }
  414. var $items = _self.$items,
  415. outs = [],
  416. // number of items to swith at this point of time
  417. nmbOut = ( step === 'random' ) ? Math.floor( Math.random() * max + min ) : Math.min( Math.abs( step ) , max ) ,
  418. // array with random indexes. These will be the indexes of the items we will replace
  419. randArr = _self._getRandom( nmbOut, _self.showTotal );
  420. for( var i = 0; i < nmbOut; ++i ) {
  421. // element to go out
  422. var $out = $items.eq( randArr[ i ] );
  423. // if element is active, which means it is currently animating,
  424. // then we need to get different positions..
  425. if( $out.data( 'active' ) ) {
  426. // one of the items is active, call again..
  427. _self._showNext( 1 );
  428. return false;
  429. }
  430. // add it to outs array
  431. outs.push( $out );
  432. }
  433. for( var i = 0; i < nmbOut; ++i ) {
  434. var $out = outs[ i ],
  435. $outA = $out.children( 'a:last' ),
  436. newElProp = {
  437. width : $outA.width(),
  438. height : $outA.height()
  439. };
  440. // element stays active
  441. $out.data( 'active', true );
  442. // get the element (anchor) that will go in (first one inserted in _self.outItems)
  443. var $inA = _self.outItems.shift();
  444. // save element that went out
  445. _self.outItems.push( $outA.clone() );
  446. // prepend in element
  447. $inA.css( newElProp ).prependTo( $out );
  448. var animProp = _self._getAnimProperties( $inA, $outA );
  449. if( Modernizr.csstransitions ) {
  450. $inA.css( animProp.startInProp ).transition( animProp.endInProp, animProp.animSpeed, _self.options.animEasingIn );
  451. $outA.css( animProp.startOutProp ).transition( animProp.endOutProp, animProp.animSpeed, _self.options.animEasingOut, function() {
  452. $( this ).parent().data( 'active', false ).end().remove();
  453. } );
  454. }
  455. // fallback to jQuery animate
  456. else {
  457. $inA.css( animProp.startInProp ).stop().animate( animProp.endInProp, animProp.animSpeed );
  458. $outA.css( animProp.startOutProp ).stop().animate( animProp.endOutProp, animProp.animSpeed, function() {
  459. $( this ).parent().data( 'active', false ).end().remove();
  460. } )
  461. }
  462. }
  463. // again and again..
  464. _self._showNext();
  465. }, t || Math.max( Math.abs( this.options.interval ) , 300 ) );
  466. },
  467. _getRandom : function( cnt, limit ) {
  468. var randArray = [];
  469. for( var i = 0; i < limit; ++i ) {
  470. randArray.push( i )
  471. }
  472. return randArray.shuffle().slice(0,cnt);
  473. }
  474. };
  475. var logError = function( message ) {
  476. if ( window.console ) {
  477. window.console.error( message );
  478. }
  479. };
  480. $.fn.gridrotator = function( options ) {
  481. if ( typeof options === 'string' ) {
  482. var args = Array.prototype.slice.call( arguments, 1 );
  483. this.each(function() {
  484. var instance = $.data( this, 'gridrotator' );
  485. if ( !instance ) {
  486. logError( "cannot call methods on gridrotator prior to initialization; " +
  487. "attempted to call method '" + options + "'" );
  488. return;
  489. }
  490. if ( !$.isFunction( instance[options] ) || options.charAt(0) === "_" ) {
  491. logError( "no such method '" + options + "' for gridrotator instance" );
  492. return;
  493. }
  494. instance[ options ].apply( instance, args );
  495. });
  496. }
  497. else {
  498. this.each(function() {
  499. var instance = $.data( this, 'gridrotator' );
  500. if ( instance ) {
  501. instance._init();
  502. }
  503. else {
  504. $.data( this, 'gridrotator', new $.GridRotator( options, this ) );
  505. }
  506. });
  507. }
  508. return this;
  509. };
  510. } )( jQuery, window );
  511. /*!
  512. * jQuery Transit - CSS3 transitions and transformations
  513. * Copyright(c) 2011 Rico Sta. Cruz <rico@ricostacruz.com>
  514. * MIT Licensed.
  515. *
  516. * http://ricostacruz.com/jquery.transit
  517. * http://github.com/rstacruz/jquery.transit
  518. */
  519. (function(d){function k(a){var b=["Moz","Webkit","O","ms"],c=a.charAt(0).toUpperCase()+a.substr(1);if(a in i.style)return a;for(a=0;a<b.length;++a){var d=b[a]+c;if(d in i.style)return d}}function j(a){"string"===typeof a&&this.parse(a);return this}function p(a,b,c){!0===b?a.queue(c):b?a.queue(b,c):c()}function m(a){var b=[];d.each(a,function(a){a=d.camelCase(a);a=d.transit.propertyMap[a]||a;a=r(a);-1===d.inArray(a,b)&&b.push(a)});return b}function q(a,b,c,e){a=m(a);d.cssEase[c]&&(c=d.cssEase[c]);
  520. var h=""+n(b)+" "+c;0<parseInt(e,10)&&(h+=" "+n(e));var f=[];d.each(a,function(a,b){f.push(b+" "+h)});return f.join(", ")}function f(a,b){b||(d.cssNumber[a]=!0);d.transit.propertyMap[a]=e.transform;d.cssHooks[a]={get:function(b){return(d(b).css("transform")||new j).get(a)},set:function(b,e){var h=d(b).css("transform")||new j;h.setFromString(a,e);d(b).css({transform:h})}}}function r(a){return a.replace(/([A-Z])/g,function(a){return"-"+a.toLowerCase()})}function g(a,b){return"string"===typeof a&&!a.match(/^[\-0-9\.]+$/)?
  521. a:""+a+b}function n(a){d.fx.speeds[a]&&(a=d.fx.speeds[a]);return g(a,"ms")}d.transit={version:"0.1.3",propertyMap:{marginLeft:"margin",marginRight:"margin",marginBottom:"margin",marginTop:"margin",paddingLeft:"padding",paddingRight:"padding",paddingBottom:"padding",paddingTop:"padding"},enabled:!0,useTransitionEnd:!1};var i=document.createElement("div"),e={},s=-1<navigator.userAgent.toLowerCase().indexOf("chrome");e.transition=k("transition");e.transitionDelay=k("transitionDelay");e.transform=k("transform");
  522. e.transformOrigin=k("transformOrigin");i.style[e.transform]="";i.style[e.transform]="rotateY(90deg)";e.transform3d=""!==i.style[e.transform];d.extend(d.support,e);var o=e.transitionEnd={MozTransition:"transitionend",OTransition:"oTransitionEnd",WebkitTransition:"webkitTransitionEnd",msTransition:"MSTransitionEnd"}[e.transition]||null,i=null;d.cssEase={_default:"ease","in":"ease-in",out:"ease-out","in-out":"ease-in-out",snap:"cubic-bezier(0,1,.5,1)"};d.cssHooks.transform={get:function(a){return d(a).data("transform")},
  523. set:function(a,b){var c=b;c instanceof j||(c=new j(c));a.style[e.transform]="WebkitTransform"===e.transform&&!s?c.toString(!0):c.toString();d(a).data("transform",c)}};d.cssHooks.transformOrigin={get:function(a){return a.style[e.transformOrigin]},set:function(a,b){a.style[e.transformOrigin]=b}};f("scale");f("translate");f("rotate");f("rotateX");f("rotateY");f("rotate3d");f("perspective");f("skewX");f("skewY");f("x",!0);f("y",!0);j.prototype={setFromString:function(a,b){var c="string"===typeof b?b.split(","):
  524. b.constructor===Array?b:[b];c.unshift(a);j.prototype.set.apply(this,c)},set:function(a){var b=Array.prototype.slice.apply(arguments,[1]);this.setter[a]?this.setter[a].apply(this,b):this[a]=b.join(",")},get:function(a){return this.getter[a]?this.getter[a].apply(this):this[a]||0},setter:{rotate:function(a){this.rotate=g(a,"deg")},rotateX:function(a){this.rotateX=g(a,"deg")},rotateY:function(a){this.rotateY=g(a,"deg")},scale:function(a,b){void 0===b&&(b=a);this.scale=a+","+b},skewX:function(a){this.skewX=
  525. g(a,"deg")},skewY:function(a){this.skewY=g(a,"deg")},perspective:function(a){this.perspective=g(a,"px")},x:function(a){this.set("translate",a,null)},y:function(a){this.set("translate",null,a)},translate:function(a,b){void 0===this._translateX&&(this._translateX=0);void 0===this._translateY&&(this._translateY=0);null!==a&&(this._translateX=g(a,"px"));null!==b&&(this._translateY=g(b,"px"));this.translate=this._translateX+","+this._translateY}},getter:{x:function(){return this._translateX||0},y:function(){return this._translateY||
  526. 0},scale:function(){var a=(this.scale||"1,1").split(",");a[0]&&(a[0]=parseFloat(a[0]));a[1]&&(a[1]=parseFloat(a[1]));return a[0]===a[1]?a[0]:a},rotate3d:function(){for(var a=(this.rotate3d||"0,0,0,0deg").split(","),b=0;3>=b;++b)a[b]&&(a[b]=parseFloat(a[b]));a[3]&&(a[3]=g(a[3],"deg"));return a}},parse:function(a){var b=this;a.replace(/([a-zA-Z0-9]+)\((.*?)\)/g,function(a,d,e){b.setFromString(d,e)})},toString:function(a){var b=[],c;for(c in this)if(this.hasOwnProperty(c)&&(e.transform3d||!("rotateX"===
  527. c||"rotateY"===c||"perspective"===c||"transformOrigin"===c)))"_"!==c[0]&&(a&&"scale"===c?b.push(c+"3d("+this[c]+",1)"):a&&"translate"===c?b.push(c+"3d("+this[c]+",0)"):b.push(c+"("+this[c]+")"));return b.join(" ")}};d.fn.transition=d.fn.transit=function(a,b,c,f){var h=this,g=0,i=!0;"function"===typeof b&&(f=b,b=void 0);"function"===typeof c&&(f=c,c=void 0);"undefined"!==typeof a.easing&&(c=a.easing,delete a.easing);"undefined"!==typeof a.duration&&(b=a.duration,delete a.duration);"undefined"!==typeof a.complete&&
  528. (f=a.complete,delete a.complete);"undefined"!==typeof a.queue&&(i=a.queue,delete a.queue);"undefined"!==typeof a.delay&&(g=a.delay,delete a.delay);"undefined"===typeof b&&(b=d.fx.speeds._default);"undefined"===typeof c&&(c=d.cssEase._default);var b=n(b),j=q(a,b,c,g),l=d.transit.enabled&&e.transition?parseInt(b,10)+parseInt(g,10):0;if(0===l)return p(h,i,function(b){h.css(a);f&&f();b()}),h;var k={},m=function(b){var c=!1,g=function(){c&&h.unbind(o,g);0<l&&h.each(function(){this.style[e.transition]=
  529. k[this]||null});"function"===typeof f&&f.apply(h);"function"===typeof b&&b()};0<l&&o&&d.transit.useTransitionEnd?(c=!0,h.bind(o,g)):window.setTimeout(g,l);h.each(function(){0<l&&(this.style[e.transition]=j);d(this).css(a)})};p(h,i,function(a){var b=0;"MozTransition"===e.transition&&25>b&&(b=25);window.setTimeout(function(){m(a)},b)});return this};d.transit.getTransitionValue=q})(jQuery);