blob: 741f75145d683feec98006c41e5324d9da0a0a84 [file] [log] [blame]
/*
* Copyright (C) 2013-2017 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
* notice, this list of conditions and the following disclaimer in the
* documentation and/or other materials provided with the distribution.
*
* THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
* AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
* THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
* PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
* BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
* CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
* SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
* INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
* CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
* ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
* THE POSSIBILITY OF SUCH DAMAGE.
*/
WI.Toolbar = class Toolbar extends WI.NavigationBar
{
constructor(element)
{
super(element, null, "toolbar");
this._controlSectionElement = document.createElement("div");
this._controlSectionElement.className = WI.Toolbar.ControlSectionStyleClassName;
this.element.appendChild(this._controlSectionElement);
this._leftSectionElement = document.createElement("div");
this._leftSectionElement.className = WI.Toolbar.ItemSectionStyleClassName + " " + WI.Toolbar.LeftItemSectionStyleClassName;
this.element.appendChild(this._leftSectionElement);
this._centerLeftSectionElement = document.createElement("div");
this._centerLeftSectionElement.className = WI.Toolbar.ItemSectionStyleClassName + " " + WI.Toolbar.CenterLeftItemSectionStyleClassName;
this.element.appendChild(this._centerLeftSectionElement);
this._centerSectionElement = document.createElement("div");
this._centerSectionElement.className = WI.Toolbar.ItemSectionStyleClassName + " " + WI.Toolbar.CenterItemSectionStyleClassName;
this.element.appendChild(this._centerSectionElement);
this._centerRightSectionElement = document.createElement("div");
this._centerRightSectionElement.className = WI.Toolbar.ItemSectionStyleClassName + " " + WI.Toolbar.CenterRightItemSectionStyleClassName;
this.element.appendChild(this._centerRightSectionElement);
this._rightSectionElement = document.createElement("div");
this._rightSectionElement.className = WI.Toolbar.ItemSectionStyleClassName + " " + WI.Toolbar.RightItemSectionStyleClassName;
this.element.appendChild(this._rightSectionElement);
}
// Public
addToolbarItem(toolbarItem, sectionIdentifier)
{
var sectionElement;
switch (sectionIdentifier) {
case WI.Toolbar.Section.Control:
sectionElement = this._controlSectionElement;
break;
case WI.Toolbar.Section.Left:
sectionElement = this._leftSectionElement;
break;
case WI.Toolbar.Section.CenterLeft:
sectionElement = this._centerLeftSectionElement;
break;
default:
case WI.Toolbar.Section.Center:
sectionElement = this._centerSectionElement;
break;
case WI.Toolbar.Section.CenterRight:
sectionElement = this._centerRightSectionElement;
break;
case WI.Toolbar.Section.Right:
sectionElement = this._rightSectionElement;
break;
}
console.assert(sectionElement);
this.addNavigationItem(toolbarItem, sectionElement);
}
// Protected
layout()
{
// Bail early if our sections are not created yet. This means we are being called during construction.
if (!this._leftSectionElement || !this._centerSectionElement || !this._rightSectionElement)
return;
// Force collapsed style for non-Web debuggables.
if (WI.sharedApp.debuggableType !== WI.DebuggableType.Web) {
this.element.classList.add(WI.NavigationBar.CollapsedStyleClassName);
return;
}
// Remove the collapsed style class to test if the items can fit at full width.
this.element.classList.remove(WI.NavigationBar.CollapsedStyleClassName);
function isOverflowingToolbar()
{
var controlSectionWidth = this._controlSectionElement.realOffsetWidth;
var leftSectionWidth = this._leftSectionElement.realOffsetWidth;
var centerLeftSectionWidth = this._centerLeftSectionElement.realOffsetWidth;
var centerSectionWidth = this._centerSectionElement.realOffsetWidth;
var centerRightSectionWidth = this._centerRightSectionElement.realOffsetWidth;
var rightSectionWidth = this._rightSectionElement.realOffsetWidth;
var toolbarWidth = Math.round(this.element.realOffsetWidth);
return Math.round(controlSectionWidth + leftSectionWidth + centerLeftSectionWidth + centerSectionWidth + centerRightSectionWidth + rightSectionWidth) > toolbarWidth;
}
if (!isOverflowingToolbar.call(this))
return;
this.element.classList.add(WI.NavigationBar.CollapsedStyleClassName);
}
};
WI.Toolbar.StyleClassName = "toolbar";
WI.Toolbar.ControlSectionStyleClassName = "control-section";
WI.Toolbar.ItemSectionStyleClassName = "item-section";
WI.Toolbar.LeftItemSectionStyleClassName = "left";
WI.Toolbar.CenterLeftItemSectionStyleClassName = "center-left";
WI.Toolbar.CenterItemSectionStyleClassName = "center";
WI.Toolbar.CenterRightItemSectionStyleClassName = "center-right";
WI.Toolbar.RightItemSectionStyleClassName = "right";
WI.Toolbar.Section = {
Control: "control",
Left: "left",
CenterLeft: "center-left",
Center: "center",
CenterRight: "center-right",
Right: "right"
};