third_party/WebKit/Source/devtools/front_end/ui/SidebarPane.js

   1 /*
   2  * Copyright (C) 2007 Apple Inc.  All rights reserved.
   3  *
   4  * Redistribution and use in source and binary forms, with or without
   5  * modification, are permitted provided that the following conditions
   6  * are met:
   7  *
   8  * 1.  Redistributions of source code must retain the above copyright
   9  *     notice, this list of conditions and the following disclaimer.
  10  * 2.  Redistributions in binary form must reproduce the above copyright
  11  *     notice, this list of conditions and the following disclaimer in the
  12  *     documentation and/or other materials provided with the distribution.
  13  * 3.  Neither the name of Apple Computer, Inc. ("Apple") nor the names of
  14  *     its contributors may be used to endorse or promote products derived
  15  *     from this software without specific prior written permission.
  16  *
  17  * THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY
  18  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
  19  * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
  20  * DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY
  21  * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
  22  * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
  23  * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
  24  * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  25  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
  26  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  27  */
  28
  29 /**
  30  * @constructor
  31  * @extends {WebInspector.Widget}
  32  * @param {string} title
  33  */
  34 WebInspector.SidebarPane = function(title)
  35 {
  36     WebInspector.Widget.call(this);
  37     this.setMinimumSize(25, 0);
  38     this.element.className = "sidebar-pane"; // Override
  39
  40     this._title = title;
  41     this._expandCallback = null;
  42     this._paneVisible = true;
  43 }
  44
  45 WebInspector.SidebarPane.prototype = {
  46     /**
  47      * @return {!WebInspector.Toolbar}
  48      */
  49     toolbar: function()
  50     {
  51         if (!this._toolbar) {
  52             this._toolbar = new WebInspector.Toolbar();
  53             this._toolbar.element.addEventListener("click", consumeEvent);
  54             this.element.insertBefore(this._toolbar.element, this.element.firstChild);
  55         }
  56         return this._toolbar;
  57     },
  58
  59     /**
  60      * @return {string}
  61      */
  62     title: function()
  63     {
  64         return this._title;
  65     },
  66
  67     expand: function()
  68     {
  69         this.onContentReady();
  70     },
  71
  72     onContentReady: function()
  73     {
  74         if (this._expandCallback)
  75             this._expandCallback();
  76         else
  77             this._expandPending = true;
  78     },
  79
  80     /**
  81      * @param {function(boolean)} setVisibleCallback
  82      * @param {function()} expandCallback
  83      */
  84     _attached: function(setVisibleCallback, expandCallback)
  85     {
  86         this._setVisibleCallback = setVisibleCallback;
  87         this._setVisibleCallback(this._paneVisible);
  88
  89         this._expandCallback = expandCallback;
  90         if (this._expandPending) {
  91             delete this._expandPending;
  92             this._expandCallback();
  93         }
  94     },
  95
  96     /**
  97      * @param {boolean} visible
  98      */
  99     setVisible: function(visible)
 100     {
 101         this._paneVisible = visible;
 102         if (this._setVisibleCallback)
 103             this._setVisibleCallback(visible)
 104     },
 105
 106     __proto__: WebInspector.Widget.prototype
 107 }
 108
 109 /**
 110  * @constructor
 111  * @param {!Element} container
 112  * @param {!WebInspector.SidebarPane} pane
 113  */
 114 WebInspector.SidebarPaneTitle = function(container, pane)
 115 {
 116     this._pane = pane;
 117
 118     this.element = container.createChild("div", "sidebar-pane-title");
 119     this.element.textContent = pane.title();
 120     this.element.tabIndex = 0;
 121     this.element.addEventListener("click", this._toggleExpanded.bind(this), false);
 122     this.element.addEventListener("keydown", this._onTitleKeyDown.bind(this), false);
 123 }
 124
 125 WebInspector.SidebarPaneTitle.prototype = {
 126     _expand: function()
 127     {
 128         this.element.classList.add("expanded");
 129         this._pane.show(this.element.parentElement, /** @type {?Element} */ (this.element.nextSibling));
 130     },
 131
 132     _collapse: function()
 133     {
 134         this.element.classList.remove("expanded");
 135         if (this._pane.element.parentNode == this.element.parentNode)
 136             this._pane.detach();
 137     },
 138
 139     _toggleExpanded: function()
 140     {
 141         if (this.element.classList.contains("expanded"))
 142             this._collapse();
 143         else
 144             this._pane.expand();
 145     },
 146
 147     /**
 148      * @param {!Event} event
 149      */
 150     _onTitleKeyDown: function(event)
 151     {
 152         if (isEnterKey(event) || event.keyCode === WebInspector.KeyboardShortcut.Keys.Space.code)
 153             this._toggleExpanded();
 154     }
 155 }
 156
 157 /**
 158  * @constructor
 159  * @extends {WebInspector.Widget}
 160  */
 161 WebInspector.SidebarPaneStack = function()
 162 {
 163     WebInspector.Widget.call(this);
 164     this.setMinimumSize(25, 0);
 165     this.element.className = "sidebar-pane-stack"; // Override
 166     /** @type {!Map.<!WebInspector.SidebarPane, !WebInspector.SidebarPaneTitle>} */
 167     this._titleByPane = new Map();
 168 }
 169
 170 WebInspector.SidebarPaneStack.prototype = {
 171     /**
 172      * @param {!WebInspector.SidebarPane} pane
 173      */
 174     addPane: function(pane)
 175     {
 176         var paneTitle = new WebInspector.SidebarPaneTitle(this.element, pane);
 177         this._titleByPane.set(pane, paneTitle);
 178         if (pane._toolbar)
 179             paneTitle.element.appendChild(pane._toolbar.element);
 180         pane._attached(this._setPaneVisible.bind(this, pane), paneTitle._expand.bind(paneTitle));
 181     },
 182
 183     /**
 184      * @param {!WebInspector.SidebarPane} pane
 185      * @param {boolean} visible
 186      */
 187     _setPaneVisible: function(pane, visible)
 188     {
 189         var title = this._titleByPane.get(pane);
 190         if (!title)
 191             return;
 192
 193         title.element.classList.toggle("hidden", !visible);
 194         pane.element.classList.toggle("sidebar-pane-hidden", !visible);
 195     },
 196
 197     __proto__: WebInspector.Widget.prototype
 198 }
 199
 200 /**
 201  * @constructor
 202  * @extends {WebInspector.TabbedPane}
 203  */
 204 WebInspector.SidebarTabbedPane = function()
 205 {
 206     WebInspector.TabbedPane.call(this);
 207     this.element.classList.add("sidebar-tabbed-pane");
 208 }
 209
 210 WebInspector.SidebarTabbedPane.prototype = {
 211     /**
 212      * @param {!WebInspector.SidebarPane} pane
 213      */
 214     addPane: function(pane)
 215     {
 216         var title = pane.title();
 217         this.appendTab(title, title, pane);
 218         if (pane._toolbar)
 219             pane.element.insertBefore(pane._toolbar.element, pane.element.firstChild);
 220         pane._attached(this._setPaneVisible.bind(this, pane), this.selectTab.bind(this, title));
 221     },
 222
 223     /**
 224      * @param {!WebInspector.SidebarPane} pane
 225      * @param {boolean} visible
 226      */
 227     _setPaneVisible: function(pane, visible)
 228     {
 229         var title = pane._title;
 230         if (visible) {
 231             if (!this.hasTab(title))
 232                 this.appendTab(title, title, pane);
 233         } else {
 234             if (this.hasTab(title))
 235                 this.closeTab(title);
 236         }
 237     },
 238
 239     __proto__: WebInspector.TabbedPane.prototype
 240 }