Home | History | Annotate | Download | only in front-end 
      1  /*
      2  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
      3  * Copyright (C) 2007 Matt Lilek (pewtermoose (a] gmail.com).
      4  * Copyright (C) 2009 Joseph Pecoraro
      5  * Copyright (C) 2011 Google Inc. All rights reserved.
      6  *
      7  * Redistribution and use in source and binary forms, with or without
      8  * modification, are permitted provided that the following conditions
      9  * are met:
     10  *
     11  * 1.  Redistributions of source code must retain the above copyright
     12  *     notice, this list of conditions and the following disclaimer.
     13  * 2.  Redistributions in binary form must reproduce the above copyright
     14  *     notice, this list of conditions and the following disclaimer in the
     15  *     documentation and/or other materials provided with the distribution.
     16  * 3.  Neither the name of Apple Computer, Inc. ("Apple") nor the names of
     17  *     its contributors may be used to endorse or promote products derived
     18  *     from this software without specific prior written permission.
     19  *
     20  * THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY
     21  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
     22  * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
     23  * DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY
     24  * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
     25  * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
     26  * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
     27  * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
     28  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
     29  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
     30  */
     31 
     32 WebInspector.Toolbar = function()
     33 {
     34     this.element = document.getElementById("toolbar");
     35     this.element.addEventListener("mousedown", this._toolbarDragStart.bind(this), true);
     36 
     37     this._dropdownButton = document.getElementById("toolbar-dropdown-arrow");
     38     this._dropdownButton.addEventListener("click", this._toggleDropdown.bind(this), false);
     39 
     40     document.getElementById("close-button-left").addEventListener("click", this._onClose, true);
     41     document.getElementById("close-button-right").addEventListener("click", this._onClose, true);
     42 }
     43 
     44 WebInspector.Toolbar.prototype = {
     45     resize: function()
     46     {
     47         this._updateDropdownButtonAndHideDropdown();
     48     },
     49 
     50     addPanel: function(panel)
     51     {
     52         this.element.appendChild(panel.toolbarItem);
     53         this.resize();
     54     },
     55 
     56     _toolbarDragStart: function(event)
     57     {
     58         if ((!WebInspector.attached && WebInspector.platformFlavor !== WebInspector.PlatformFlavor.MacLeopard && WebInspector.platformFlavor !== WebInspector.PlatformFlavor.MacSnowLeopard) || WebInspector.port == "qt")
     59             return;
     60 
     61         var target = event.target;
     62         if (target.hasStyleClass("toolbar-item") && target.hasStyleClass("toggleable"))
     63             return;
     64 
     65         if (target !== this.element && !target.hasStyleClass("toolbar-item"))
     66             return;
     67 
     68         this.element.lastScreenX = event.screenX;
     69         this.element.lastScreenY = event.screenY;
     70 
     71         WebInspector.elementDragStart(this.element, this._toolbarDrag.bind(this), this._toolbarDragEnd.bind(this), event, (WebInspector.attached ? "row-resize" : "default"));
     72     },
     73 
     74     _toolbarDragEnd: function(event)
     75     {
     76         WebInspector.elementDragEnd(event);
     77 
     78         delete this.element.lastScreenX;
     79         delete this.element.lastScreenY;
     80     },
     81 
     82     _toolbarDrag: function(event)
     83     {
     84         if (WebInspector.attached) {
     85             var height = window.innerHeight - (event.screenY - this.element.lastScreenY);
     86 
     87             InspectorFrontendHost.setAttachedWindowHeight(height);
     88         } else {
     89             var x = event.screenX - this.element.lastScreenX;
     90             var y = event.screenY - this.element.lastScreenY;
     91 
     92             // We cannot call window.moveBy here because it restricts the movement
     93             // of the window at the edges.
     94             InspectorFrontendHost.moveWindowBy(x, y);
     95         }
     96 
     97         this.element.lastScreenX = event.screenX;
     98         this.element.lastScreenY = event.screenY;
     99 
    100         event.preventDefault();
    101     },
    102 
    103     _onClose: function()
    104     {
    105         WebInspector.close();
    106     },
    107 
    108     _setDropdownVisible: function(visible)
    109     {
    110         if (!this._dropdown) {
    111             if (!visible)
    112                 return;
    113             this._dropdown = new WebInspector.ToolbarDropdown();
    114         }
    115         if (visible)
    116             this._dropdown.show();
    117         else
    118             this._dropdown.hide();
    119     },
    120 
    121     _toggleDropdown: function()
    122     {
    123         this._setDropdownVisible(!this._dropdown || !this._dropdown.visible);
    124     },
    125 
    126     _updateDropdownButtonAndHideDropdown: function()
    127     {
    128         this._setDropdownVisible(false);
    129 
    130         var toolbar = document.getElementById("toolbar");
    131         if (this.element.scrollHeight > this.element.clientHeight)
    132             this._dropdownButton.removeStyleClass("hidden");
    133         else
    134             this._dropdownButton.addStyleClass("hidden");
    135     }
    136 };
    137 
    138 WebInspector.Toolbar.createPanelToolbarItem = function(panel)
    139 {
    140     var toolbarItem = document.createElement("button");
    141     toolbarItem.className = "toolbar-item toggleable";
    142     toolbarItem.panel = panel;
    143     toolbarItem.addStyleClass(panel._panelName);
    144     function onToolbarItemClicked()
    145     {
    146         WebInspector.toolbar._updateDropdownButtonAndHideDropdown();
    147         WebInspector.currentPanel = panel;
    148     }
    149     toolbarItem.addEventListener("click", onToolbarItemClicked);
    150 
    151     var iconElement = toolbarItem.createChild("div", "toolbar-icon");
    152 
    153     if ("toolbarItemLabel" in panel)
    154         toolbarItem.createChild("div", "toolbar-label").textContent = panel.toolbarItemLabel;
    155 
    156     if (panel === WebInspector.currentPanel)
    157         toolbarItem.addStyleClass("toggled-on");
    158 
    159     return toolbarItem;
    160 }
    161 
    162 WebInspector.ToolbarDropdown = function()
    163 {
    164     this._toolbar = document.getElementById("toolbar");
    165     this._arrow = document.getElementById("toolbar-dropdown-arrow");
    166     this.element = document.createElement("div");
    167     this.element.id = "toolbar-dropdown";
    168     this._contentElement = this.element.createChild("div", "scrollable-content");
    169     this._contentElement.tabIndex = 0;
    170     this._contentElement.addEventListener("keydown", this._onKeyDown.bind(this), true);
    171 }
    172 
    173 WebInspector.ToolbarDropdown.prototype = {
    174     show: function()
    175     {
    176         if (this.visible)
    177             return;
    178         var style = this.element.style;
    179         this._populate();
    180         var top = this._arrow.totalOffsetTop + this._arrow.clientHeight;
    181         this._arrow.addStyleClass("dropdown-visible");
    182         this.element.style.top = top + "px";
    183         this.element.style.left = this._arrow.totalOffsetLeft + "px";
    184         this._contentElement.style.maxHeight = window.innerHeight - top - 20 + "px";
    185         this._toolbar.appendChild(this.element);
    186         WebInspector.currentFocusElement = this.contentElement;
    187     },
    188 
    189     hide: function()
    190     {
    191         if (!this.visible)
    192             return;
    193         this._arrow.removeStyleClass("dropdown-visible");
    194         this.element.parentNode.removeChild(this.element);
    195         this._contentElement.removeChildren();
    196     },
    197 
    198     get visible()
    199     {
    200         return !!this.element.parentNode;
    201     },
    202 
    203     _populate: function()
    204     {
    205         var toolbarItems = this._toolbar.querySelectorAll(".toolbar-item.toggleable");
    206 
    207         for (var i = 0; i < toolbarItems.length; ++i) {
    208             if (toolbarItems[i].offsetTop > 0)
    209                 this._contentElement.appendChild(WebInspector.Toolbar.createPanelToolbarItem(toolbarItems[i].panel));
    210         }
    211     },
    212 
    213     _onKeyDown: function(event)
    214     {
    215         if (event.keyCode !== WebInspector.KeyboardShortcut.Keys.Esc.code)
    216             return;
    217         event.stopPropagation();
    218         this.hide();
    219     }
    220 };
    221