src/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.View}
  32  */
  33 WebInspector.SidebarPane = function(title)
  34 {
  35     WebInspector.View.call(this);
  36     this.setMinimumSize(25, 0);
  37     this.element.className = "sidebar-pane"; // Override
  38
  39     this.titleElement = document.createElementWithClass("div", "sidebar-pane-toolbar");
  40     this.bodyElement = this.element.createChild("div", "body");
  41     this._title = title;
  42     this._expandCallback = null;
  43 }
  44
  45 WebInspector.SidebarPane.EventTypes = {
  46     wasShown: "wasShown"
  47 }
  48
  49 WebInspector.SidebarPane.prototype = {
  50     /**
  51      * @return {string}
  52      */
  53     title: function()
  54     {
  55         return this._title;
  56     },
  57
  58     /**
  59      * @param {function()} callback
  60      */
  61     prepareContent: function(callback)
  62     {
  63         if (callback)
  64             callback();
  65     },
  66
  67     expand: function()
  68     {
  69         this.prepareContent(this.onContentReady.bind(this));
  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()} callback
  82      */
  83     setExpandCallback: function(callback)
  84     {
  85         this._expandCallback = callback;
  86         if (this._expandPending) {
  87             delete this._expandPending;
  88             this._expandCallback();
  89         }
  90     },
  91
  92     wasShown: function()
  93     {
  94         WebInspector.View.prototype.wasShown.call(this);
  95         this.dispatchEventToListeners(WebInspector.SidebarPane.EventTypes.wasShown);
  96     },
  97
  98     __proto__: WebInspector.View.prototype
  99 }
 100
 101 /**
 102  * @constructor
 103  * @param {!Element} container
 104  * @param {!WebInspector.SidebarPane} pane
 105  */
 106 WebInspector.SidebarPaneTitle = function(container, pane)
 107 {
 108     this._pane = pane;
 109
 110     this.element = container.createChild("div", "sidebar-pane-title");
 111     this.element.textContent = pane.title();
 112     this.element.tabIndex = 0;
 113     this.element.addEventListener("click", this._toggleExpanded.bind(this), false);
 114     this.element.addEventListener("keydown", this._onTitleKeyDown.bind(this), false);
 115     this.element.appendChild(this._pane.titleElement);
 116
 117     this._pane.setExpandCallback(this._expand.bind(this));
 118 }
 119
 120 WebInspector.SidebarPaneTitle.prototype = {
 121
 122     _expand: function()
 123     {
 124         this.element.classList.add("expanded");
 125         this._pane.show(this.element.parentElement, /** @type {?Element} */ (this.element.nextSibling));
 126     },
 127
 128     _collapse: function()
 129     {
 130         this.element.classList.remove("expanded");
 131         if (this._pane.element.parentNode == this.element.parentNode)
 132             this._pane.detach();
 133     },
 134
 135     _toggleExpanded: function()
 136     {
 137         if (this.element.classList.contains("expanded"))
 138             this._collapse();
 139         else
 140             this._pane.expand();
 141     },
 142
 143     /**
 144      * @param {!Event} event
 145      */
 146     _onTitleKeyDown: function(event)
 147     {
 148         if (isEnterKey(event) || event.keyCode === WebInspector.KeyboardShortcut.Keys.Space.code)
 149             this._toggleExpanded();
 150     }
 151 }
 152
 153 /**
 154  * @constructor
 155  * @extends {WebInspector.View}
 156  */
 157 WebInspector.SidebarPaneStack = function()
 158 {
 159     WebInspector.View.call(this);
 160     this.setMinimumSize(25, 0);
 161     this.element.className = "sidebar-pane-stack"; // Override
 162     /** @type {!Map.<!WebInspector.SidebarPane, !WebInspector.SidebarPaneTitle>} */
 163     this._titleByPane = new Map();
 164 }
 165
 166 WebInspector.SidebarPaneStack.prototype = {
 167     /**
 168      * @param {!WebInspector.SidebarPane} pane
 169      */
 170     addPane: function(pane)
 171     {
 172         this._titleByPane.put(pane, new WebInspector.SidebarPaneTitle(this.element, pane));
 173     },
 174
 175     /**
 176      * @param {!WebInspector.SidebarPane} pane
 177      * @param {boolean} hide
 178      */
 179     togglePaneHidden: function(pane, hide)
 180     {
 181         var title = this._titleByPane.get(pane);
 182         if (!title)
 183             return;
 184
 185         title.element.classList.toggle("hidden", hide);
 186         pane.element.classList.toggle("hidden", hide);
 187     },
 188
 189     __proto__: WebInspector.View.prototype
 190 }
 191
 192 /**
 193  * @constructor
 194  * @extends {WebInspector.TabbedPane}
 195  */
 196 WebInspector.SidebarTabbedPane = function()
 197 {
 198     WebInspector.TabbedPane.call(this);
 199     this.setRetainTabOrder(true);
 200     this.element.classList.add("sidebar-tabbed-pane");
 201 }
 202
 203 WebInspector.SidebarTabbedPane.prototype = {
 204     /**
 205      * @param {!WebInspector.SidebarPane} pane
 206      */
 207     addPane: function(pane)
 208     {
 209         var title = pane.title();
 210         this.appendTab(title, title, pane);
 211         pane.element.appendChild(pane.titleElement);
 212         pane.setExpandCallback(this.selectTab.bind(this, title));
 213
 214     },
 215
 216     __proto__: WebInspector.TabbedPane.prototype
 217 }