DevTools: Implement extension-based status bar buttons

Source/devtools/front_end/components/DockController.js

 /*
  * Copyright (C) 2012 Google 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:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 26 matching lines @@
 {
     this._canDock = canDock;
     if (!canDock) {
         this._dockSide = WebInspector.DockController.State.Undocked;
         this._updateUI();
         return;
     }
 
     WebInspector.settings.currentDockState = WebInspector.settings.createSetting("currentDockState", "");
     WebInspector.settings.lastDockState = WebInspector.settings.createSetting("lastDockState", "");
-    var states = [WebInspector.DockController.State.DockedToBottom, WebInspector.DockController.State.Undocked, WebInspector.DockController.State.DockedToRight];
-    var titles = [WebInspector.UIString("Dock to main window."), WebInspector.UIString("Undock into separate window."), WebInspector.UIString("Dock to main window.")];
-    if (WebInspector.experimentsSettings.dockToLeft.isEnabled()) {
-        states.push(WebInspector.DockController.State.DockedToLeft);
-        titles.push(WebInspector.UIString("Dock to main window."));
-    }
-    this._dockToggleButton = new WebInspector.StatusBarStatesSettingButton(
-        "dock-status-bar-item",
-        states,
-        titles,
-        WebInspector.settings.currentDockState,
-        WebInspector.settings.lastDockState,
-        this._dockSideChanged.bind(this));
 }
 
 WebInspector.DockController.State = {
     DockedToBottom: "bottom",
     DockedToRight: "right",
     DockedToLeft: "left",
     Undocked: "undocked"
 }
 
 // Use BeforeDockSideChanged to do something before all the UI bits are updated,
 // DockSideChanged to update UI, and AfterDockSideChanged to perform actions
 // after frontend is docked/undocked in the browser.
 WebInspector.DockController.Events = {
     BeforeDockSideChanged: "BeforeDockSideChanged",
     DockSideChanged: "DockSideChanged",
     AfterDockSideChanged: "AfterDockSideChanged"
 }
 
 WebInspector.DockController.prototype = {
     initialize: function()
     {
-        if (this._canDock)
-            this._dockToggleButton.toggleInitialState();
+        if (!this._canDock)
+            return;
+
+        this._states = [WebInspector.DockController.State.DockedToBottom, WebInspector.DockController.State.Undocked, WebInspector.DockController.State.DockedToRight];
+        this._titles = [WebInspector.UIString("Dock to main window."), WebInspector.UIString("Undock into separate window."), WebInspector.UIString("Dock to main window.")];
+        if (WebInspector.experimentsSettings.dockToLeft.isEnabled()) {
+            this._states.push(WebInspector.DockController.State.DockedToLeft);
+            this._titles.push(WebInspector.UIString("Dock to main window."));
+        }
+        var initialState = WebInspector.settings.currentDockState.get();
+        initialState = this._states.indexOf(initialState) >= 0 ? initialState : this._states[0];
+        this._dockSideChanged(initialState);
     },
 
     /**
-     * @return {?Element}
-     */
-    get element()
-    {
-        return this._canDock ? this._dockToggleButton.element : null;
-    },
-
-    /**
      * @return {string}
      */
     dockSide: function()
     {
         return this._dockSide;
     },
 
     /**
      * @return {boolean}
      */
@@ skipping 58 matching lines @@
             body.classList.remove("dock-to-left");
             body.classList.remove("dock-to-bottom");
             break;
         }
     },
 
     __proto__: WebInspector.Object.prototype
 }
 
 /**
+ * @constructor
+ * @implements {WebInspector.StatusBarButton.Provider}
+ */
+WebInspector.DockController.ButtonProvider = function()
+{
+}
+
+WebInspector.DockController.ButtonProvider.prototype = {
+    /**
+     * @return {?WebInspector.StatusBarButton}
+     */
+    button: function()
+    {
+        if (!WebInspector.dockController.canDock())
+            return null;
+
+        if (!this._dockToggleButton) {
+            this._dockToggleButton = new WebInspector.StatusBarStatesSettingButton(
+                    "dock-status-bar-item",
+                    WebInspector.dockController._states,

[yurys, 2014/06/02 15:48:19]

Why do you prefer to store stats and titles in fields to creating them here?

[apavlov, 2014/06/03 08:39:08]

It's because these depend on the inspected environment and are initialized in
the initialize() method.

[apavlov, 2014/06/03 09:16:41]

Another point is that line 79, this._dockSideChanged(initialState); depends on
these.

+                    WebInspector.dockController._titles,
+                    WebInspector.dockController.dockSide(),
+                    WebInspector.settings.currentDockState,
+                    WebInspector.settings.lastDockState,
+                    WebInspector.dockController._dockSideChanged.bind(WebInspector.dockController));
+        }
+        return this._dockToggleButton;
+    }
+}
+
+/**
  * @type {!WebInspector.DockController}
  */
 WebInspector.dockController;