Update l2t-paper-color-dialog.html

Link2Twenty · Jun 2, 2017 · cd8a05b · cd8a05b
1 parent 8113d8f
commit cd8a05b
Showing 1 changed file with 34 additions and 1 deletion.
diff --git a/l2t-paper-color-dialog.html b/l2t-paper-color-dialog.html
@@ -51,7 +51,8 @@
         display: flex;
         justify-content: center;
         position: relative;
-        overflow: auto;
+        overflow-x: hidden;
+        overflow-y: auto;
         height: 100%;
         width: 100%;
         padding-top: 12px;
@@ -130,6 +131,18 @@
         };
       }
       /**
+      * _hideSections: hide all sections
+      */
+      _hideSections() {
+        var sections = this.shadowRoot.querySelectorAll('section');
+        var toggleButton = this.shadowRoot.querySelector('.advance-toggle');
+
+        for(let i = 0; i < sections.length; i++){
+          sections[i].removeAttribute('active');
+        }
+        toggleButton.innerHTML = "";
+      }
+      /**
       * _toggleSection: changes between advanced and basic state
       */
       _toggleSection() {
@@ -161,6 +174,26 @@
       open() {
         this.shadowRoot.querySelector('paper-dialog').open();
       }
+      /**
+      * setBasic: method to open the dialog
+      */
+      setBasic() {
+        this._hideSections();
+        var section = this.shadowRoot.querySelector('section.picker');
+        var toggleButton = this.shadowRoot.querySelector('.advance-toggle');
+        section.setAttribute('active',"");
+        toggleButton.innerHTML = "Advanced";
+      }
+      /**
+      * setAdvanced: method to open the dialog
+      */
+      setAdvanced() {
+        this._hideSections();
+        var section = this.shadowRoot.querySelector('section.advanced');
+        var toggleButton = this.shadowRoot.querySelector('.advance-toggle');
+        section.setAttribute('active',"");
+        toggleButton.innerHTML = "Basic";
+      }
     }
 
     window.customElements.define(L2tPaperColorDialog.is, L2tPaperColorDialog);