Merge branch 'master' of github.com:desandro/isotope

_includes/element-partial.html

@@ -1,6 +1,4 @@
-    {% capture a %}{{ element.number | modulus:7 | modulus:2 }}{% endcapture %}
+    {% capture classnames %}{% for cat in element.categories %}{{ cat }} {% endfor %} {% if page.infinite_scroll %} width2 height2 {% endif %} {% endcapture %}
-    {% capture b %}{{ element.number | modulus:3 }}{% endcapture %}
-    {% capture classnames %}{% for cat in element.categories %}{{ cat }} {% endfor %} {% if page.infinite_scroll %} width2 height2 {% else %} {% if a == '1' %} width2 {% endif %} {% if b == '0' %} height2 {% endif %} {% endif %} {% endcapture %}
     <div class="element {{ classnames }}" data-symbol="{{ element.symbol }}" data-category="{{ element.categories[0] }}">
       <p class="number">{{ element.number }}</p>
       <h3 class="symbol">{{ element.symbol }}</h3>

_includes/random-sizes.js

@@ -0,0 +1,10 @@
+
+      // hacky way of adding random size classes
+      $container.find('.element').each(function(){
+        if ( Math.random() > 0.6 ) {
+          $(this).addClass('width2');
+        }
+        if ( Math.random() > 0.6 ) {
+          $(this).addClass('height2');
+        }
+      });

_layouts/elements.html

@@ -58,6 +58,8 @@
       
       var $container = $('#container');
       
+      {% include random-sizes.js %}
+
       $('#filters').find('a').click(function(){
         // get href attribute, minus the #, plus a . to make it a class
         var filterName = '.' + $(this).attr('href').slice(1);

_posts/demos/2010-12-29-layout-modes.html

@@ -29,6 +29,8 @@ related: layouts
       
       var $container = $('#container');
       
+      {% include random-sizes.js %}
+
       {% include layout-change.js %}
 
       {% include option-buttons.js %}

_posts/demos/2010-12-31-relayout.html

@@ -29,6 +29,8 @@ related: methods
       
       var $container = $('#container');
       
+      {% include random-sizes.js %}
+
       // toggle variable sizes of all elements
       $('#toggle-sizes a').click(function(){
         $container

_posts/tests/2011-04-26-item-position-data01.html

@@ -34,6 +34,8 @@ category: tests
     
       var $container = $('#container');
       
+      {% include random-sizes.js %}
+      
       {% include sort-buttons.js %}
 
       // toggle variable sizes of all elements

_posts/tests/2011-05-13-jquery-animation01.html

@@ -61,6 +61,8 @@ category: tests
   
     var $container = $('#container');
     
+    {% include random-sizes.js %}
+    
     {% include sort-buttons.js %}
 
     $('#filters').find('a').click(function(){

_posts/tests/2011-05-18-centered-masonry.html

@@ -119,8 +119,42 @@ category: tests
     
   };
 
+
+  $(function(){
+    
     var $container = $('#container');
     
+    
+    $container.isotope({
+      itemSelector : '.element',
+      masonry : {
+        columnWidth : 120
+      },
+      animationEngine : $.browser.opera ? 'jquery' : 'best-available',
+      getSortData : {
+        symbol : function( $elem ) {
+          return $elem.attr('data-symbol');
+        },
+        category : function( $elem ) {
+          return $elem.attr('data-category');
+        },
+        number : function( $elem ) {
+          return parseInt( $elem.find('.number').text(), 10 );
+        },
+        weight : function( $elem ) {
+          return parseFloat( $elem.find('.weight').text().replace( /[\(\)]/g, '') );
+        },
+        name : function ( $elem ) {
+          return $elem.find('.name').text();
+        }
+      }
+    });
+    
+    
+    {% include random-sizes.js %}
+    
+    {% include sort-buttons.js %}
+    
     $('#filters').find('a').click(function(){
       // get href attribute, minus the #, plus a . to make it a class
       var filterName = '.' + $(this).attr('href').slice(1);
@@ -129,8 +163,6 @@ category: tests
       return false;
     });
 
-  {% include sort-buttons.js %}
-
     // change size of clicked element
     $container.find('.element').live('click', function(){
       $(this).toggleClass('large');
@@ -155,33 +187,5 @@ category: tests
     {% include option-buttons.js %}
     
 
-  $(function(){
-
-    $container.isotope({
-      itemSelector : '.element',
-      masonry : {
-        columnWidth : 120
-      },
-      animationEngine : $.browser.opera ? 'jquery' : 'best-available',
-      getSortData : {
-        symbol : function( $elem ) {
-          return $elem.attr('data-symbol');
-        },
-        category : function( $elem ) {
-          return $elem.attr('data-category');
-        },
-        number : function( $elem ) {
-          return parseInt( $elem.find('.number').text(), 10 );
-        },
-        weight : function( $elem ) {
-          return parseFloat( $elem.find('.weight').text().replace( /[\(\)]/g, '') );
-        },
-        name : function ( $elem ) {
-          return $elem.find('.name').text();
-        }
-      }
-    });
-
-
   });
 </script>