fix: starting at reverse true should now work

convoo · Mar 10, 2017 · cbbf23c · cbbf23c
1 parent aa714e9
commit cbbf23c
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 14 deletions.
diff --git a/README.md b/README.md
@@ -30,7 +30,7 @@ Easily reverse the order of children elements in the dom while maintaining grand
 <link rel="import" href="../../reverse-element/reverse-element.html">
 ```
 
-### Odd number of children
+### Toggleable Reverse Element
 <!--
 ```
 <custom-element-demo>
@@ -70,13 +70,12 @@ Easily reverse the order of children elements in the dom while maintaining grand
 </reverse-element>
 ```
 
-### Even number of children
+### Reversed
 
 <!--
 ```
 <custom-element-demo>
     <template>
-        <link rel="import" href="../paper-toggle-button/paper-toggle-button.html">
         <link rel="import" href="../paper-input/paper-input.html">
         <link rel="import" href="reverse-element.html">
         <div>
@@ -89,9 +88,7 @@ Easily reverse the order of children elements in the dom while maintaining grand
 ```
 -->
 ```html
-<paper-toggle-button checked="{{reverse}}"> Toggle Reverse</paper-toggle-button>
-
-<reverse-element reverse="{{reverse}}">
+<reverse-element reverse>
 <div>
     <h3>First</h3>
     <paper-input label="First"></paper-input>

diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "reverse-element",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Reverses child elements based on property - helpful for accessibility",
   "main": "reverse-element.html",
   "license": "MIT",

diff --git a/demo/index.html b/demo/index.html
@@ -22,7 +22,7 @@
 
 <body>
     <div class="vertical-section-container centered">
-        <h3>Basic odd reverse-element demo</h3>
+        <h3>Toggleable reverse-element demo</h3>
         <demo-snippet>
             <template is="dom-bind">
 
@@ -51,13 +51,10 @@ <h3>
     </div>
 
     <div class="vertical-section-container centered">
-        <h3>Basic even reverse-element demo</h3>
+        <h3>Reversed reverse-element demo</h3>
         <demo-snippet>
             <template is="dom-bind">
-
-                <paper-toggle-button checked="{{reverse2}}" toggles> Toggle Reverse</paper-toggle-button>
-
-                <reverse-element reverse="{{reverse2}}">
+                <reverse-element reverse>
                     <div>
                         <h3>First</h3>
                         <paper-input label="First"></paper-input>

diff --git a/reverse-element.html b/reverse-element.html
@@ -33,7 +33,7 @@
                 },
             },
             _reverse: function (newVal, oldVal) {
-                if (newVal != oldVal && oldVal != undefined) {
+                if ((newVal != oldVal && oldVal != undefined) || (newVal && oldVal==undefined) ) {
                     // loop from the bottom and remove 
                     for (var i = this.childNodes.length - 1; i >= 0; i--) {
                         x = this.removeChild(this.childNodes[i]);