--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/enmi12/glossaire/_posts/demos/2011-01-02-adding-items.html	Wed Nov 06 03:21:17 2013 +0000
@@ -0,0 +1,61 @@
+---
+title: Adding items
+layout: default
+category: demos
+---
+
+  <section id="copy">
+    <p>The <code>insert</code> method will append, add items to the widget, filter, sort, and then layout all items</p>
+    <p>The <code>appended</code> method adds items to the widget, and then lays out only the new items.</p>
+    <p>The <code>reloadItems</code> method re-collects all items in their current order in the DOM, which can be useful for prepending items.</p>
+    <p>See docs on <a href="../docs/adding-items.html">adding items</a>.</p>
+  </section>
+
+  <section id="options">
+    <ul class="clearfix">
+      <li id="insert"><a href="#insert">Insert new elements</a></li>
+      <li id="append"><a href='#append'>Append new elements</a></li>
+      <li id="prepend"><a href='#prepend'>Prepend</a></li>
+    </ul>
+  </section>
+
+  <div id="container" class="clearfix">
+    {% for elem_number in site.best_of_order :limit 10 %}
+      {% assign element = site.elements[elem_number] %}
+      {% include element-partial.html %}
+    {% endfor %}
+  </div> <!-- #container -->
+
+  <script src="../{{ site.jquery_js }}"></script>
+  <script src="../{{ site.isotope_js }}"></script>
+  <script src="../js/fake-element.js"></script>
+  <script>
+    $(function(){
+      
+      var $container = $('#container');
+
+      {% include add-buttons.js %}
+
+      $('#prepend a').click(function(){
+        var $newEls = $( fakeElement.getGroup() );
+        $container
+          .prepend( $newEls ).isotope('reloadItems').isotope({ sortBy: 'original-order' })
+          // set sort back to symbol for inserting
+          .isotope('option', { sortBy: 'symbol' });
+
+        return false;
+      });
+
+      $container.isotope({
+        itemSelector : '.element',
+        filter: '*',
+        getSortData : {
+          symbol : function( $elem ) {
+            return $elem.attr('data-symbol');
+          }
+        },
+        sortBy : 'symbol'
+      });
+    
+    });
+  </script>
\ No newline at end of file