first pass

abc91199 · Jun 28, 2015 · f93490e · f93490e
1 parent 24c2b5e
commit f93490e
Show file tree

Hide file tree

Showing 12 changed files with 154 additions and 28 deletions.
diff --git a/demo.html b/demo.html
@@ -44,7 +44,15 @@
     table.qtreedescription td:nth-child(2n) {
       color: blue;
     }
-    table.qtreedescription {
+    #qtreebuttons {
+      background: #CFD3DD;
+    }
+    #qtreebuttons img {
+      margin-left: 8px;
+      margin-top: 3px;
+      cursor: pointer;
+    }
+    #qtreedescription {
       background: #CFD3DD;
     }
     .rotateHalf {
@@ -218,7 +226,9 @@ <h3>fin-hypergrid-behavior-qtree</h3>This element is a custom Polymer web compon
         </div>
           <core-splitter direction="up"></core-splitter>
           <div flex class="rel">
-              <div class="abs" style="bottom:24px" id="qtreedescription">
+              <div class="abs" style="width:220px;bottom:24px" id="qtreebuttons">
+              </div>
+              <div class="abs" style="left:220px;bottom:24px" id="qtreedescription">
               </div>
               <div class="abs" style="top:24px">
                 <fin-hypergrid class="abs" id="qtree-example">
@@ -382,12 +392,18 @@ <h3>fin-hypergrid-behavior-gol</h3> This element is another custom Polymer web c
             //     return renderer;
             // };
             var descriptionPanel = document.querySelector('#qtreedescription');
+
             var description = '';
+
             setInterval(function(){
                 description = qTreeModel.getTreeStateDescription();
                 descriptionPanel.innerHTML = description;
             }, 500);
 
+            setTimeout(function() {
+                var buttonPanel = document.querySelector('#qtreebuttons');
+                qTreeModel.setButtonBarHolder(buttonPanel);
+            },1000);
         });
 
     })();

diff --git a/fin-hypergrid.dev.html b/fin-hypergrid.dev.html
diff --git a/fin-hypergrid.min.html b/fin-hypergrid.min.html
diff --git a/images/back.png b/images/back.png
diff --git a/images/down.png b/images/down.png
diff --git a/images/forth.png b/images/forth.png
diff --git a/images/pause.png b/images/pause.png
diff --git a/images/swap.png b/images/swap.png
diff --git a/images/up.png b/images/up.png
diff --git a/polymer/js/behaviors/Back b/polymer/js/behaviors/Back
@@ -0,0 +1,9 @@
+Back
+    Collapse
+    Down
+    Expand
+Forth
+Pause
+    Reset
+Swap
+    Up
diff --git a/polymer/js/behaviors/fin-hypergrid-behavior-base.js b/polymer/js/behaviors/fin-hypergrid-behavior-base.js
diff --git a/polymer/js/behaviors/fin-hypergrid-behavior-qtree.js b/polymer/js/behaviors/fin-hypergrid-behavior-qtree.js
@@ -323,12 +323,13 @@
                 //clone[0] = clone[0] + ' ' + sortIndicator;
                 return clone;
             } else {
-                if (this.isColumnReorderable()) {
-                    return [this.getImage('collapse-all'), this.getImage('reset'), this.getImage('expand-all')];
-                    //return [this.getImage('collapse-all'), '®', this.getImage('expand-all')];
-                } else {
-                    return [this.getImage('empty'), this.getImage('reset'), this.getImage('empty')];
-                }
+                // if (this.isColumnReorderable()) {
+                //     return [this.getImage('collapse-all'), this.getImage('reset'), this.getImage('expand-all')];
+                //     //return [this.getImage('collapse-all'), '®', this.getImage('expand-all')];
+                // } else {
+                //     return [this.getImage('empty'), this.getImage('reset'), this.getImage('empty')];
+                // }
+                return '';
             }
         },
 
@@ -1141,7 +1142,49 @@
             }
             result = result + '\n' + data + '</tr></table>';
             return result;
-        }
+        },
+        setButtonBarHolder: function(buttonBarHolder) {
+            this.buttonBarHolder = buttonBarHolder;
+            this.initButtonBar();
+        },
+        initButtonBar: function() {
+            var self = this;
+            var image;
+            var bbh = this.buttonBarHolder;
+            if (!bbh) {
+                return;
+            }
+            bbh.innerHTML = '';
+
+            var action = function(name) {
+                return function() {
+                    self.buttonBarIconClick(name);
+                };
+            };
+            var imageNames = Object.keys(this.block.buttons);
+
+            for (var i = 0; i < imageNames.length; i++) {
+                var name = imageNames[i];
+                image = this.getImage(name.toLowerCase()).cloneNode();
+                bbh.appendChild(image);
+                image.onclick = action(name);
+            }
+        },
+
+        /**
+         * @function
+         * @instance
+         * @description
+         button bar icon has been clicked
+         * @param {string} buttonLabel - button action alias to send to hypertree process
+          */
+        buttonBarIconClick: function(buttonLabel) {
+            var bbClick = {
+                id: this.getNextMessageId(),
+                fn: buttonLabel
+            };
+            this.sendMessage(bbClick);
+        },
 
     });