Move shuffle.js files to top level. Some nav tweaks.

pull/56/head
Glen Cheney 11 years ago
parent 5277563e95
commit 92239c6e49

@ -7,7 +7,9 @@ exclude: ['./_scss/*.*']
permalink: /:title
url: http://glen.local:4000
_url: http://glen.local:4000
__url: http://localhost:4000
___url: http://vestride.github.io/Shuffle/
defaultTitle: 'Shuffle.js'
defaultDescription: 'Categorize, sort, and filter a responsive grid of items'

@ -6,14 +6,14 @@
<h3 class="site-nav__title">Shuffle.js</h3>
<div class="row-fluid">
<div class="">
<a href="/">Home</a>
<div class="span3">
<a class="btn btn--primary" href="/">Home</a>
</div>
<div class="">
<a href="https://github.com/Vestride/Shuffle">GitHub Repo</a>
<div class="span3">
<a class="btn btn--primary" href="https://github.com/Vestride/Shuffle">GitHub Repo</a>
</div>
<div class="">
<a href="https://twitter.com/Vestride">@Vestride</a>
<div class="span3">
<a class="btn btn--primary" href="https://twitter.com/Vestride">By @Vestride</a>
</div>
</div>

@ -6,7 +6,7 @@
<!--<![endif]-->
<!-- Shuffle! -->
<script src="{{ site.url }}/js/jquery.shuffle.js"></script>
<script src="{{ site.url }}/jquery.shuffle.js"></script>
{% if page.prism %}
<!-- Syntax highlighting via Prism -->

@ -31,6 +31,7 @@ button {
&:hover {
background-color: lighten($wetAsphalt, 12);
text-decoration: none;
}
&.active,
@ -53,8 +54,8 @@ button {
&.active,
&:active {
// background-color: $pumpkin;
background-color: $carrot;
background-color: $pumpkin;
// background-color: $carrot;
}
}

@ -43,6 +43,10 @@ ul ul {
}
}
.btn {
width: 100%;
}
.site-nav__tray {
transition: .2s;
overflow: hidden;

@ -9,10 +9,11 @@ a {
&,
&:visited {
color: $river;
text-decoration: none;
}
&:hover {
text-decoration: none;
text-decoration: underline;
}
&:active {

@ -365,9 +365,10 @@ body {
a, a:visited {
color: #3498db;
text-decoration: none;
}
a:hover {
text-decoration: none;
text-decoration: underline;
}
a:active {
color: #2ecc71;
@ -1929,6 +1930,9 @@ ul ul {
.site-nav .site-nav__title:first-child {
margin-top: 0;
}
.site-nav .btn {
width: 100%;
}
.site-nav .site-nav__tray {
transition: .2s;
overflow: hidden;
@ -2061,6 +2065,7 @@ button {
.btn:hover,
button:hover {
background-color: #4a6885;
text-decoration: none;
}
.btn.active, .btn:active,
button.active,
@ -2080,7 +2085,7 @@ button:active {
background-color: #ea9347;
}
.btn--warning.active, .btn--warning:active {
background-color: #e67e22;
background-color: #d35400;
}
.btn--primary {

@ -120,7 +120,7 @@ prism: true
<h2>Dependencies</h2>
<ul>
<li><a target="_blank" href="http://jquery.com">jQuery</a></li>
<li><a target="_blank" href="http://jquery.com">jQuery 1.9+</a></li>
<li><a target="_blank" href="http://modernizr.com">Modernizr</a>
<ul>
<li>A custom Modernizr build has been included with the plugin.</li>

@ -26,8 +26,8 @@
* Inspired by Isotope http://isotope.metafizzy.co/
* Licensed under the MIT license.
* @author Glen Cheney (http://glencheney.com)
* @version 1.6.6
* @date 06/28/13
* @version 2.0
* @date 07/05/13
*/
(function($, Modernizr, undefined) {

@ -0,0 +1,51 @@
// IMPORTANT!
// If you're already using Modernizr, delete it from this file. If you don't know what Modernizr is, leave it :)
/* Modernizr 2.6.2 (Custom Build) | MIT & BSD
* Build: http://modernizr.com/download/#-csstransforms-csstransforms3d-csstransitions-cssclasses-prefixed-teststyles-testprop-testallprops-prefixes-domprefixes
*/
;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.2",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,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),l.appendChild(j);return f=["&#173;",'<style id="s',h,'">',a,"</style>"].join(""),l.id=h,(m?l:n).innerHTML+=f,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=g.style.overflow,g.style.overflow="hidden",g.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),g.style.overflow=k),!!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.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,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},z(""),i=k=null,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,e.prefixed=function(a,b,c){return b?F(a,b,c):F(a,"pfx")},g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+t.join(" "):""),e}(this,this.document);
// Shuffle Doesn't require this shuffle/debounce plugin, but it works better with it.
/*
* jQuery throttle / debounce - v1.1 - 3/7/2010
* http://benalman.com/projects/jquery-throttle-debounce-plugin/
*
* Copyright (c) 2010 "Cowboy" Ben Alman
* Dual licensed under the MIT and GPL licenses.
* http://benalman.com/about/license/
*/
(function(b,c){var $=b.jQuery||b.Cowboy||(b.Cowboy={}),a;$.throttle=a=function(e,f,j,i){var h,d=0;if(typeof f!=="boolean"){i=j;j=f;f=c}function g(){var o=this,m=+new Date()-d,n=arguments;function l(){d=+new Date();j.apply(o,n)}function k(){h=c}if(i&&!h){l()}h&&clearTimeout(h);if(i===c&&m>e){l()}else{if(f!==true){h=setTimeout(i?k:l,i===c?e-m:e)}}}if($.guid){g.guid=j.guid=j.guid||$.guid++}return g};$.debounce=function(d,e,f){return f===c?a(d,e,false):a(d,f,e!==false)}})(this);
/*!
* jQuery Shuffle Plugin
* Uses CSS Transforms to filter down a grid of items.
* Dependencies: jQuery 1.9+, Modernizr 2.6.2. Optionally throttle/debounce by Ben Alman
* Inspired by Isotope http://isotope.metafizzy.co/
* Licensed under the MIT license.
* @author Glen Cheney (http://glencheney.com)
* @version 2.0
* @date 07/05/13
*/
(function(e,p,h){e.fn.sorted=function(a){var b=e.extend({},e.fn.sorted.defaults,a);a=this.get();var c=!1;if(!a.length)return[];if(b.randomize)return e.fn.sorted.randomize(a);b.by!==e.noop&&(null!==b.by&&b.by!==h)&&a.sort(function(a,f){if(c)return 0;var g=b.by(e(a)),k=b.by(e(f));return g===h&&k===h?(c=!0,0):"sortFirst"===g||"sortLast"===k?-1:"sortLast"===g||"sortFirst"===k?1:g<k?-1:g>k?1:0});if(c)return this.get();b.reverse&&a.reverse();return a};e.fn.sorted.defaults={reverse:!1,by:null,randomize:!1};
e.fn.sorted.randomize=function(a){var b=a.length,c,d;if(!b)return a;for(;--b;)d=Math.floor(Math.random()*(b+1)),c=a[d],a[d]=a[b],a[b]=c;return a};var q=0,l=function(a,b){e.extend(this,l.options,b,l.settings);this.$container=a;this.$window=e(window);this.unique="shuffle_"+q++;this._fire("loading");this._init();this._fire("done")};l.prototype={constructor:l,_init:function(){var a=this,b,c=e.proxy(a._onResize,a);b=a.throttle?a.throttle(a.throttleTime,c):c;c=a.initialSort?a.initialSort:null;a._setVars();
a._resetCols();a._addClasses();a._initItems();a.$window.on("resize.shuffle."+a.unique,b);b=a.$container.css(["paddingLeft","paddingRight","position","width"]);"static"===b.position&&a.$container.css("position","relative");a.offset={left:parseInt(b.paddingLeft,10)||0,top:parseInt(b.paddingTop,10)||0};a._setColumns(parseInt(b.width,10));a.shuffle(a.group,c);a.supported&&setTimeout(function(){a._setTransitions();a.$container[0].style[a.transitionName]="height "+a.speed+"ms "+a.easing},0)},_addClasses:function(){this.$container.addClass("shuffle");
this.$items.addClass("shuffle-item filtered");return this},_setVars:function(){this.$items=this._getItems();this.transitionName=this.prefixed("transition");this.transitionDelayName=this.prefixed("transitionDelay");this.transitionDuration=this.prefixed("transitionDuration");this.transform=this.getPrefixed("transform");this.transitionend={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"}[this.transitionName];
this.isFluid=this.columnWidth&&"function"===typeof this.columnWidth;0===this.columnWidth&&null!==this.sizer&&(this.columnWidth=this.sizer);"string"===typeof this.columnWidth?this.$sizer=this.$container.find(this.columnWidth):this.columnWidth&&this.columnWidth.nodeType&&1===this.columnWidth.nodeType?this.$sizer=e(this.columnWidth):this.columnWidth&&this.columnWidth.jquery&&(this.$sizer=this.columnWidth);this.$sizer&&this.$sizer.length&&(this.useSizer=!0,this.sizer=this.$sizer[0]);return this},_filter:function(a,
b){var c=this,d=b!==h?b:c.$items,f=e();a=a||c.lastFilter;c._fire("filter");e.isFunction(a)?d.each(function(){var b=e(this);a.call(b[0],b,c)&&(f=f.add(b))}):(c.group=a,"all"!==a?d.each(function(){var b=e(this),d=b.data("groups"),d=c.delimeter&&!e.isArray(d)?d.split(c.delimeter):d;-1<e.inArray(a,d)&&(f=f.add(b))}):f=d);c._toggleFilterClasses(d,f);b=d=null;return f},_toggleFilterClasses:function(a,b){a.filter(b).each(function(){var a=e(this);a.hasClass("concealed")&&a.removeClass("concealed");a.hasClass("filtered")||
a.addClass("filtered")});a.not(b).each(function(){var a=e(this);a.hasClass("concealed")||a.addClass("concealed");a.hasClass("filtered")&&a.removeClass("filtered")})},_initItems:function(a){a=a||this.$items;return a.css(this.itemCss)},_updateItemCount:function(){this.visibleItems=this.$items.filter(".filtered").length;return this},_setTransition:function(a){a.style[this.transitionName]=this.transform+" "+this.speed+"ms "+this.easing+", opacity "+this.speed+"ms "+this.easing;return a},_setTransitions:function(a){var b=
this;a=a||b.$items;a.each(function(){b._setTransition(this)});return b},_setSequentialDelay:function(a){var b=this;b.supported&&e.each(a,function(a){this.style[b.transitionDelayName]="0ms,"+(a+1)*b.sequentialFadeDelay+"ms";e(this).one(b.transitionend,function(){this.style[b.transitionDelayName]="0ms"})})},_getItems:function(){return this.$container.children(this.itemSelector)},_getPreciseDimension:function(a,b){var c;c=window.getComputedStyle?window.getComputedStyle(a,null)[b]:e(a).css(b);return parseFloat(c)},
_setColumns:function(a){a=a||this.$container.width();var b="function"===typeof this.gutterWidth?this.gutterWidth(a):this.useSizer?this._getPreciseDimension(this.sizer,"marginLeft"):this.gutterWidth;this.colWidth=(this.colWidth=this.isFluid?this.columnWidth(a):this.useSizer?this._getPreciseDimension(this.sizer,"width"):this.columnWidth||this.$items.outerWidth(!0)||a)||a;this.colWidth+=b;b=(a+b)/this.colWidth;0.01>Math.ceil(b)-b&&(b=Math.ceil(b));this.cols=Math.floor(b);this.cols=Math.max(this.cols,
1);this.containerWidth=a},_setContainerSize:function(){var a=Math.max.apply(Math,this.colYs);this.$container.css("height",a+"px")},_fire:function(a,b){this.$container.trigger(a+".shuffle",b&&b.length?b:[this])},_layout:function(a,b,c,d){var f=this;b=b||f.filterEnd;f.layoutTransitionEnded=!1;e.each(a,function(g){g=e(a[g]);var k=Math.ceil(g.outerWidth(!0)/f.colWidth),k=Math.min(k,f.cols);if(1===k)f._placeItem(g,f.colYs,b,c,d);else{var m=f.cols+1-k,h=[],l,n;for(n=0;n<m;n++)l=f.colYs.slice(n,n+k),h[n]=
Math.max.apply(Math,l);f._placeItem(g,h,b,c,d)}});f._processStyleQueue();f._setContainerSize()},_resetCols:function(){var a=this.cols;for(this.colYs=[];a--;)this.colYs.push(0)},_reLayout:function(a,b){this._resetCols();this.keepSorted&&this.lastSort?this.sort(this.lastSort,!0,b):this._layout(this.$items.filter(".filtered").get(),this.filterEnd,b)},_placeItem:function(a,b,c,d,e){for(var g=Math.min.apply(Math,b),k=0,m=0,h=b.length;m<h;m++)if(b[m]>=g-this.buffer&&b[m]<=g+this.buffer){k=m;break}b=this.colWidth*
k;var l=g;b=Math.round(b+this.offset.left);l=Math.round(l+this.offset.top);a.data({x:b,y:l});g+=a.outerHeight(!0);h=this.cols+1-h;for(m=0;m<h;m++)this.colYs[k+m]=g;a={from:"layout",$this:a,x:b,y:l,scale:1};d?a.skipTransition=!0:(a.opacity=1,a.callback=c);e&&(a.opacity=0);this.styleQueue.push(a)},_shrink:function(a,b){var c=this,d=a||c.$items.filter(".concealed"),f={},g=b||c.shrinkEnd;d.length&&(c._fire("shrink"),c.shrinkTransitionEnded=!1,d.each(function(){var a=e(this),b=a.data();f={from:"shrink",
$this:a,x:b.x,y:b.y,scale:0.001,opacity:0,callback:g};c.styleQueue.push(f)}))},_onResize:function(){var a;this.enabled&&!this.destroyed&&(a=this.$container.width(),a!==this.containerWidth&&this.resized())},setPrefixedCss:function(a,b,c){a.css(this.prefixed(b),c)},getPrefixed:function(a){return(a=this.prefixed(a))?a.replace(/([A-Z])/g,function(a,c){return"-"+c.toLowerCase()}).replace(/^ms-/,"-ms-"):a},transition:function(a){var b=this,c,d=function(){b.layoutTransitionEnded||"layout"!==a.from?b.shrinkTransitionEnded||
"shrink"!==a.from||(a.callback.call(b),b.shrinkTransitionEnded=!0):(b._fire("layout"),a.callback.call(b),b.layoutTransitionEnded=!0)};a.callback=a.callback||e.noop;b.supported?(a.scale===h&&(a.scale=1),c=b.threeD?"translate3d("+a.x+"px, "+a.y+"px, 0) scale3d("+a.scale+", "+a.scale+", 1)":"translate("+a.x+"px, "+a.y+"px) scale("+a.scale+", "+a.scale+")",a.x!==h&&b.setPrefixedCss(a.$this,"transform",c),a.opacity!==h&&a.$this.css("opacity",a.opacity),a.$this.one(b.transitionend,d)):(c={left:a.x,top:a.y,
opacity:a.opacity},a.$this.stop(!0).animate(c,b.speed,"swing",d))},_processStyleQueue:function(){var a=this;e.each(a.styleQueue,function(b,c){c.skipTransition?a._skipTransition(c.$this[0],function(){a.transition(c)}):a.transition(c)});a.styleQueue.length=0},shrinkEnd:function(){this._fire("shrunk")},filterEnd:function(){this._fire("filtered")},sortEnd:function(){this._fire("sorted")},_skipTransition:function(a,b,c){var d=this.transitionDuration,f=a.style[d];a.style[d]="0ms";e.isFunction(b)?b():a.style[b]=
c;a.style[d]=f},_addItems:function(a,b,c){var d;this.supported||(b=!1);a.addClass("shuffle-item");this._initItems(a);this._setTransitions(a);this.$items=this._getItems();a.css("opacity",0);a=this._filter(h,a);d=a.get();this._updateItemCount();b?(this._layout(d,null,!0,!0),c&&this._setSequentialDelay(a),this._revealAppended(a)):this._layout(d)},_revealAppended:function(a){var b=this;setTimeout(function(){a.each(function(a,d){b.transition({from:"reveal",$this:e(d),opacity:1})})},b.revealAppendedDelay)},
shuffle:function(a,b){this.enabled&&(a||(a="all"),this._filter(a),this.lastFilter=a,this._updateItemCount(),this._resetCols(),this._shrink(),b&&(this.lastSort=b),this._reLayout())},sort:function(a,b,c){var d=this,e=d.$items.filter(".filtered").sorted(a);b||d._resetCols();d._layout(e,function(){b&&d.filterEnd();d.sortEnd()},c);d.lastSort=a},resized:function(a){this.enabled&&(a||this._setColumns(),this._reLayout())},layout:function(){this.update(!0)},update:function(a){this.resized(a)},appended:function(a,
b,c){this._addItems(a,!1===b?!1:!0,!1===c?!1:!0)},disable:function(){this.enabled=!1},enable:function(a){this.enabled=!0;!1!==a&&this.update()},remove:function(a){if(a.length&&a.jquery)return this._shrink(a,function(){var b=this;a.remove();setTimeout(function(){b.$items=b._getItems();b.layout();b._updateItemCount();b._fire("removed",[a,b]);a=null},0)}),this._processStyleQueue(),this},destroy:function(){this.$window.off("."+this.unique);this.$container.removeClass("shuffle").removeAttr("style").removeData("shuffle");
this.$items.removeAttr("style").removeClass("concealed filtered shuffle-item");this.destroyed=!0}};l.options={group:"all",speed:250,easing:"ease-out",itemSelector:"",sizer:null,gutterWidth:0,columnWidth:0,delimeter:null,buffer:0,initialSort:null,throttle:e.throttle||null,throttleTime:300,sequentialFadeDelay:150,supported:p.csstransforms&&p.csstransitions};l.settings={$sizer:null,useSizer:!1,itemCss:{position:"absolute",top:0,left:0},revealAppendedDelay:300,keepSorted:!0,enabled:!0,destroyed:!1,styleQueue:[],
prefixed:p.prefixed,threeD:p.csstransforms3d};e.fn.shuffle=function(a){var b=Array.prototype.slice.call(arguments,1);return this.each(function(){var c=e(this),d=c.data("shuffle");d||(d=new l(c,a),c.data("shuffle",d));"string"===typeof a&&d[a]&&d[a].apply(d,b)})}})(jQuery,Modernizr);

@ -1,28 +0,0 @@
// IMPORTANT!
// If you're already using Modernizr, delete it from this file. If you don't know what Modernizr is, leave it :)
/* Modernizr 2.6.2 (Custom Build) | MIT & BSD
* Build: http://modernizr.com/download/#-csstransforms-csstransforms3d-csstransitions-prefixed-teststyles-testprop-testallprops-prefixes-domprefixes
*/
;window.Modernizr=function(a,b,c){function y(a){i.cssText=a}function z(a,b){return y(l.join(a+";")+(b||""))}function A(a,b){return typeof a===b}function B(a,b){return!!~(""+a).indexOf(b)}function C(a,b){for(var d in a){var e=a[d];if(!B(e,"-")&&i[e]!==c)return b=="pfx"?e:!0}return!1}function D(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:A(f,"function")?f.bind(d||b):f}return!1}function E(a,b,c){var d=a.charAt(0).toUpperCase()+a.slice(1),e=(a+" "+n.join(d+" ")+d).split(" ");return A(b,"string")||A(b,"undefined")?C(e,b):(e=(a+" "+o.join(d+" ")+d).split(" "),D(e,b,c))}var d="2.6.2",e={},f=b.documentElement,g="modernizr",h=b.createElement(g),i=h.style,j,k={}.toString,l=" -webkit- -moz- -o- -ms- ".split(" "),m="Webkit Moz O ms",n=m.split(" "),o=m.toLowerCase().split(" "),p={},q={},r={},s=[],t=s.slice,u,v=function(a,c,d,e){var h,i,j,k,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:g+(d+1),l.appendChild(j);return h=["&#173;",'<style id="s',g,'">',a,"</style>"].join(""),l.id=g,(m?l:n).innerHTML+=h,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=f.style.overflow,f.style.overflow="hidden",f.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),f.style.overflow=k),!!i},w={}.hasOwnProperty,x;!A(w,"undefined")&&!A(w.call,"undefined")?x=function(a,b){return w.call(a,b)}:x=function(a,b){return b in a&&A(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=t.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(t.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(t.call(arguments)))};return e}),p.csstransforms=function(){return!!E("transform")},p.csstransforms3d=function(){var a=!!E("perspective");return a&&"webkitPerspective"in f.style&&v("@media (transform-3d),(-webkit-transform-3d){#modernizr{left:9px;position:absolute;height:3px;}}",function(b,c){a=b.offsetLeft===9&&b.offsetHeight===3}),a},p.csstransitions=function(){return E("transition")};for(var F in p)x(p,F)&&(u=F.toLowerCase(),e[u]=p[F](),s.push((e[u]?"":"no-")+u));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)x(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof enableClasses!="undefined"&&enableClasses&&(f.className+=" "+(b?"":"no-")+a),e[a]=b}return e},y(""),h=j=null,e._version=d,e._prefixes=l,e._domPrefixes=o,e._cssomPrefixes=n,e.testProp=function(a){return C([a])},e.testAllProps=E,e.testStyles=v,e.prefixed=function(a,b,c){return b?E(a,b,c):E(a,"pfx")},e}(this,this.document);
/**
* jQuery Shuffle Plugin
* Uses CSS Transforms to filter down a grid of items (degrades to jQuery's animate).
* Inspired by Isotope http://isotope.metafizzy.co/
* Use it for whatever you want!
* @author Glen Cheney (http://glencheney.com)
* @version 1.5.2
* @date 10/24/12
*/
;(function(d,g){d.fn.sorted=function(b){var c=d.extend({},d.fn.sorted.defaults,b),b=this.get();c.by!==d.noop&&(null!==c.by&&void 0!==c.by)&&b.sort(function(a,b){var f=c.by(d(a)),h=c.by(d(b));return f<h?-1:f>h?1:0});c.reverse&&b.reverse();return b};d.fn.sorted.defaults={reverse:!1,by:null};var i=function(b,c){var a=this;d.extend(a,d.fn.shuffle.options,c,d.fn.shuffle.settings);a.$container=b;a.$items=a.$container.children();a.$item=a.$items.first();a.marginTop=parseInt(a.$item.css("marginTop"),10);a.marginRight=
parseInt(a.$item.css("marginRight"),10);a.transitionName=a.prefixed("transition");a.transform=a.getPrefixed("transform");a.transitionEndName={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"}[a.transitionName];a.itemCss={position:"absolute",top:0,left:0,opacity:1};a.$container.css("position","relative").get(0).style[a.transitionName]="height "+a.speed+"ms "+a.easing;a.$items.each(function(){d(this).css(a.itemCss);
a.supported&&(this.style[a.transitionName]=a.transform+" "+a.speed+"ms "+a.easing+", opacity "+a.speed+"ms "+a.easing);this.style.marginTop=0;this.style.marginRight=0});a.itemWidth=a.$item.outerWidth();a.itemHeight=a.$item.outerHeight();a.itemsPerRow=a.getItemsPerRow();a.windowHeight=d(window).height();a.windowWidth=d(window).width();d(window).on("resize.shuffle",function(){var b=d(window).height(),c=d(window).width();if(c!==a.windowWidth||b!==a.windowHeight)a.resized(),a.windowHeight=b,a.windowWidth=
c});if(0===a.itemWidth||0===a.itemHeight)d(window).on("load.shuffle",function(){a.itemWidth=a.$item.outerWidth();a.itemHeight=a.$item.outerHeight();a.itemsPerRow=a.getItemsPerRow();a.shuffle(a.group)});else a.shuffle(a.group)};i.prototype={constructor:i,shuffle:function(b){var c=this;b||(b="all");c.$items.removeClass("concealed filtered");d.isFunction(b)?c.$items.each(function(){var a=d(this);a.addClass(b(a,c)?"filtered":"concealed")}):(c.group=b,"all"!==b?c.$items.each(function(){var a=d(this).data("groups");
-1===d.inArray(b,a)?d(this).addClass("concealed"):d(this).addClass("filtered")}):c.$items.addClass("filtered"));c.visibleItems=c.$items.filter(".filtered").length;c.fire("shrink");c.shrink();c.fire("filter");c.filter();c.resizeContainer()},getItemsPerRow:function(){var b=this.$container.width(),c=Math.floor(b/this.itemWidth);c*(this.itemWidth+this.marginRight)-this.marginRight>b&&(c-=1);return c},resizeContainer:function(){var b=Math.ceil(this.visibleItems/this.itemsPerRow)*(this.itemHeight+this.marginTop)-
this.marginTop;this.$container.css("height",b+"px")},fire:function(b){this.$container.trigger(b+".shuffle",[this])},shrink:function(){var b=this,c=b.$items.filter(".concealed");0!==c.length&&(b.shrinkTransitionEnded=!1,c.each(function(){var a=d(this),c=parseInt(a.attr("data-x"),10),f=parseInt(a.attr("data-y"),10);c||(c=0);f||(f=0);b.transition({from:"shrink",$this:a,x:c,y:f,left:c+b.itemWidth/2+"px",top:f+b.itemHeight/2+"px",scale:0.001,opacity:0,height:"0px",width:"0px",callback:b.shrinkEnd})}))},
layout:function(b,c){var a=this,e=0;0!==b.length&&(a.layoutTransitionEnded=!1,d.each(b,function(f){var h=d(b[f]),g=f%a.itemsPerRow*(a.itemWidth+a.marginRight),i=Math.floor(f/a.itemsPerRow);0===f%a.itemsPerRow&&(e=i*(a.itemHeight+a.marginTop));h.attr({"data-x":g,"data-y":e});a.transition({from:"layout",$this:h,x:g,y:e,left:g+"px",top:e+"px",scale:1,opacity:1,height:a.itemHeight+"px",width:a.itemWidth+"px",callback:c})}))},filter:function(){if(this.keepSorted&&this.lastSort)this.sort(this.lastSort,
!0);else{var b=this.$items.filter(".filtered").get();this.layout(b,this.filterEnd)}},sort:function(b,c){var a=this,d=a.$items.filter(".filtered").sorted(b);a.layout(d,function(){c&&a.filterEnd();a.sortEnd()});a.lastSort=b},setPrefixedCss:function(b,c,a){b.css(this.prefixed(c),a)},getPrefixed:function(b){return(b=this.prefixed(b))?b.replace(/([A-Z])/g,function(b,a){return"-"+a.toLowerCase()}).replace(/^ms-/,"-ms-"):b},transition:function(b){var c=this,a,d=function(){!c.layoutTransitionEnded&&"layout"===
b.from?(b.callback.call(c),c.layoutTransitionEnded=!0):!c.shrinkTransitionEnded&&"shrink"===b.from&&(b.callback.call(c),c.shrinkTransitionEnded=!0)};c.supported?(a=c.threeD?"translate3d("+b.x+"px, "+b.y+"px, 0) scale3d("+b.scale+", "+b.scale+", 1)":"translate("+b.x+"px, "+b.y+"px) scale("+b.scale+", "+b.scale+")",b.$this.css("opacity",b.opacity),c.setPrefixedCss(b.$this,"transform",a),b.$this.one(c.transitionEndName,d)):b.$this.stop().animate({left:b.left,top:b.top,opacity:b.opacity,height:b.height,
width:b.width},c.speed,"swing",d)},resized:function(){this.itemWidth=this.$items.filter(".filtered").outerWidth();this.itemHeight=this.$items.filter(".filtered").outerHeight();this.itemsPerRow=this.getItemsPerRow();this.filter();this.resizeContainer()},shrinkEnd:function(){this.fire("shrunk")},filterEnd:function(){this.fire("filtered")},sortEnd:function(){this.fire("sorted")},destroy:function(){this.$container.removeAttr("style").removeData("shuffle");d(window).off(".shuffle");this.$items.removeAttr("style data-y data-x").removeClass("concealed filtered")}};
d.fn.shuffle=function(b,c){return this.each(function(){var a=d(this),e=a.data("shuffle");e||(e=new i(a,b),a.data("shuffle",e));d.isFunction(b)?e.shuffle(b):"string"===typeof b&&("sort"===b?e.sort(c):"destroy"===b?e.destroy():e.shuffle(b))})};d.fn.shuffle.options={group:"all",speed:800,easing:"ease-out",keepSorted:!0};d.fn.shuffle.settings={supported:g.csstransforms&&g.csstransitions,prefixed:g.prefixed,threeD:g.csstransforms3d}})(jQuery,Modernizr);

@ -5,7 +5,7 @@
var Modules = {};
Modules.Support = (function() {
Modules.Support = (function( $ ) {
'use strict';
var self = {},
@ -49,7 +49,7 @@ Modules.Support = (function() {
window.requestAnimationFrame = rAF;
return self;
}());
}( jQuery ));
Modules.Polyfill = (function( $, Support ) {
@ -223,7 +223,8 @@ Modules.Favicon = (function( doc ) {
}
self.currentFrame = 0;
self.thirtyFPS = 1000 / 30;
// Chrome chokes on this. It looks like it can handle 4 frames per second
self.fps = 24;
self.init();
};
@ -270,12 +271,11 @@ Modules.Favicon = (function( doc ) {
// Request Animation Frame Loop
Favicon.prototype.loop = function( timestamp ) {
var self = this,
lastCall = self.lastTimestamp;
var self = this;
// If not enough time has elapse since the last call
// immediately call the next rAF
if ( timestamp - lastCall < self.timeToElapse ) {
if ( timestamp - self.lastExecuted < self.timeToElapse ) {
return requestAnimationFrame( self.loop.bind( self ) );
}
@ -288,7 +288,7 @@ Modules.Favicon = (function( doc ) {
// Completed an animation state
self.timeToElapse = self.currentFrame % self.framesPerAnimation === 0 ?
self.animationDelay :
self.thirtyFPS;
1000 / self.fps;
// Draw current frame from sprite
self.sprite.drawFrame( self.currentFrame );
@ -297,7 +297,7 @@ Modules.Favicon = (function( doc ) {
self.setFavicon();
// Set a timeout to draw again
self.lastTimestamp = timestamp;
self.lastExecuted = timestamp;
// Continue loop
return requestAnimationFrame( self.loop.bind( self ) );

@ -1,9 +1,18 @@
# Shuffle 2.0
# [Shuffle](http://vestride.github.io/Shuffle)
Categorize, sort, and filter a responsive grid of items
## Docs and Demos
[All found here](http://vestride.github.io/Shuffle)
## Shuffle 2.0
This is a large improvement to shuffle. Most notably, the ability for [masonry](http://masonry.desandro.com) layouts. Other additions include adding/removing items, enabling/disabling, multiple instances on a page, and more!
## Running locally
This project uses [Jekyll](http://jekyllrb.com/), so head over to [their quickstart guide](http://jekyllrb.com/docs/quickstart/) to get set up.
## Improvements
## Improvements still to make
* FAQ page
* Use Deferred objects for callbacks
* Custom animations
* Horizontal layout
Inspired by [Isotope](http://isotope.metafizzy.co/) and [Packery](http://packery.metafizzy.co/).
Loading…
Cancel
Save