Web Inspector: Add a hidden property to TreeOutline
https://bugs.webkit.org/show_bug.cgi?id=152014

Reviewed by Timothy Hatcher.

* UserInterface/Views/NavigationSidebarPanel.js:
Removed static property for "hidden" CSS class. No longer used.
(WebInspector.NavigationSidebarPanel.prototype.set contentTreeOutline):
Fixed bug in order of visibleTreeOutlines add/remove.
(WebInspector.NavigationSidebarPanel.prototype.createContentTreeOutline):

* UserInterface/Views/TimelineSidebarPanel.js:
(WebInspector.TimelineSidebarPanel):
(WebInspector.TimelineSidebarPanel.prototype._changeViewMode):

* UserInterface/Views/TreeOutline.js:
(WebInspector.TreeOutline):
(WebInspector.TreeOutline.prototype.get hidden):
(WebInspector.TreeOutline.prototype.set hidden):
Added hidden property, set DOM element hidden attribute.
(WebInspector.TreeElement.prototype.set hidden):
Remove CSS class, set DOM element hidden attribute.
(WebInspector.TreeElement.prototype._attach):
(WebInspector.TreeElement.prototype.expand):


git-svn-id: http://svn.webkit.org/repository/webkit/trunk@193791 268f45cc-cd09-0410-ab3c-d52691b4dbfc
diff --git a/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js b/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js
index b158e15..5dc3cb4 100644
--- a/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js
+++ b/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js
@@ -46,12 +46,27 @@
         this.expanded = true;
         this.selected = false;
         this.treeOutline = this;
+        this._hidden = false;
 
         this._childrenListNode.tabIndex = 0;
         this._childrenListNode.addEventListener("keydown", this._treeKeyDown.bind(this), true);
     }
 
-    // Methods
+    // Public
+
+    get hidden()
+    {
+        return this._hidden;
+    }
+
+    set hidden(x)
+    {
+        if (this._hidden === x)
+            return;
+
+        this._hidden = x;
+        this.element.hidden = this._hidden;
+    }
 
     appendChild(child)
     {
@@ -659,17 +674,10 @@
 
         this._hidden = x;
 
-        if (x) {
-            if (this._listItemNode)
-                this._listItemNode.classList.add("hidden");
-            if (this._childrenListNode)
-                this._childrenListNode.classList.add("hidden");
-        } else {
-            if (this._listItemNode)
-                this._listItemNode.classList.remove("hidden");
-            if (this._childrenListNode)
-                this._childrenListNode.classList.remove("hidden");
-        }
+        if (this._listItemNode)
+            this._listItemNode.hidden = this._hidden;
+        if (this._childrenListNode)
+            this._childrenListNode.hidden = this._hidden;
 
         if (this.treeOutline)
             this.treeOutline.dispatchEventToListeners(WebInspector.TreeOutline.Event.ElementVisibilityDidChange, {element: this});
@@ -734,9 +742,8 @@
             this._listItemNode.treeElement = this;
             this._setListItemNodeContent();
             this._listItemNode.title = this._tooltip ? this._tooltip : "";
+            this._listItemNode.hidden = this.hidden;
 
-            if (this.hidden)
-                this._listItemNode.classList.add("hidden");
             if (this.hasChildren)
                 this._listItemNode.classList.add("parent");
             if (this.expanded)
@@ -880,9 +887,7 @@
             this._childrenListNode = this.treeOutline._childrenListNode.ownerDocument.createElement("ol");
             this._childrenListNode.parentTreeElement = this;
             this._childrenListNode.classList.add("children");
-
-            if (this.hidden)
-                this._childrenListNode.classList.add("hidden");
+            this._childrenListNode.hidden = this.hidden;
 
             this.onpopulate();