From cfa68c76de8e6d2204ad0034b90b26d425385056 Mon Sep 17 00:00:00 2001
From: Glen Cheney <glen@odopod.com>
Date: Fri, 8 Apr 2016 18:20:03 -0700
Subject: [PATCH] Switch to mocha/chai for tests with gulp-mocha-phantomjs

JSDom's getComputedStyle wasn't working.
---
 _includes/scripts.html                 |   7 +-
 _posts/2014-03-08-bootstrap3-grid.html |   9 +-
 _posts/2014-04-09-requirejs.html       |   6 +-
 dist/shuffle.js                        |  12 +-
 dist/shuffle.min.js                    |   2 +-
 gulp/tasks/set-watching.js             |   2 +
 gulp/tasks/test.js                     |  24 +++
 gulpfile.js                            |   3 +-
 js/page.js                             |  16 +-
 js/require-main.js                     |  21 +-
 package.json                           |  24 +--
 src/shuffle.es6.js                     |  11 +-
 test/preprocessor.js                   |  16 --
 test/runner.html                       |  31 +++
 test/test.js                           | 288 +++++++++++++++++++++++++
 15 files changed, 383 insertions(+), 89 deletions(-)
 create mode 100644 gulp/tasks/test.js
 delete mode 100644 test/preprocessor.js
 create mode 100644 test/runner.html
 create mode 100644 test/test.js

diff --git a/_includes/scripts.html b/_includes/scripts.html
index d3b5263..6362fd6 100644
--- a/_includes/scripts.html
+++ b/_includes/scripts.html
@@ -1,10 +1,5 @@
 {% if page.jquery != false %}
-<!--[if lt IE 9]>
-  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
-<![endif]-->
-<!--[if gte IE 9]><!-->
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
-<!--<![endif]-->
 {% endif %}
 
 {% if page.shuffle != false %}
@@ -19,8 +14,8 @@
 
 <script>var site_url = "{{ site.baseurl }}";</script>
 {% if page.pagejs != false %}
-<script src="{{ site.baseurl }}/js/page.js"></script>
 <script src="{{ site.baseurl }}/js/evenheights.js"></script>
+<script src="{{ site.baseurl }}/js/page.js"></script>
 {% endif %}
 
 {% if page.extraJS && page.extraJS.length %}
diff --git a/_posts/2014-03-08-bootstrap3-grid.html b/_posts/2014-03-08-bootstrap3-grid.html
index 5cbba20..12fcd03 100644
--- a/_posts/2014-03-08-bootstrap3-grid.html
+++ b/_posts/2014-03-08-bootstrap3-grid.html
@@ -3,7 +3,7 @@ layout: default
 title: Bootstrap 3 Grid Demo
 description: Demonstrating how Shuffle can be used with a grid system which uses padding for gutters instead of margins.
 image: /demos/bootstrap3grid.jpg
-externalCSS: [ "http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" ]
+externalCSS: [ "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" ]
 extraJS: [ "demos/padding-grid.js" ]
 ---
 <style>
@@ -32,11 +32,6 @@ extraJS: [ "demos/padding-grid.js" ]
     .grid__brick:nth-child(n+3) {
       margin-top: 15px;
     }
-
-    /* Padding on the grid column is keep it from getting smaller than 30px */
-    .shuffle--fluid .shuffle__sizer {
-      padding: 0;
-    }
   }
 
   .aside {
@@ -54,7 +49,7 @@ extraJS: [ "demos/padding-grid.js" ]
     <div class="col-xs-12">
       <h2>Bootstrap 3 Grid</h2>
       <p>
-        On this page, I have added the minified bootstrap css file from the <a href="http://www.bootstrapcdn.com/">NetDNA CDN</a> (which is also why some of the site-styles are being overriden).
+        On this page, I have added the minified bootstrap css file from the <a href="https://www.bootstrapcdn.com/">Bootstrap CDN</a> (which is also why some of the site-styles are being overriden).
         <br>
         The <a href="http://getbootstrap.com/css/#grid">Bootstrap 3 grid</a> system uses padding for gutters instead of margins. This page demonstrates one way to use Shuffle with these types of grids, as well as showing you don't have to use the full width of the page with Shuffle.
       </p>
diff --git a/_posts/2014-04-09-requirejs.html b/_posts/2014-04-09-requirejs.html
index 92f6095..0d39e2d 100644
--- a/_posts/2014-04-09-requirejs.html
+++ b/_posts/2014-04-09-requirejs.html
@@ -24,7 +24,7 @@ pagejs: false
   }
 
   #grid .img-item {
-    margin-top: 10px;
+    margin-top: 16px;
     margin-left: 0;
   }
 
@@ -37,7 +37,7 @@ pagejs: false
   <div id="grid" class="shuffle--container row">
     {% for item in site.items %}
     <figure class="js-item img-item col-3@sm col-3@xs">
-      <div class="aspect aspect--4x3">
+      <div class="aspect aspect--16x9">
         <div class="aspect__inner">
           <img src="{{ site.baseurl }}/img/{{ item.img }}" alt="{{item.title}}"/>
         </div>
@@ -61,4 +61,4 @@ pagejs: false
 {% include credit-jake.html %}
 
 
-<script data-main="{{ site.baseurl }}/js/require-main.js" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.11/require.min.js"></script>
+<script data-main="{{ site.baseurl }}/js/require-main.js" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.2.0/require.min.js"></script>
diff --git a/dist/shuffle.js b/dist/shuffle.js
index 8b21a5c..11b8fd5 100644
--- a/dist/shuffle.js
+++ b/dist/shuffle.js
@@ -645,10 +645,11 @@ return /******/ (function(modules) { // webpackBootstrap
 	    value: function _dispatch(name) {
 	      var details = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
 	
+	      console.log('dispatch:', name);
 	      details.shuffle = this;
 	      return !this.element.dispatchEvent(new CustomEvent(name, {
-	        bubbles: false,
-	        cancelable: true,
+	        bubbles: true,
+	        cancelable: false,
 	        detail: details
 	      }));
 	    }
@@ -701,6 +702,7 @@ return /******/ (function(modules) { // webpackBootstrap
 	        return;
 	      }
 	
+	      console.log('from:', item.point, 'to:', pos, item.element.id);
 	      item.point = pos;
 	      item.scale = _shuffleItem2.default.Scale.VISIBLE;
 	
@@ -862,6 +864,7 @@ return /******/ (function(modules) { // webpackBootstrap
 	          return;
 	        }
 	
+	        console.log('shrink:', item.element.id);
 	        item.scale = _shuffleItem2.default.Scale.FILTERED;
 	
 	        _this4._queue.push({
@@ -943,6 +946,7 @@ return /******/ (function(modules) { // webpackBootstrap
 	        var reference = {
 	          item: item,
 	          handler: function handler(evt) {
+	            console.log('transition end handler', evt.target === evt.currentTarget, evt.currentTarget.id);
 	            var element = evt.target;
 	
 	            // Make sure this event handler has not bubbled up from a child.
@@ -1009,6 +1013,7 @@ return /******/ (function(modules) { // webpackBootstrap
 	        // Set flag that shuffle is currently in motion.
 	        this.isTransitioning = true;
 	
+	        console.log('transitions to wait for:', promises.length);
 	        Promise.all(promises).then(this._movementFinished.bind(this));
 	
 	        // A call to layout happened, but none of the newly filtered items will
@@ -1385,14 +1390,13 @@ return /******/ (function(modules) { // webpackBootstrap
 	
 	      // Null DOM references
 	      this.items = null;
-	      this.$el = null;
 	      this.options.sizer = null;
 	      this.element = null;
 	      this._transitions = null;
 	
 	      // Set a flag so if a debounced resize has been triggered,
 	      // it can first check if it is actually isDestroyed and not doing anything
-	      this.destroyed = true;
+	      this.isDestroyed = true;
 	    }
 	
 	    /**
diff --git a/dist/shuffle.min.js b/dist/shuffle.min.js
index 3500d9e..0f98e76 100644
--- a/dist/shuffle.min.js
+++ b/dist/shuffle.min.js
@@ -1,2 +1,2 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.shuffle=e():t.shuffle=e()}(this,function(){return function(t){function e(n){if(i[n])return i[n].exports;var s=i[n]={exports:{},id:n,loaded:!1};return t[n].call(s.exports,s,s.exports,e),s.loaded=!0,s.exports}var i={};return e.m=t,e.c=i,e.p="",e(0)}([function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t){return Array.prototype.slice.call(t)}function r(t,e,i){for(var n=0,s=t.length;s>n;n++)if(e.call(i,t[n],n,t)==={})return}function l(t,e,i){return setTimeout(t.bind(e),i)}function a(t){return Math.max.apply(Math,t)}function u(t){return Math.min.apply(Math,t)}function h(t,e){return 2===arguments.length?h(t)(e):function(e){return t.indexOf(e)>-1}}function f(){}var c=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}();i(1);var d=i(2),m=n(d),v=i(3),p=n(v),y=i(4),_=n(y),g=i(5),E=n(g),b=i(6),S=n(b),k=i(8),T=n(k),I=i(9),w=n(I),L=i(10),C=n(L),M=i(12),z=n(M),F=0,D=function(){function t(e){var i=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];if(s(this,t),this.options=(0,_["default"])(t.options,i),this.useSizer=!1,this.revealAppendedDelay=300,this.lastSort={},this.lastFilter=t.ALL_ITEMS,this.isEnabled=!0,this.isDestroyed=!1,this.isInitialized=!1,this._transitions=[],this._isMovementCanceled=!1,this._queue=[],e=this._getElementOption(e),!e)throw new TypeError("Shuffle needs to be initialized with an element.");this.element=e,this.id="shuffle_"+F++,this._dispatch(t.EventType.LOADING),this._init(),l(function(){this.isInitialized=!0,this._dispatch(t.EventType.DONE)},this,16)}return c(t,[{key:"_init",value:function(){this.items=this._getItems(),this.options.sizer=this._getElementOption(this.options.sizer),this.options.sizer&&(this.useSizer=!0),this.element.classList.add(t.ClassName.BASE),this._initItems(),this._onResize=this._getResizeFunction(),window.addEventListener("resize",this._onResize);var e=window.getComputedStyle(this.element,null),i=t.getSize(this.element).width;this._validateStyles(e),this._setColumns(i),this.filter(this.options.group,this.options.initialSort),l(function(){this._setTransitions(),this.element.style.transition="height "+this.options.speed+"ms "+this.options.easing},this)}},{key:"_getResizeFunction",value:function(){var t=this._handleResize.bind(this);return this.options.throttle?this.options.throttle(t,this.options.throttleTime):t}},{key:"_getElementOption",value:function(t){return"string"==typeof t?this.element.querySelector(t):t&&t.nodeType&&1===t.nodeType?t:t&&t.jquery?t[0]:null}},{key:"_validateStyles",value:function(t){"static"===t.position&&(this.element.style.position="relative"),"hidden"!==t.overflow&&(this.element.style.overflow="hidden")}},{key:"_filter",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.lastFilter:arguments[0],e=arguments.length<=1||void 0===arguments[1]?this.items:arguments[1],i=this._getFilteredSets(t,e);return this._toggleFilterClasses(i),this.lastFilter=t,"string"==typeof t&&(this.options.group=t),i}},{key:"_getFilteredSets",value:function(e,i){var n=this,s=[],o=[];return e===t.ALL_ITEMS?s=i:i.forEach(function(t){n._doesPassFilter(e,t)?s.push(t):o.push(t)}),{filtered:s,concealed:o}}},{key:"_doesPassFilter",value:function(e,i){if("function"==typeof e)return e.call(i.element,i.element,this);var n=i.element.getAttribute("data-"+t.FILTER_ATTRIBUTE_KEY),s=JSON.parse(n),o=this.delimeter&&!Array.isArray(s)?s.split(this.delimeter):s;return Array.isArray(e)?e.some(h(o)):h(o,e)}},{key:"_toggleFilterClasses",value:function(t){var e=t.filtered,i=t.concealed;e.forEach(function(t){t.reveal()}),i.forEach(function(t){t.conceal()})}},{key:"_initItems",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.items:arguments[0];t.forEach(function(t){t.init()})}},{key:"_disposeItems",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.items:arguments[0];t.forEach(function(t){t.dispose()})}},{key:"_updateItemCount",value:function(){this.visibleItems=this._getFilteredItems().length}},{key:"_setTransitions",value:function(){var t,e=arguments.length<=0||void 0===arguments[0]?this.items:arguments[0],i=this.options.speed,n=this.options.easing;t=this.options.useTransforms?"transform "+i+"ms "+n+", opacity "+i+"ms "+n:"top "+i+"ms "+n+", left "+i+"ms "+n+", opacity "+i+"ms "+n,e.forEach(function(e){e.element.style.transition=t})}},{key:"_setSequentialDelay",value:function(t){r(t,function(t,e){t.style.transitionDelay="0ms,"+(e+1)*this.options.sequentialFadeDelay+"ms"},this)}},{key:"_getItems",value:function(){var t=this;return o(this.element.children).filter(function(e){return(0,m["default"])(e,t.options.itemSelector)}).map(function(t){return new T["default"](t)})}},{key:"_getFilteredItems",value:function(){return this.items.filter(function(t){return t.isVisible})}},{key:"_getConcealedItems",value:function(){return this.items.filter(function(t){return!t.isVisible})}},{key:"_getColumnSize",value:function(e,i){var n;return n="function"==typeof this.columnWidth?this.columnWidth(e):this.useSizer?t.getSize(this.options.sizer).width:this.columnWidth?this.columnWidth:this.items.length>0?t.getSize(this.items[0].element,!0).width:e,0===n&&(n=e),n+i}},{key:"_getGutterSize",value:function(t){var e;return e="function"==typeof this.options.gutterWidth?this.options.gutterWidth(t):this.useSizer?(0,C["default"])(this.options.sizer,"marginLeft"):this.options.gutterWidth}},{key:"_setColumns",value:function(){var e=arguments.length<=0||void 0===arguments[0]?t.getSize(this.element).width:arguments[0],i=this._getGutterSize(e),n=this._getColumnSize(e,i),s=(e+i)/n;Math.abs(Math.round(s)-s)<this.options.columnThreshold&&(s=Math.round(s)),this.cols=Math.max(Math.floor(s),1),this.containerWidth=e,this.colWidth=n}},{key:"_setContainerSize",value:function(){this.element.style.height=this._getContainerSize()+"px"}},{key:"_getContainerSize",value:function(){return a(this.positions)}},{key:"_dispatch",value:function(t){var e=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];return e.shuffle=this,!this.element.dispatchEvent(new CustomEvent(t,{bubbles:!1,cancelable:!0,detail:e}))}},{key:"_resetCols",value:function(){var t=this.cols;for(this.positions=[];t--;)this.positions.push(0)}},{key:"_layout",value:function(t){r(t,this._layoutItem,this)}},{key:"_layoutItem",value:function(e,i){var n=e.point,s=e.scale,o=t.getSize(e.element,!0),r=this._getItemPosition(o);S["default"].equals(n,r)&&s===T["default"].Scale.VISIBLE||(e.point=r,e.scale=T["default"].Scale.VISIBLE,this._queue.push({item:e,opacity:1,visibility:"visible",transitionDelay:Math.min(i*this.options.staggerAmount,this.options.staggerAmountMax)}))}},{key:"_getItemPosition",value:function(t){for(var e=this._getColumnSpan(t.width,this.colWidth,this.cols),i=this._getColumnSet(e,this.cols),n=this._getShortColumn(i,this.options.buffer),s=new S["default"](Math.round(this.colWidth*n),Math.round(i[n])),o=i[n]+t.height,r=this.cols+1-i.length,l=0;r>l;l++)this.positions[n+l]=o;return s}},{key:"_getColumnSpan",value:function(t,e,i){var n=t/e;return Math.abs(Math.round(n)-n)<this.options.columnThreshold&&(n=Math.round(n)),Math.min(Math.ceil(n),i)}},{key:"_getColumnSet",value:function(t,e){if(1===t)return this.positions;for(var i=e+1-t,n=[],s=0;i>s;s++)n[s]=a(this.positions.slice(s,s+t));return n}},{key:"_getShortColumn",value:function(t,e){for(var i=u(t),n=0,s=t.length;s>n;n++)if(t[n]>=i-e&&t[n]<=i+e)return n;return 0}},{key:"_shrink",value:function(){var t=this,e=arguments.length<=0||void 0===arguments[0]?this._getConcealedItems():arguments[0];r(e,function(e,i){e.scale!==T["default"].Scale.FILTERED&&(e.scale=T["default"].Scale.FILTERED,t._queue.push({item:e,opacity:0,transitionDelay:Math.min(i*t.options.staggerAmount,t.options.staggerAmountMax),callback:function(){e.element.style.visibility="hidden"}}))},this)}},{key:"_handleResize",value:function(){if(this.isEnabled&&!this.isDestroyed){var e=t.getSize(this.element).width;e!==this.containerWidth&&this.update()}}},{key:"_getStylesForTransition",value:function(t){var e=t.item,i={opacity:t.opacity,visibility:t.visibility,transitionDelay:(t.transitionDelay||0)+"ms"},n=e.point.x,s=e.point.y;return this.options.useTransforms?i.transform="translate("+n+"px, "+s+"px) scale("+e.scale+")":(i.left=n+"px",i.top=s+"px"),i}},{key:"_transition",value:function(t){var e=this,i=this,n=this._getStylesForTransition(t),s=t.callfront||f,o=t.callback||f,r=t.item;return new Promise(function(t){var l={item:r,handler:function(e){var n=e.target;n===e.currentTarget&&(n.removeEventListener("transitionend",l.handler),n.style.transitionDelay="",i._removeTransitionReference(l),o(),t())}};s(),r.applyCss(n),e.isInitialized?(r.element.addEventListener("transitionend",l.handler),e._transitions.push(l)):(o(),t())})}},{key:"_processQueue",value:function(){var t=this,e=arguments.length<=0||void 0===arguments[0]?!0:arguments[0];this.isTransitioning&&this._cancelMovement();var i=[],n=[];this._queue.forEach(function(e){t.isInitialized&&0!==t.options.speed?n.push(e):i.push(e)}),this._styleImmediately(i);var s=n.map(function(e){return t._transition(e)});n.length>0&&this.options.speed>0?(this.isTransitioning=!0,Promise.all(s).then(this._movementFinished.bind(this))):e&&l(this._dispatchLayout,this),this._queue.length=0}},{key:"_cancelMovement",value:function(){r(this._transitions,function(t){t.item.element.removeEventListener("transitionend",t.handler)}),this._transitions.length=0,this.isTransitioning=!1}},{key:"_removeTransitionReference",value:function(t){var e=this._transitions.indexOf(t);e>-1&&this._transitions.splice(e,1)}},{key:"_styleImmediately",value:function(e){var i=this;if(e.length){var n=e.map(function(t){return t.item.element});t._skipTransitions(n,function(){e.forEach(function(t){t.item.applyCss(i._getStylesForTransition(t))})})}}},{key:"_movementFinished",value:function(){this.isTransitioning=!1,this._dispatchLayout()}},{key:"_dispatchLayout",value:function(){this._dispatch(t.EventType.LAYOUT)}},{key:"_addItems",value:function(t,e,i){var n=t.map(function(t){return new T["default"](t)});this._initItems(n),this._setTransitions(n),this.items=this.items.concat(n),e?(this._shrink(n),r(this._queue,function(t){t.skipTransition=!0}),this._processQueue(!1),this._addItemsToEnd(n,i)):this.filter(this.lastFilter)}},{key:"_addItemsToEnd",value:function(t,e){var i=this._filter(null,t).filtered,n=i.get();this._updateItemCount(),this._layout(n,!0),e&&this._setSequentialDelay(n),this._revealAppended(n)}},{key:"_revealAppended",value:function(t){l(function(){r(t,function(t){var e=window.jQuery(t);this._transition({$item:e,opacity:1,point:e.data("point"),scale:T["default"].Scale.VISIBLE})},this),this._whenCollectionDone(window.jQuery(t),"transitionend",function(){window.jQuery(t).css("transitionDelay","0ms"),this._movementFinished()})},this,this.revealAppendedDelay)}},{key:"filter",value:function(e,i){this.isEnabled&&((!e||e&&0===e.length)&&(e=t.ALL_ITEMS),this._filter(e),this._shrink(),this._updateItemCount(),this.sort(i))}},{key:"sort",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.lastSort:arguments[0];if(this.isEnabled){this._resetCols();var e=this._getFilteredItems();e=(0,z["default"])(e,t),this._layout(e),this._processQueue(),this._setContainerSize(),this.lastSort=t}}},{key:"update",value:function(t){this.isEnabled&&(t||this._setColumns(),this.sort())}},{key:"layout",value:function(){this.update(!0)}},{key:"add",value:function(t){var e=arguments.length<=1||void 0===arguments[1]?!1:arguments[1],i=arguments.length<=2||void 0===arguments[2]?!0:arguments[2];this._addItems((0,p["default"])(t),e,i)}},{key:"disable",value:function(){this.isEnabled=!1}},{key:"enable",value:function(t){this.isEnabled=!0,t!==!1&&this.update()}},{key:"remove",value:function(e){var i=this;e=(0,p["default"])(e);var n=e.map(function(t){return i.getItemByElement(t)}).filter(function(t){return!!t});if(e.length){var s=function o(){i.element.removeEventListener(t.EventType.LAYOUT,o),i._disposeItems(n),e.forEach(function(t){t.parentNode.removeChild(t)}),i.items=i.items.filter(function(t){return!h(n,t)}),i._updateItemCount(),i._dispatch(t.EventType.REMOVED,{collection:e}),e=null,n=null};this._toggleFilterClasses({filtered:[],concealed:n}),this._shrink(n),this.sort(),this.element.addEventListener(t.EventType.LAYOUT,s)}}},{key:"getItemByElement",value:function(t){for(var e=this.items.length-1;e>=0;e--)if(this.items[e].element===t)return this.items[e];return null}},{key:"destroy",value:function(){window.removeEventListener("resize",this._onResize),this.element.classList.remove("shuffle"),this.element.removeAttribute("style"),this._disposeItems(),this.items=null,this.$el=null,this.options.sizer=null,this.element=null,this._transitions=null,this.destroyed=!0}}],[{key:"getSize",value:function(t,e){var i=window.getComputedStyle(t,null),n=(0,C["default"])(t,"width",i),s=(0,C["default"])(t,"height",i);if(e){var o=(0,C["default"])(t,"marginLeft",i),r=(0,C["default"])(t,"marginRight",i),l=(0,C["default"])(t,"marginTop",i),a=(0,C["default"])(t,"marginBottom",i);n+=o+r,s+=l+a}return{width:n,height:s}}},{key:"_skipTransitions",value:function(t,e){var i="0ms",n=t.map(function(t){var e=t.style,n=e.transitionDuration,s=e.transitionDelay;return e.transitionDuration=i,e.transitionDelay=i,{duration:n,delay:s}});e(),t[0].offsetWidth,t.forEach(function(t,e){t.style.transitionDuration=n[e].duration,t.style.transitionDelay=n[e].delay})}}]),t}();D.ALL_ITEMS="all",D.FILTER_ATTRIBUTE_KEY="groups",D.EventType={LOADING:"shuffle:loading",DONE:"shuffle:done",LAYOUT:"shuffle:layout",REMOVED:"shuffle:removed"},D.ClassName=w["default"],D.options={group:D.ALL_ITEMS,speed:250,easing:"ease",itemSelector:"*",sizer:null,gutterWidth:0,columnWidth:0,delimeter:null,buffer:0,columnThreshold:.01,initialSort:null,throttle:E["default"],throttleTime:300,sequentialFadeDelay:150,staggerAmount:15,staggerAmountMax:250,useTransforms:!0},D.Point=S["default"],D.ShuffleItem=T["default"],D.sorter=z["default"],t.exports=D},function(t,e){try{new window.CustomEvent("test")}catch(i){var n=function(t,e){var i;return e=e||{bubbles:!1,cancelable:!1,detail:void 0},i=document.createEvent("CustomEvent"),i.initCustomEvent(t,e.bubbles,e.cancelable,e.detail),i};n.prototype=window.Event.prototype,window.CustomEvent=n}},function(t,e){"use strict";function i(t,e){if(s)return s.call(t,e);for(var i=t.parentNode.querySelectorAll(e),n=0;n<i.length;n++)if(i[n]==t)return!0;return!1}var n=Element.prototype,s=n.matches||n.matchesSelector||n.webkitMatchesSelector||n.mozMatchesSelector||n.msMatchesSelector||n.oMatchesSelector;t.exports=i},function(t,e){(function(e){"use strict";function i(t){for(var e=[],i=0;i<t.length;i++)-1===e.indexOf(t[i])&&e.push(t[i]);return e}function n(t){var e=new Set;return t.filter(function(t){return e.has(t)?void 0:(e.add(t),!0)})}function s(t){var e=[];return new Set(t).forEach(function(t){e.push(t)}),e}function o(){var t=!1;return new Set([!0]).forEach(function(e){t=e}),t===!0}"Set"in e?"function"==typeof Set.prototype.forEach&&o()?t.exports=s:t.exports=n:t.exports=i}).call(e,function(){return this}())},function(t,e){function i(){for(var t={},e=0;e<arguments.length;e++){var i=arguments[e];for(var s in i)n.call(i,s)&&(t[s]=i[s])}return t}t.exports=i;var n=Object.prototype.hasOwnProperty},function(t,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=function(t,e,i){var n,s,o,r=null,l=0;i||(i={});var a=function(){l=i.leading===!1?0:Date.now(),r=null,o=t.apply(n,s),r||(n=s=null)};return function(){var u=Date.now();l||i.leading!==!1||(l=u);var h=e-(u-l);return n=this,s=arguments,0>=h||h>e?(r&&(clearTimeout(r),r=null),l=u,o=t.apply(n,s),r||(n=s=null)):r||i.trailing===!1||(r=setTimeout(a,h)),o}}},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}Object.defineProperty(e,"__esModule",{value:!0});var s=i(7),o=n(s),r=function(t,e){this.x=(0,o["default"])(t),this.y=(0,o["default"])(e)};r.equals=function(t,e){return t.x===e.x&&t.y===e.y},e["default"]=r},function(t,e){"use strict";function i(t){return parseFloat(t)||0}Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=i},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(e,"__esModule",{value:!0});var o=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}(),r=i(6),l=n(r),a=i(9),u=n(a),h=function(){function t(e){s(this,t),this.element=e,this.isVisible=!0}return o(t,[{key:"reveal",value:function(){this.isVisible=!0,this.element.classList.remove(u["default"].CONCEALED),this.element.classList.add(u["default"].FILTERED)}},{key:"conceal",value:function(){this.isVisible=!1,this.element.classList.remove(u["default"].FILTERED),this.element.classList.add(u["default"].CONCEALED)}},{key:"init",value:function(){this.addClasses([u["default"].SHUFFLE_ITEM,u["default"].FILTERED]),this.applyCss(t.css),this.scale=t.Scale.VISIBLE,this.point=new l["default"]}},{key:"addClasses",value:function(t){var e=this;t.forEach(function(t){e.element.classList.add(t)})}},{key:"removeClasses",value:function(t){var e=this;t.forEach(function(t){e.element.classList.remove(t)})}},{key:"applyCss",value:function(t){var e=this;Object.keys(t).forEach(function(i){e.element.style[i]=t[i]})}},{key:"dispose",value:function(){this.removeClasses([u["default"].CONCEALED,u["default"].FILTERED,u["default"].SHUFFLE_ITEM]),this.element.removeAttribute("style"),this.element=null}}]),t}();h.css={position:"absolute",top:0,left:0,visibility:"visible","will-change":"transform"},h.Scale={VISIBLE:1,FILTERED:.001},e["default"]=h},function(t,e){"use strict";t.exports={BASE:"shuffle",SHUFFLE_ITEM:"shuffle-item",FILTERED:"filtered",CONCEALED:"concealed"}},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t,e){var i=arguments.length<=2||void 0===arguments[2]?window.getComputedStyle(t,null):arguments[2],n=(0,r["default"])(i[e]);return a["default"]||"width"!==e?a["default"]||"height"!==e||(n+=(0,r["default"])(i.paddingTop)+(0,r["default"])(i.paddingBottom)+(0,r["default"])(i.borderTopWidth)+(0,r["default"])(i.borderBottomWidth)):n+=(0,r["default"])(i.paddingLeft)+(0,r["default"])(i.paddingRight)+(0,r["default"])(i.borderLeftWidth)+(0,r["default"])(i.borderRightWidth),n}Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=s;var o=i(7),r=n(o),l=i(11),a=n(l)},function(t,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=document.body||document.documentElement,n=document.createElement("div");n.style.cssText="width:10px;padding:2px;box-sizing:border-box;",i.appendChild(n);var s=window.getComputedStyle(n,null).width,o="10px"===s;i.removeChild(n),e["default"]=o},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t){var e,i,n=t.length;if(!n)return t;for(;--n;)i=Math.floor(Math.random()*(n+1)),e=t[i],t[i]=t[n],t[n]=e;return t}function o(t,e){var i=(0,l["default"])(a,e),n=[].slice.call(t),o=!1;return t.length?i.randomize?s(t):("function"==typeof i.by&&t.sort(function(t,e){if(o)return 0;var n=i.by(t[i.key]),s=i.by(e[i.key]);return void 0===n&&void 0===s?(o=!0,0):s>n||"sortFirst"===n||"sortLast"===s?-1:n>s||"sortLast"===n||"sortFirst"===s?1:0}),o?n:(i.reverse&&t.reverse(),t)):[]}Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=o;var r=i(4),l=n(r),a={reverse:!1,by:null,randomize:!1,key:"element"}}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.shuffle=e():t.shuffle=e()}(this,function(){return function(t){function e(n){if(i[n])return i[n].exports;var s=i[n]={exports:{},id:n,loaded:!1};return t[n].call(s.exports,s,s.exports,e),s.loaded=!0,s.exports}var i={};return e.m=t,e.c=i,e.p="",e(0)}([function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t){return Array.prototype.slice.call(t)}function r(t,e,i){for(var n=0,s=t.length;s>n;n++)if(e.call(i,t[n],n,t)==={})return}function l(t,e,i){return setTimeout(t.bind(e),i)}function a(t){return Math.max.apply(Math,t)}function u(t){return Math.min.apply(Math,t)}function h(t,e){return 2===arguments.length?h(t)(e):function(e){return t.indexOf(e)>-1}}function f(){}var c=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}();i(1);var d=i(2),m=n(d),v=i(3),p=n(v),y=i(4),_=n(y),g=i(5),E=n(g),b=i(6),S=n(b),k=i(8),T=n(k),I=i(9),w=n(I),L=i(10),C=n(L),M=i(12),z=n(M),D=0,F=function(){function t(e){var i=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];if(s(this,t),this.options=(0,_["default"])(t.options,i),this.useSizer=!1,this.revealAppendedDelay=300,this.lastSort={},this.lastFilter=t.ALL_ITEMS,this.isEnabled=!0,this.isDestroyed=!1,this.isInitialized=!1,this._transitions=[],this._isMovementCanceled=!1,this._queue=[],e=this._getElementOption(e),!e)throw new TypeError("Shuffle needs to be initialized with an element.");this.element=e,this.id="shuffle_"+D++,this._dispatch(t.EventType.LOADING),this._init(),l(function(){this.isInitialized=!0,this._dispatch(t.EventType.DONE)},this,16)}return c(t,[{key:"_init",value:function(){this.items=this._getItems(),this.options.sizer=this._getElementOption(this.options.sizer),this.options.sizer&&(this.useSizer=!0),this.element.classList.add(t.ClassName.BASE),this._initItems(),this._onResize=this._getResizeFunction(),window.addEventListener("resize",this._onResize);var e=window.getComputedStyle(this.element,null),i=t.getSize(this.element).width;this._validateStyles(e),this._setColumns(i),this.filter(this.options.group,this.options.initialSort),l(function(){this._setTransitions(),this.element.style.transition="height "+this.options.speed+"ms "+this.options.easing},this)}},{key:"_getResizeFunction",value:function(){var t=this._handleResize.bind(this);return this.options.throttle?this.options.throttle(t,this.options.throttleTime):t}},{key:"_getElementOption",value:function(t){return"string"==typeof t?this.element.querySelector(t):t&&t.nodeType&&1===t.nodeType?t:t&&t.jquery?t[0]:null}},{key:"_validateStyles",value:function(t){"static"===t.position&&(this.element.style.position="relative"),"hidden"!==t.overflow&&(this.element.style.overflow="hidden")}},{key:"_filter",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.lastFilter:arguments[0],e=arguments.length<=1||void 0===arguments[1]?this.items:arguments[1],i=this._getFilteredSets(t,e);return this._toggleFilterClasses(i),this.lastFilter=t,"string"==typeof t&&(this.options.group=t),i}},{key:"_getFilteredSets",value:function(e,i){var n=this,s=[],o=[];return e===t.ALL_ITEMS?s=i:i.forEach(function(t){n._doesPassFilter(e,t)?s.push(t):o.push(t)}),{filtered:s,concealed:o}}},{key:"_doesPassFilter",value:function(e,i){if("function"==typeof e)return e.call(i.element,i.element,this);var n=i.element.getAttribute("data-"+t.FILTER_ATTRIBUTE_KEY),s=JSON.parse(n),o=this.delimeter&&!Array.isArray(s)?s.split(this.delimeter):s;return Array.isArray(e)?e.some(h(o)):h(o,e)}},{key:"_toggleFilterClasses",value:function(t){var e=t.filtered,i=t.concealed;e.forEach(function(t){t.reveal()}),i.forEach(function(t){t.conceal()})}},{key:"_initItems",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.items:arguments[0];t.forEach(function(t){t.init()})}},{key:"_disposeItems",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.items:arguments[0];t.forEach(function(t){t.dispose()})}},{key:"_updateItemCount",value:function(){this.visibleItems=this._getFilteredItems().length}},{key:"_setTransitions",value:function(){var t,e=arguments.length<=0||void 0===arguments[0]?this.items:arguments[0],i=this.options.speed,n=this.options.easing;t=this.options.useTransforms?"transform "+i+"ms "+n+", opacity "+i+"ms "+n:"top "+i+"ms "+n+", left "+i+"ms "+n+", opacity "+i+"ms "+n,e.forEach(function(e){e.element.style.transition=t})}},{key:"_setSequentialDelay",value:function(t){r(t,function(t,e){t.style.transitionDelay="0ms,"+(e+1)*this.options.sequentialFadeDelay+"ms"},this)}},{key:"_getItems",value:function(){var t=this;return o(this.element.children).filter(function(e){return(0,m["default"])(e,t.options.itemSelector)}).map(function(t){return new T["default"](t)})}},{key:"_getFilteredItems",value:function(){return this.items.filter(function(t){return t.isVisible})}},{key:"_getConcealedItems",value:function(){return this.items.filter(function(t){return!t.isVisible})}},{key:"_getColumnSize",value:function(e,i){var n;return n="function"==typeof this.columnWidth?this.columnWidth(e):this.useSizer?t.getSize(this.options.sizer).width:this.columnWidth?this.columnWidth:this.items.length>0?t.getSize(this.items[0].element,!0).width:e,0===n&&(n=e),n+i}},{key:"_getGutterSize",value:function(t){var e;return e="function"==typeof this.options.gutterWidth?this.options.gutterWidth(t):this.useSizer?(0,C["default"])(this.options.sizer,"marginLeft"):this.options.gutterWidth}},{key:"_setColumns",value:function(){var e=arguments.length<=0||void 0===arguments[0]?t.getSize(this.element).width:arguments[0],i=this._getGutterSize(e),n=this._getColumnSize(e,i),s=(e+i)/n;Math.abs(Math.round(s)-s)<this.options.columnThreshold&&(s=Math.round(s)),this.cols=Math.max(Math.floor(s),1),this.containerWidth=e,this.colWidth=n}},{key:"_setContainerSize",value:function(){this.element.style.height=this._getContainerSize()+"px"}},{key:"_getContainerSize",value:function(){return a(this.positions)}},{key:"_dispatch",value:function(t){var e=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];return e.shuffle=this,!this.element.dispatchEvent(new CustomEvent(t,{bubbles:!0,cancelable:!1,detail:e}))}},{key:"_resetCols",value:function(){var t=this.cols;for(this.positions=[];t--;)this.positions.push(0)}},{key:"_layout",value:function(t){r(t,this._layoutItem,this)}},{key:"_layoutItem",value:function(e,i){var n=e.point,s=e.scale,o=t.getSize(e.element,!0),r=this._getItemPosition(o);S["default"].equals(n,r)&&s===T["default"].Scale.VISIBLE||(e.point=r,e.scale=T["default"].Scale.VISIBLE,this._queue.push({item:e,opacity:1,visibility:"visible",transitionDelay:Math.min(i*this.options.staggerAmount,this.options.staggerAmountMax)}))}},{key:"_getItemPosition",value:function(t){for(var e=this._getColumnSpan(t.width,this.colWidth,this.cols),i=this._getColumnSet(e,this.cols),n=this._getShortColumn(i,this.options.buffer),s=new S["default"](Math.round(this.colWidth*n),Math.round(i[n])),o=i[n]+t.height,r=this.cols+1-i.length,l=0;r>l;l++)this.positions[n+l]=o;return s}},{key:"_getColumnSpan",value:function(t,e,i){var n=t/e;return Math.abs(Math.round(n)-n)<this.options.columnThreshold&&(n=Math.round(n)),Math.min(Math.ceil(n),i)}},{key:"_getColumnSet",value:function(t,e){if(1===t)return this.positions;for(var i=e+1-t,n=[],s=0;i>s;s++)n[s]=a(this.positions.slice(s,s+t));return n}},{key:"_getShortColumn",value:function(t,e){for(var i=u(t),n=0,s=t.length;s>n;n++)if(t[n]>=i-e&&t[n]<=i+e)return n;return 0}},{key:"_shrink",value:function(){var t=this,e=arguments.length<=0||void 0===arguments[0]?this._getConcealedItems():arguments[0];r(e,function(e,i){e.scale!==T["default"].Scale.FILTERED&&(e.scale=T["default"].Scale.FILTERED,t._queue.push({item:e,opacity:0,transitionDelay:Math.min(i*t.options.staggerAmount,t.options.staggerAmountMax),callback:function(){e.element.style.visibility="hidden"}}))},this)}},{key:"_handleResize",value:function(){if(this.isEnabled&&!this.isDestroyed){var e=t.getSize(this.element).width;e!==this.containerWidth&&this.update()}}},{key:"_getStylesForTransition",value:function(t){var e=t.item,i={opacity:t.opacity,visibility:t.visibility,transitionDelay:(t.transitionDelay||0)+"ms"},n=e.point.x,s=e.point.y;return this.options.useTransforms?i.transform="translate("+n+"px, "+s+"px) scale("+e.scale+")":(i.left=n+"px",i.top=s+"px"),i}},{key:"_transition",value:function(t){var e=this,i=this,n=this._getStylesForTransition(t),s=t.callfront||f,o=t.callback||f,r=t.item;return new Promise(function(t){var l={item:r,handler:function(e){var n=e.target;n===e.currentTarget&&(n.removeEventListener("transitionend",l.handler),n.style.transitionDelay="",i._removeTransitionReference(l),o(),t())}};s(),r.applyCss(n),e.isInitialized?(r.element.addEventListener("transitionend",l.handler),e._transitions.push(l)):(o(),t())})}},{key:"_processQueue",value:function(){var t=this,e=arguments.length<=0||void 0===arguments[0]?!0:arguments[0];this.isTransitioning&&this._cancelMovement();var i=[],n=[];this._queue.forEach(function(e){t.isInitialized&&0!==t.options.speed?n.push(e):i.push(e)}),this._styleImmediately(i);var s=n.map(function(e){return t._transition(e)});n.length>0&&this.options.speed>0?(this.isTransitioning=!0,Promise.all(s).then(this._movementFinished.bind(this))):e&&l(this._dispatchLayout,this),this._queue.length=0}},{key:"_cancelMovement",value:function(){r(this._transitions,function(t){t.item.element.removeEventListener("transitionend",t.handler)}),this._transitions.length=0,this.isTransitioning=!1}},{key:"_removeTransitionReference",value:function(t){var e=this._transitions.indexOf(t);e>-1&&this._transitions.splice(e,1)}},{key:"_styleImmediately",value:function(e){var i=this;if(e.length){var n=e.map(function(t){return t.item.element});t._skipTransitions(n,function(){e.forEach(function(t){t.item.applyCss(i._getStylesForTransition(t))})})}}},{key:"_movementFinished",value:function(){this.isTransitioning=!1,this._dispatchLayout()}},{key:"_dispatchLayout",value:function(){this._dispatch(t.EventType.LAYOUT)}},{key:"_addItems",value:function(t,e,i){var n=t.map(function(t){return new T["default"](t)});this._initItems(n),this._setTransitions(n),this.items=this.items.concat(n),e?(this._shrink(n),r(this._queue,function(t){t.skipTransition=!0}),this._processQueue(!1),this._addItemsToEnd(n,i)):this.filter(this.lastFilter)}},{key:"_addItemsToEnd",value:function(t,e){var i=this._filter(null,t).filtered,n=i.get();this._updateItemCount(),this._layout(n,!0),e&&this._setSequentialDelay(n),this._revealAppended(n)}},{key:"_revealAppended",value:function(t){l(function(){r(t,function(t){var e=window.jQuery(t);this._transition({$item:e,opacity:1,point:e.data("point"),scale:T["default"].Scale.VISIBLE})},this),this._whenCollectionDone(window.jQuery(t),"transitionend",function(){window.jQuery(t).css("transitionDelay","0ms"),this._movementFinished()})},this,this.revealAppendedDelay)}},{key:"filter",value:function(e,i){this.isEnabled&&((!e||e&&0===e.length)&&(e=t.ALL_ITEMS),this._filter(e),this._shrink(),this._updateItemCount(),this.sort(i))}},{key:"sort",value:function(){var t=arguments.length<=0||void 0===arguments[0]?this.lastSort:arguments[0];if(this.isEnabled){this._resetCols();var e=this._getFilteredItems();e=(0,z["default"])(e,t),this._layout(e),this._processQueue(),this._setContainerSize(),this.lastSort=t}}},{key:"update",value:function(t){this.isEnabled&&(t||this._setColumns(),this.sort())}},{key:"layout",value:function(){this.update(!0)}},{key:"add",value:function(t){var e=arguments.length<=1||void 0===arguments[1]?!1:arguments[1],i=arguments.length<=2||void 0===arguments[2]?!0:arguments[2];this._addItems((0,p["default"])(t),e,i)}},{key:"disable",value:function(){this.isEnabled=!1}},{key:"enable",value:function(t){this.isEnabled=!0,t!==!1&&this.update()}},{key:"remove",value:function(e){var i=this;e=(0,p["default"])(e);var n=e.map(function(t){return i.getItemByElement(t)}).filter(function(t){return!!t});if(e.length){var s=function o(){i.element.removeEventListener(t.EventType.LAYOUT,o),i._disposeItems(n),e.forEach(function(t){t.parentNode.removeChild(t)}),i.items=i.items.filter(function(t){return!h(n,t)}),i._updateItemCount(),i._dispatch(t.EventType.REMOVED,{collection:e}),e=null,n=null};this._toggleFilterClasses({filtered:[],concealed:n}),this._shrink(n),this.sort(),this.element.addEventListener(t.EventType.LAYOUT,s)}}},{key:"getItemByElement",value:function(t){for(var e=this.items.length-1;e>=0;e--)if(this.items[e].element===t)return this.items[e];return null}},{key:"destroy",value:function(){window.removeEventListener("resize",this._onResize),this.element.classList.remove("shuffle"),this.element.removeAttribute("style"),this._disposeItems(),this.items=null,this.options.sizer=null,this.element=null,this._transitions=null,this.isDestroyed=!0}}],[{key:"getSize",value:function(t,e){var i=window.getComputedStyle(t,null),n=(0,C["default"])(t,"width",i),s=(0,C["default"])(t,"height",i);if(e){var o=(0,C["default"])(t,"marginLeft",i),r=(0,C["default"])(t,"marginRight",i),l=(0,C["default"])(t,"marginTop",i),a=(0,C["default"])(t,"marginBottom",i);n+=o+r,s+=l+a}return{width:n,height:s}}},{key:"_skipTransitions",value:function(t,e){var i="0ms",n=t.map(function(t){var e=t.style,n=e.transitionDuration,s=e.transitionDelay;return e.transitionDuration=i,e.transitionDelay=i,{duration:n,delay:s}});e(),t[0].offsetWidth,t.forEach(function(t,e){t.style.transitionDuration=n[e].duration,t.style.transitionDelay=n[e].delay})}}]),t}();F.ALL_ITEMS="all",F.FILTER_ATTRIBUTE_KEY="groups",F.EventType={LOADING:"shuffle:loading",DONE:"shuffle:done",LAYOUT:"shuffle:layout",REMOVED:"shuffle:removed"},F.ClassName=w["default"],F.options={group:F.ALL_ITEMS,speed:250,easing:"ease",itemSelector:"*",sizer:null,gutterWidth:0,columnWidth:0,delimeter:null,buffer:0,columnThreshold:.01,initialSort:null,throttle:E["default"],throttleTime:300,sequentialFadeDelay:150,staggerAmount:15,staggerAmountMax:250,useTransforms:!0},F.Point=S["default"],F.ShuffleItem=T["default"],F.sorter=z["default"],t.exports=F},function(t,e){try{new window.CustomEvent("test")}catch(i){var n=function(t,e){var i;return e=e||{bubbles:!1,cancelable:!1,detail:void 0},i=document.createEvent("CustomEvent"),i.initCustomEvent(t,e.bubbles,e.cancelable,e.detail),i};n.prototype=window.Event.prototype,window.CustomEvent=n}},function(t,e){"use strict";function i(t,e){if(s)return s.call(t,e);for(var i=t.parentNode.querySelectorAll(e),n=0;n<i.length;n++)if(i[n]==t)return!0;return!1}var n=Element.prototype,s=n.matches||n.matchesSelector||n.webkitMatchesSelector||n.mozMatchesSelector||n.msMatchesSelector||n.oMatchesSelector;t.exports=i},function(t,e){(function(e){"use strict";function i(t){for(var e=[],i=0;i<t.length;i++)-1===e.indexOf(t[i])&&e.push(t[i]);return e}function n(t){var e=new Set;return t.filter(function(t){return e.has(t)?void 0:(e.add(t),!0)})}function s(t){var e=[];return new Set(t).forEach(function(t){e.push(t)}),e}function o(){var t=!1;return new Set([!0]).forEach(function(e){t=e}),t===!0}"Set"in e?"function"==typeof Set.prototype.forEach&&o()?t.exports=s:t.exports=n:t.exports=i}).call(e,function(){return this}())},function(t,e){function i(){for(var t={},e=0;e<arguments.length;e++){var i=arguments[e];for(var s in i)n.call(i,s)&&(t[s]=i[s])}return t}t.exports=i;var n=Object.prototype.hasOwnProperty},function(t,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=function(t,e,i){var n,s,o,r=null,l=0;i||(i={});var a=function(){l=i.leading===!1?0:Date.now(),r=null,o=t.apply(n,s),r||(n=s=null)};return function(){var u=Date.now();l||i.leading!==!1||(l=u);var h=e-(u-l);return n=this,s=arguments,0>=h||h>e?(r&&(clearTimeout(r),r=null),l=u,o=t.apply(n,s),r||(n=s=null)):r||i.trailing===!1||(r=setTimeout(a,h)),o}}},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}Object.defineProperty(e,"__esModule",{value:!0});var s=i(7),o=n(s),r=function(t,e){this.x=(0,o["default"])(t),this.y=(0,o["default"])(e)};r.equals=function(t,e){return t.x===e.x&&t.y===e.y},e["default"]=r},function(t,e){"use strict";function i(t){return parseFloat(t)||0}Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=i},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(e,"__esModule",{value:!0});var o=function(){function t(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(e,i,n){return i&&t(e.prototype,i),n&&t(e,n),e}}(),r=i(6),l=n(r),a=i(9),u=n(a),h=function(){function t(e){s(this,t),this.element=e,this.isVisible=!0}return o(t,[{key:"reveal",value:function(){this.isVisible=!0,this.element.classList.remove(u["default"].CONCEALED),this.element.classList.add(u["default"].FILTERED)}},{key:"conceal",value:function(){this.isVisible=!1,this.element.classList.remove(u["default"].FILTERED),this.element.classList.add(u["default"].CONCEALED)}},{key:"init",value:function(){this.addClasses([u["default"].SHUFFLE_ITEM,u["default"].FILTERED]),this.applyCss(t.css),this.scale=t.Scale.VISIBLE,this.point=new l["default"]}},{key:"addClasses",value:function(t){var e=this;t.forEach(function(t){e.element.classList.add(t)})}},{key:"removeClasses",value:function(t){var e=this;t.forEach(function(t){e.element.classList.remove(t)})}},{key:"applyCss",value:function(t){var e=this;Object.keys(t).forEach(function(i){e.element.style[i]=t[i]})}},{key:"dispose",value:function(){this.removeClasses([u["default"].CONCEALED,u["default"].FILTERED,u["default"].SHUFFLE_ITEM]),this.element.removeAttribute("style"),this.element=null}}]),t}();h.css={position:"absolute",top:0,left:0,visibility:"visible","will-change":"transform"},h.Scale={VISIBLE:1,FILTERED:.001},e["default"]=h},function(t,e){"use strict";t.exports={BASE:"shuffle",SHUFFLE_ITEM:"shuffle-item",FILTERED:"filtered",CONCEALED:"concealed"}},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t,e){var i=arguments.length<=2||void 0===arguments[2]?window.getComputedStyle(t,null):arguments[2],n=(0,r["default"])(i[e]);return a["default"]||"width"!==e?a["default"]||"height"!==e||(n+=(0,r["default"])(i.paddingTop)+(0,r["default"])(i.paddingBottom)+(0,r["default"])(i.borderTopWidth)+(0,r["default"])(i.borderBottomWidth)):n+=(0,r["default"])(i.paddingLeft)+(0,r["default"])(i.paddingRight)+(0,r["default"])(i.borderLeftWidth)+(0,r["default"])(i.borderRightWidth),n}Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=s;var o=i(7),r=n(o),l=i(11),a=n(l)},function(t,e){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=document.body||document.documentElement,n=document.createElement("div");n.style.cssText="width:10px;padding:2px;box-sizing:border-box;",i.appendChild(n);var s=window.getComputedStyle(n,null).width,o="10px"===s;i.removeChild(n),e["default"]=o},function(t,e,i){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function s(t){var e,i,n=t.length;if(!n)return t;for(;--n;)i=Math.floor(Math.random()*(n+1)),e=t[i],t[i]=t[n],t[n]=e;return t}function o(t,e){var i=(0,l["default"])(a,e),n=[].slice.call(t),o=!1;return t.length?i.randomize?s(t):("function"==typeof i.by&&t.sort(function(t,e){if(o)return 0;var n=i.by(t[i.key]),s=i.by(e[i.key]);return void 0===n&&void 0===s?(o=!0,0):s>n||"sortFirst"===n||"sortLast"===s?-1:n>s||"sortLast"===n||"sortFirst"===s?1:0}),o?n:(i.reverse&&t.reverse(),t)):[]}Object.defineProperty(e,"__esModule",{value:!0}),e["default"]=o;var r=i(4),l=n(r),a={reverse:!1,by:null,randomize:!1,key:"element"}}])});
 //# sourceMappingURL=shuffle.min.js.map
\ No newline at end of file
diff --git a/gulp/tasks/set-watching.js b/gulp/tasks/set-watching.js
index 76f69ec..7b4397a 100644
--- a/gulp/tasks/set-watching.js
+++ b/gulp/tasks/set-watching.js
@@ -3,9 +3,11 @@
 const gulp = require('gulp');
 const config = require('../config');
 const cssTask = require('./css');
+const testTask = require('./test');
 
 module.exports = function setWatching(done) {
   config.watch = true;
   gulp.watch('_scss/*.scss', cssTask);
+  gulp.watch('test/*', testTask);
   done();
 };
diff --git a/gulp/tasks/test.js b/gulp/tasks/test.js
new file mode 100644
index 0000000..38cfaa0
--- /dev/null
+++ b/gulp/tasks/test.js
@@ -0,0 +1,24 @@
+'use strict';
+
+const gulp = require('gulp');
+const mochaPhantomJS = require('gulp-mocha-phantomjs');
+const config = require('../config');
+
+module.exports = function () {
+  return gulp.src('test/runner.html', {
+    read: false,
+  })
+  .pipe(mochaPhantomJS({
+    phantomjs: {
+      useColors: true,
+    },
+  }))
+
+  // https://github.com/gulpjs/gulp/issues/259#issuecomment-61976830
+  .on('error', function (err) {
+    if (config.watch) {
+      console.error(err.message);
+      this.emit('end');
+    }
+  });
+};
diff --git a/gulpfile.js b/gulpfile.js
index a7324a9..0c75a41 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -6,6 +6,7 @@ gulp.task('scripts', require('./gulp/tasks/compile'));
 gulp.task('set-watching', require('./gulp/tasks/set-watching'));
 gulp.task('css', require('./gulp/tasks/css'));
 gulp.task('jekyll', require('./gulp/tasks/jekyll'));
+gulp.task('test', require('./gulp/tasks/test'));
 
 gulp.task('watch', gulp.series(
   'set-watching',
@@ -13,4 +14,4 @@ gulp.task('watch', gulp.series(
   'jekyll'
 ));
 
-gulp.task('default', gulp.series('scripts'));
+gulp.task('default', gulp.series('scripts', 'test'));
diff --git a/js/page.js b/js/page.js
index 1f953cc..78e43f8 100644
--- a/js/page.js
+++ b/js/page.js
@@ -254,14 +254,10 @@ Modules.Favicon = (function (doc) {
   return Favicon;
 }(document));
 
-document.addEventListener('DOMContentLoaded', function () {
+Modules.NavTray.initialize();
 
-  Modules.NavTray.initialize();
-
-  // Only animate the favicon on the homepage so that
-  // timeline tests aren't filled with junk
-  if (window.location.pathname === '/Shuffle/') {
-    var src = site_url + '/img/favicon-sprite.png';
-    new Modules.Favicon(src, 21, 7, 3000 * 1);
-  }
-});
+// Only animate the favicon on the homepage so that
+// timeline tests aren't filled with junk
+if (window.location.pathname === '/Shuffle/') {
+  new Modules.Favicon(site_url + '/img/favicon-sprite.png', 21, 7, 3000 * 1);
+}
diff --git a/js/require-main.js b/js/require-main.js
index 878fd14..18166df 100644
--- a/js/require-main.js
+++ b/js/require-main.js
@@ -16,30 +16,17 @@ requirejs.config({
 define(function (require) {
   'use strict';
 
-  // Get Shuffle.
-  var Shuffle = require('shuffle');
-
   // Page-level JavaScript used for the demo pages.
   require('evenheights');
   require('page');
 
+  // Get Shuffle.
+  var Shuffle = require('shuffle');
+
   // Create a new shuffle instance.
   var element = document.getElementById('grid');
-  var shuffle = new Shuffle(element, {
+  window.myShuffle = new Shuffle(element, {
     itemSelector: '.js-item',
     sizer: document.getElementById('js-sizer'),
   });
-
-  // DO NOT use this for determining when images load.
-  // See http://vestride.github.io/Shuffle/images/
-  // Use something like imagesLoaded.
-  var imgs = this.element.querySelectorAll('img');
-
-  var handler = function () {
-    shuffle.update();
-  };
-
-  for (var i = imgs.length - 1; i >= 0; i--) {
-    imgs[i].addEventListener('load', handler, false);
-  }
 });
diff --git a/package.json b/package.json
index e55cde4..100ffb4 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,6 @@
   "version": "4.0.0",
   "description": "Categorize, sort, and filter a responsive grid of items",
   "keywords": [
-    "jquery-plugin",
     "gallery",
     "shuffle",
     "layout",
@@ -20,20 +19,7 @@
     "compile": "gulp scripts",
     "css": "gulp css",
     "watch": "gulp watch",
-    "test": "jest"
-  },
-  "jest": {
-    "verbose": true,
-    "scriptPreprocessor": "<rootDir>/test/preprocessor.js",
-    "testDirectoryName": "test",
-    "testPathDirs": [
-      "<rootDir>/test"
-    ],
-    "testPathIgnorePatterns": [
-      "/node_modules/",
-      "preprocessor.js"
-    ],
-    "testRunner": "<rootDir>/node_modules/jest-cli/src/testRunners/jasmine/jasmine2.js"
+    "test": "gulp test"
   },
   "repository": {
     "type": "git",
@@ -54,17 +40,19 @@
   "devDependencies": {
     "autoprefixer": "^6.3.4",
     "babel-core": "^6.5.2",
-    "babel-jest": "^6.0.1",
     "babel-loader": "^6.2.2",
     "babel-preset-es2015": "^6.5.0",
     "babel-register": "^6.5.2",
+    "chai": "^3.5.0",
+    "chai-dom": "^1.4.0",
+    "es6-promise": "^3.1.2",
     "gulp": "gulpjs/gulp.git#4.0",
+    "gulp-mocha-phantomjs": "^0.11.0",
     "gulp-postcss": "^6.1.0",
     "gulp-sass": "^2.2.0",
     "gulp-shell": "^0.5.2",
     "gulp-util": "^3.0.7",
-    "jest-cli": "^0.8.2",
-    "jest-webpack-alias": "^2.2.0",
+    "mocha": "^2.4.5",
     "webpack": "^1.12.13"
   }
 }
diff --git a/src/shuffle.es6.js b/src/shuffle.es6.js
index 6c3880b..77b170e 100644
--- a/src/shuffle.es6.js
+++ b/src/shuffle.es6.js
@@ -476,10 +476,10 @@ class Shuffle {
   _dispatch(name, details = {}) {
     details.shuffle = this;
     return !this.element.dispatchEvent(new CustomEvent(name, {
-        bubbles: false,
-        cancelable: true,
-        detail: details,
-      }));
+      bubbles: true,
+      cancelable: false,
+      detail: details,
+    }));
   }
 
   /**
@@ -1111,14 +1111,13 @@ class Shuffle {
 
     // Null DOM references
     this.items = null;
-    this.$el = null;
     this.options.sizer = null;
     this.element = null;
     this._transitions = null;
 
     // Set a flag so if a debounced resize has been triggered,
     // it can first check if it is actually isDestroyed and not doing anything
-    this.destroyed = true;
+    this.isDestroyed = true;
   }
 
   /**
diff --git a/test/preprocessor.js b/test/preprocessor.js
deleted file mode 100644
index b88277d..0000000
--- a/test/preprocessor.js
+++ /dev/null
@@ -1,16 +0,0 @@
-'use strict';
-
-require('babel-register');
-var babelJest = require('babel-jest');
-var webpackAlias = require('jest-webpack-alias');
-
-module.exports = {
-  process: function (src, filename) {
-    if (filename.indexOf('node_modules') === -1 && filename.match(/\.jsx?$/)) {
-      src = babelJest.process(src, filename);
-      src = webpackAlias.process(src, filename);
-    }
-
-    return src;
-  },
-};
diff --git a/test/runner.html b/test/runner.html
new file mode 100644
index 0000000..f1d891a
--- /dev/null
+++ b/test/runner.html
@@ -0,0 +1,31 @@
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Mocha Tests</title>
+  <link href="../node_modules/mocha/mocha.css" rel="stylesheet" />
+</head>
+<body>
+  <div id="mocha"></div>
+
+  <!-- Polyfills -->
+  <script src="../node_modules/es6-promise/dist/es6-promise.min.js"></script>
+  <script>ES6Promise.polyfill();</script>
+
+  <!-- Testing Framework -->
+  <script src="../node_modules/mocha/mocha.js"></script>
+  <script src="../node_modules/chai/chai.js"></script>
+  <script src="../node_modules/chai-dom/chai-dom.js"></script>
+
+  <!-- Source -->
+  <script src="../dist/shuffle.js"></script>
+
+  <script>mocha.setup('bdd')</script>
+  <script src="test.js"></script>
+
+  <script>
+    mocha.checkLeaks();
+    mocha.globals([]);
+    mocha.run();
+  </script>
+</body>
+</html>
diff --git a/test/test.js b/test/test.js
new file mode 100644
index 0000000..0821749
--- /dev/null
+++ b/test/test.js
@@ -0,0 +1,288 @@
+/* globals describe, it, beforeEach, afterEach */
+/* jshint expr: true */
+
+'use strict';
+
+var expect = window.chai.expect;
+
+describe('shuffle', function () {
+
+  var Shuffle = window.shuffle;
+  var fixtures = {};
+  var fixture;
+  var instance;
+
+  function getFixture(id) {
+    return new Promise(function (resolve, reject) {
+      var xhr = new XMLHttpRequest();
+      xhr.onload = function () {
+        resolve(xhr.responseText);
+      };
+
+      xhr.onerror = reject;
+
+      xhr.open('GET', 'fixtures/' + id + '.html');
+      xhr.send();
+    });
+  }
+
+  function appendFixture(id) {
+
+    function insert(content) {
+      content = content.trim();
+      var holder = document.createElement('div');
+      holder.innerHTML = content;
+      var element = holder.firstChild;
+      document.body.appendChild(element);
+      fixture = element;
+    }
+
+    if (fixtures[id]) {
+      insert(fixtures[id]);
+      return Promise.resolve();
+    } else {
+      return getFixture(id).then(function (html) {
+        fixtures[id] = html;
+        insert(html);
+      });
+    }
+  }
+
+  function cleanup() {
+    if (instance.element) {
+      instance.destroy();
+    }
+
+    if (fixture) {
+      fixture.parentNode.removeChild(fixture);
+    }
+
+    instance = null;
+    fixture = null;
+  }
+
+  function removeFixture(done) {
+    if (instance.isInitialized) {
+      cleanup();
+      done();
+    } else {
+      instance.element.addEventListener(Shuffle.EventType.DONE, function onDone() {
+        instance.element.removeEventListener(Shuffle.EventType.DONE, onDone);
+        cleanup();
+        done();
+      });
+    }
+  }
+
+  function once(element, eventType, fn) {
+    var handler = function (e) {
+      element.removeEventListener(eventType, handler);
+      fn(e);
+    };
+
+    element.addEventListener(eventType, handler);
+  }
+
+  function id(id) {
+    return document.getElementById(id);
+  }
+
+  describe('regular fixture', function () {
+
+    beforeEach(function (done) {
+      appendFixture('regular').then(done);
+    });
+
+    afterEach(removeFixture);
+
+    it('should have default options', function (done) {
+      instance = new Shuffle(fixture);
+      expect(instance.items.length).to.equal(10);
+      expect(instance.visibleItems).to.equal(10);
+      expect(instance.options.group).to.equal('all');
+      expect(instance.options.speed).to.equal(250);
+      expect(instance.options.itemSelector).to.equal('*');
+      expect(instance.options.sizer).to.equal(null);
+      expect(instance.options.columnWidth).to.equal(0);
+      expect(instance.options.gutterWidth).to.equal(0);
+      expect(instance.options.delimeter).to.equal(null);
+      expect(instance.options.initialSort).to.equal(null);
+      expect(instance.options.throttleTime).to.equal(300);
+      expect(instance.options.sequentialFadeDelay).to.equal(150);
+      expect(instance.useSizer).to.equal(false);
+      expect(instance.id).to.equal('shuffle_0');
+
+      expect(instance.isInitialized).to.be.false;
+      instance.element.addEventListener(Shuffle.EventType.DONE, function onDone() {
+        instance.element.removeEventListener(Shuffle.EventType.DONE, onDone);
+        expect(instance.isInitialized).to.be.true;
+        done();
+      });
+    });
+
+    it('should add classes and default styles', function () {
+      instance = new Shuffle(fixture);
+      expect(instance.element).to.have.class('shuffle');
+
+      var styles = window.getComputedStyle(instance.element, null);
+      expect(styles.position).to.equal('relative');
+      expect(styles.overflow).to.equal('hidden');
+      expect(instance.containerWidth).not.to.equal(0);
+
+      instance.items.forEach(function (item) {
+        expect(item.element).to.have.class('shuffle-item');
+        expect(item.element).to.have.class('filtered');
+        expect(item.element.style.opacity).to.be.defined;
+        expect(item.element.style.position).to.equal('absolute');
+        expect(item.element.style.visibility).to.equal('visible');
+        expect(item.isVisible).to.equal(true);
+        expect(item.scale).to.equal(Shuffle.ShuffleItem.Scale.VISIBLE);
+        expect(item.point.x).to.be.defined;
+        expect(item.point.y).to.be.defined;
+      });
+    });
+
+    it('should be 3 columns with gutters', function () {
+      fixture.style.width = '1000px';
+
+      for (var i = 0; i < fixture.children.length; i++) {
+        fixture.children[i].style.width = '300px';
+        fixture.children[i].style.height = '150px';
+      }
+
+      instance = new Shuffle(fixture, {
+        columnWidth: 300,
+        gutterWidth: 50,
+      });
+
+      expect(instance.colWidth).to.equal(350);
+      expect(instance.cols).to.equal(3);
+      expect(instance.positions).to.deep.equal([600, 450, 450]);
+    });
+
+    it('can have a function for columns and gutters', function () {
+      fixture.style.width = '1000px';
+
+      for (var i = 0; i < fixture.children.length; i++) {
+        fixture.children[i].style.width = '300px';
+        fixture.children[i].style.height = '150px';
+      }
+
+      instance = new Shuffle(fixture, {
+        columnWidth: function (containerWidth) {
+          expect(containerWidth).to.equal(1000);
+          return 300;
+        },
+
+        gutterWidth: function () {
+          return 50;
+        },
+      });
+
+      expect(instance._getGutterSize(1000)).to.equal(50);
+      expect(instance._getColumnSize(1000, 50)).to.equal(350);
+      expect(instance.colWidth).to.equal(350);
+      expect(instance.cols).to.equal(3);
+      expect(instance.positions).to.deep.equal([600, 450, 450]);
+    });
+
+    it('can have a function for columns/gutters and span multiple columns', function () {
+      fixture.style.width = '1200px';
+
+      for (var i = 0; i < fixture.children.length; i++) {
+        fixture.children[i].style.width = '300px';
+        fixture.children[i].style.height = '10px';
+      }
+
+      fixture.children[1].style.width = '600px';
+      fixture.children[5].style.width = '600px';
+      fixture.children[6].style.width = '900px';
+
+      instance = new Shuffle(fixture, {
+        columnWidth: function (containerWidth) {
+          expect(containerWidth).to.equal(1200);
+          return 300;
+        },
+
+        gutterWidth: function () {
+          return 0;
+        },
+      });
+
+      expect(instance._getGutterSize(1200)).to.equal(0);
+      expect(instance._getColumnSize(1200, 0)).to.equal(300);
+      expect(instance.colWidth).to.equal(300);
+      expect(instance.cols).to.equal(4);
+      expect(instance.positions).to.deep.equal([40, 40, 30, 30]);
+    });
+
+    /*
+    it('can filter by the data attribute', function (done) {
+      console.log('new');
+      instance = new Shuffle(fixture, {
+        speed: 0,
+      });
+
+      function first() {
+        console.log('1');
+        once(fixture, Shuffle.EventType.LAYOUT, second);
+        console.log('filter. wait.');
+        instance.filter('design');
+      }
+
+      function second() {
+        console.log('2');
+        expect(instance.visibleItems).to.equal(3);
+        var concealed = [3, 4, 5, 6, 7, 8, 10].map(function (num) {
+          return id('item' + num);
+        });
+
+        var filtered = [1, 2, 9].map(function (num) {
+          return id('item' + num);
+        });
+
+        concealed.forEach(function (element) {
+          expect(element).to.have.class(Shuffle.ClassName.CONCEALED);
+          expect(element.style.visibility).to.equal('hidden');
+        });
+
+        filtered.forEach(function (element) {
+          expect(element).to.have.class(Shuffle.ClassName.FILTERED);
+          expect(element.style.visibility).to.equal('visible');
+        });
+
+        once(fixture, Shuffle.EventType.LAYOUT, third);
+
+        // Filter by green.
+        instance.filter('green');
+      }
+
+      function third() {
+        console.log('3');
+        expect(instance.visibleItems).to.equal(2);
+        var concealed = [1, 2, 5, 6, 7, 8, 9, 10].map(function (num) {
+          return id('item' + num);
+        });
+
+        var filtered = [3, 4].map(function (num) {
+          return id('item' + num);
+        });
+
+        concealed.forEach(function (element) {
+          expect(element).to.have.class(Shuffle.ClassName.CONCEALED);
+          expect(element.style.visibility).to.equal('hidden');
+        });
+
+        filtered.forEach(function (element) {
+          expect(element).to.have.class(Shuffle.ClassName.FILTERED);
+          expect(element.style.visibility).to.equal('visible');
+        });
+
+        done();
+      }
+
+      once(fixture, Shuffle.EventType.DONE, first);
+    });
+    */
+  });
+});