DevTools: introduce View: a named widget with the toolbar.

third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js

Index: third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
diff --git a/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js b/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
index f88f461d6d00af4d647f301a68c3b70462303df1..6c4c803ae23efb648d7be748dcefa6e149e4f465 100644
--- a/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
+++ b/third_party/WebKit/Source/devtools/front_end/elements/ElementsPanel.js
@@ -67,16 +67,16 @@ WebInspector.ElementsPanel = function()
     this._breadcrumbs.addEventListener(WebInspector.ElementsBreadcrumbs.Events.NodeSelected, this._crumbNodeSelected, this);
 
     this.sidebarPanes = {};
-    /** @type !Array<!WebInspector.ElementsSidebarViewWrapperPane> */
-    this._elementsSidebarViewWrappers = [];
+    /** @type !Array<!WebInspector.View> */
+    this._elementsSidebarViews = [];
     this._currentToolbarPane = null;
 
     this.sidebarPanes.styles = new WebInspector.StylesSidebarPane();
-    this.sidebarPanes.computedStyle = WebInspector.ComputedStyleWidget.createSidebarWrapper();
+    this.sidebarPanes.computedStyle = new WebInspector.ComputedStyleWidget();
     this.sidebarPanes.metrics = new WebInspector.MetricsSidebarPane();
-    this.sidebarPanes.properties = WebInspector.PropertiesWidget.createSidebarWrapper();
+    this.sidebarPanes.properties = new WebInspector.PropertiesWidget();
     this.sidebarPanes.domBreakpoints = WebInspector.domBreakpointsSidebarPane.createProxy(this);
-    this.sidebarPanes.eventListeners = WebInspector.EventListenersWidget.createSidebarWrapper();
+    this.sidebarPanes.eventListeners = new WebInspector.EventListenersWidget();
 
     this._stylesSidebarToolbar = this._createStylesSidebarToolbar(this.sidebarPanes.styles);
 
@@ -199,7 +199,7 @@ WebInspector.ElementsPanel.prototype = {
 
     _loadSidebarViews: function()
     {
-        var extensions = self.runtime.extensions("@WebInspector.Widget");
+        var extensions = self.runtime.extensions("@WebInspector.View");
 
         for (var i = 0; i < extensions.length; ++i) {
             var descriptor = extensions[i].descriptor();
@@ -217,12 +217,11 @@ WebInspector.ElementsPanel.prototype = {
          */
         function addSidebarView(title, object)
         {
-            var widget = /** @type {!WebInspector.Widget} */ (object);
-            var elementsSidebarViewWrapperPane = new WebInspector.ElementsSidebarViewWrapperPane(title, widget);
-            this._elementsSidebarViewWrappers.push(elementsSidebarViewWrapperPane);
+            var view = /** @type {!WebInspector.View} */ (object);
+            this._elementsSidebarViews.push(view);
 
             if (this.sidebarPaneView)
-                this.sidebarPaneView.addPane(elementsSidebarViewWrapperPane);
+                this.sidebarPaneView.addPane(view);
         }
     },
 
@@ -870,7 +869,7 @@ WebInspector.ElementsPanel.prototype = {
         this._splitWidget.setVertical(!horizontally);
         this.showToolbarPane(null);
 
-        var computedPane = new WebInspector.SidebarPane(WebInspector.UIString("Computed"));
+        var computedPane = new WebInspector.View(WebInspector.UIString("Computed"));
         computedPane.element.classList.add("composite");
         computedPane.element.classList.add("fill");
         computedPane.element.classList.add("metrics-and-computed");
@@ -918,7 +917,7 @@ WebInspector.ElementsPanel.prototype = {
         if (horizontally) {
             this._splitWidget.installResizer(this.sidebarPaneView.headerElement());
 
-            var compositePane = new WebInspector.SidebarPane(WebInspector.UIString("Styles"));
+            var compositePane = new WebInspector.View(WebInspector.UIString("Styles"));
             compositePane.element.classList.add("composite");
             compositePane.element.classList.add("fill");
 
@@ -931,7 +930,7 @@ WebInspector.ElementsPanel.prototype = {
             computedPane.show(computedStylePanesWrapper.element);
             this.sidebarPaneView.addPane(compositePane);
         } else {
-            var stylesPane = new WebInspector.SidebarPane(WebInspector.UIString("Styles"));
+            var stylesPane = new WebInspector.View(WebInspector.UIString("Styles"));
             stylesPane.element.classList.add("composite", "fill", "metrics-and-styles");
 
             matchedStylesContainer.show(stylesPane.element);
@@ -950,7 +949,7 @@ WebInspector.ElementsPanel.prototype = {
         this.sidebarPaneView.addPane(this.sidebarPanes.domBreakpoints);
         this.sidebarPaneView.addPane(this.sidebarPanes.properties);
 
-        for (var sidebarViewWrapper of this._elementsSidebarViewWrappers)
+        for (var sidebarViewWrapper of this._elementsSidebarViews)
             this.sidebarPaneView.addPane(sidebarViewWrapper);
 
         this._extensionSidebarPanesContainer = this.sidebarPaneView;
@@ -959,7 +958,6 @@ WebInspector.ElementsPanel.prototype = {
             this._addExtensionSidebarPane(extensionSidebarPanes[i]);
 
         this._splitWidget.setSidebarWidget(this.sidebarPaneView);
-        this.sidebarPanes.styles.expandPane();
 
         if (selectedTabId)
             this.sidebarPaneView.selectTab(selectedTabId);