DevTools: migrate sidebar pane's titleElement to use Toolbar.

Source/devtools/front_end/ui/SidebarPane.js

 /*
  * Copyright (C) 2007 Apple Inc.  All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
  * 2.  Redistributions in binary form must reproduce the above copyright
@@ skipping 19 matching lines @@
  * @constructor
  * @extends {WebInspector.Widget}
  * @param {string} title
  */
 WebInspector.SidebarPane = function(title)
 {
     WebInspector.Widget.call(this);
     this.setMinimumSize(25, 0);
     this.element.className = "sidebar-pane"; // Override
 
-    this.titleElement = createElementWithClass("div", "sidebar-pane-toolbar");
-    this.bodyElement = this.element.createChild("div", "body");
     this._title = title;
     this._expandCallback = null;
     this._paneVisible = true;
 }
 
 WebInspector.SidebarPane.prototype = {
     /**
+     * @return {!WebInspector.Toolbar}
+     */
+    toolbar: function()
+    {
+        if (!this._toolbar) {
+            this._toolbar = new WebInspector.Toolbar(undefined, true);
+            this._toolbar.element.addEventListener("click", consumeEvent);
+            this._toolbar.element.classList.add("sidebar-pane-toolbar");
+            this.element.insertBefore(this._toolbar.element, this.element.firstChild);
+        }
+        return this._toolbar;
+    },
+
+    /**
      * @return {string}
      */
     title: function()
     {
         return this._title;
     },
 
     expand: function()
     {
         this.onContentReady();
@@ skipping 43 matching lines @@
  */
 WebInspector.SidebarPaneTitle = function(container, pane)
 {
     this._pane = pane;
 
     this.element = container.createChild("div", "sidebar-pane-title");
     this.element.textContent = pane.title();
     this.element.tabIndex = 0;
     this.element.addEventListener("click", this._toggleExpanded.bind(this), false);
     this.element.addEventListener("keydown", this._onTitleKeyDown.bind(this), false);
-    this.element.appendChild(this._pane.titleElement);
 }
 
 WebInspector.SidebarPaneTitle.prototype = {
     _expand: function()
     {
         this.element.classList.add("expanded");
         this._pane.show(this.element.parentElement, /** @type {?Element} */ (this.element.nextSibling));
     },
 
     _collapse: function()
@@ skipping 35 matching lines @@
 }
 
 WebInspector.SidebarPaneStack.prototype = {
     /**
      * @param {!WebInspector.SidebarPane} pane
      */
     addPane: function(pane)
     {
         var paneTitle = new WebInspector.SidebarPaneTitle(this.element, pane);
         this._titleByPane.set(pane, paneTitle);
+        if (pane._toolbar)
+            paneTitle.element.appendChild(pane._toolbar.element);
         pane._attached(this._setPaneVisible.bind(this, pane), paneTitle._expand.bind(paneTitle));
     },
 
     /**
      * @param {!WebInspector.SidebarPane} pane
      * @param {boolean} visible
      */
     _setPaneVisible: function(pane, visible)
     {
         var title = this._titleByPane.get(pane);
@@ skipping 19 matching lines @@
 }
 
 WebInspector.SidebarTabbedPane.prototype = {
     /**
      * @param {!WebInspector.SidebarPane} pane
      */
     addPane: function(pane)
     {
         var title = pane.title();
         this.appendTab(title, title, pane);
-        pane.element.appendChild(pane.titleElement);
+        if (pane._toolbar)
+            pane.element.insertBefore(pane._toolbar.element, pane.element.firstChild);
         pane._attached(this._setPaneVisible.bind(this, pane), this.selectTab.bind(this, title));
     },
 
     /**
      * @param {!WebInspector.SidebarPane} pane
      * @param {boolean} visible
      */
     _setPaneVisible: function(pane, visible)
     {
         var title = pane._title;
         if (visible) {
             if (!this.hasTab(title))
                 this.appendTab(title, title, pane);
         } else {
             if (this.hasTab(title))
                 this.closeTab(title);
         }
     },
 
     __proto__: WebInspector.TabbedPane.prototype
 }