Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (221337 => 221338)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-08-30 04:04:02 UTC (rev 221338)
@@ -1,3 +1,103 @@
+2017-08-29 Matt Baker <mattba...@apple.com>
+
+ Web Inspector: Critical content browser toolbar buttons are hidden at narrow widths
+ https://bugs.webkit.org/show_bug.cgi?id=175999
+
+ Reviewed by Devin Rousso.
+
+ This patch adds a VisibilityPriority concept to NavigationItems. If a
+ NavigationBar cannot fit all of its items in the available space, items
+ are hidden to make room, starting with the lowest priority item. Consecutive
+ dividers are then collapsed, as well as leading and trailing dividers.
+
+ * UserInterface/Main.html:
+ New file.
+
+ * UserInterface/Views/CanvasContentView.js:
+ (WI.CanvasContentView):
+ * UserInterface/Views/ConsoleDrawer.js:
+ (WI.ConsoleDrawer):
+ * UserInterface/Views/ContentBrowser.js:
+ (WI.ContentBrowser):
+ * UserInterface/Views/ContentBrowserTabContentView.js:
+ (WI.ContentBrowserTabContentView):
+ * UserInterface/Views/DOMTreeContentView.js:
+ (WI.DOMTreeContentView):
+ Set `High` and `Low` priorities, and group the back/forward buttons.
+
+ * UserInterface/Views/GroupNavigationItem.js: Added.
+ (WI.GroupNavigationItem):
+ (WI.GroupNavigationItem.prototype.get navigationItems):
+ (WI.GroupNavigationItem.prototype.get minimumWidth):
+ (WI.GroupNavigationItem.prototype.updateLayout):
+ (WI.GroupNavigationItem.prototype.didAttach):
+ (WI.GroupNavigationItem.prototype.didDetach):
+ NavigationItem groups. Grouped items are shown/hidden together.
+
+ * UserInterface/Views/HierarchicalPathNavigationItem.js:
+ (WI.HierarchicalPathNavigationItem.prototype.updateLayout):
+ * UserInterface/Views/ImageResourceContentView.js:
+ (WI.ImageResourceContentView):
+ * UserInterface/Views/IndexedDatabaseObjectStoreContentView.js:
+ (WI.IndexedDatabaseObjectStoreContentView):
+ * UserInterface/Views/LogContentView.js:
+ (WI.LogContentView):
+ Set `High` and `Low` priorities.
+
+ * UserInterface/Views/NavigationBar.css:
+ (.navigation-bar .item.force-hidden):
+ New hidden class, which must be tracked separately from ".hidden".
+ The former is an implementation detail of NavigationBar, while the
+ latter is set by the client.
+
+ * UserInterface/Views/NavigationBar.js:
+ (WI.NavigationBar.prototype.insertNavigationItem):
+ (WI.NavigationBar.prototype.removeNavigationItem):
+ (WI.NavigationBar.prototype.findNavigationItem.matchingSelfOrChild):
+ (WI.NavigationBar.prototype.findNavigationItem):
+ (WI.NavigationBar.prototype.layout.forceItemHidden):
+ (WI.NavigationBar.prototype.layout.isDivider):
+ (WI.NavigationBar.prototype.layout.calculateVisibleItemWidth):
+ (WI.NavigationBar.prototype.layout):
+ (WI.NavigationBar.prototype._calculateMinimumWidth):
+ (WI.NavigationBar.prototype.get _visibleNavigationItems):
+ (WI.NavigationBar):
+
+ * UserInterface/Views/NavigationItem.js:
+ Add support for visibility priority, an integer value that determines the
+ order in which items are hidden when the NavigationBar becomes too narrow
+ to fit all of items child items. NavigationIte3m defines constants for
+ Low, Normal (the default), and High priority.
+
+ (WI.NavigationItem):
+ (WI.NavigationItem.prototype.get minimumWidth):
+ (WI.NavigationItem.prototype.get width):
+ (WI.NavigationItem.prototype.get visibilityPriority):
+ (WI.NavigationItem.prototype.set visibilityPriority):
+ (WI.NavigationItem.prototype.updateLayout):
+ (WI.NavigationItem.prototype.didAttach):
+ (WI.NavigationItem.prototype.didDetach):
+ Encapsulate the setting of the parent NavigationBar. Needed so that
+ GroupNavigationItem can forward this action to its children.
+
+ * UserInterface/Views/NetworkGridContentView.js:
+ (WI.NetworkGridContentView):
+ * UserInterface/Views/RadioButtonNavigationItem.js:
+ (WI.RadioButtonNavigationItem.prototype.updateLayout):
+ * UserInterface/Views/RecordingContentView.js:
+ (WI.RecordingContentView):
+ * UserInterface/Views/ScriptContentView.js:
+ (WI.ScriptContentView):
+ * UserInterface/Views/TextContentView.js:
+ (WI.TextContentView):
+ * UserInterface/Views/TextResourceContentView.js:
+ (WI.TextResourceContentView):
+ * UserInterface/Views/TimelineRecordingContentView.js:
+ (WI.TimelineRecordingContentView):
+ * UserInterface/Views/TimelineTabContentView.js:
+ (WI.TimelineTabContentView):
+ Set `High` and `Low` priorities, and group Timeline view mode buttons.
+
2017-08-29 Joseph Pecoraro <pecor...@apple.com>
REGRESSION(r220235): Web Inspector: Global search should not happen incrementally
Modified: trunk/Source/WebInspectorUI/UserInterface/Main.html (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Main.html 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Main.html 2017-08-30 04:04:02 UTC (rev 221338)
@@ -467,6 +467,7 @@
<script src=""
<script src=""
<script src=""
+ <script src=""
<script src=""
<script src=""
<script src=""
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CanvasContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CanvasContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CanvasContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -41,14 +41,17 @@
const toolTip = WI.UIString("Request recording of actions. Shift-click to record a single frame.");
const altToolTip = WI.UIString("Cancel recording");
this._recordButtonNavigationItem = new WI.ToggleButtonNavigationItem("canvas-record", toolTip, altToolTip, "Images/Record.svg", "Images/Stop.svg", 13, 13);
+ this._recordButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
this._recordButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleRecording, this);
}
this._refreshButtonNavigationItem = new WI.ButtonNavigationItem("canvas-refresh", WI.UIString("Refresh"), "Images/ReloadFull.svg", 13, 13);
+ this._refreshButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._refreshButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._showPreview, this);
this._showGridButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-grid", WI.UIString("Show Grid"), WI.UIString("Hide Grid"), "Images/NavigationItemCheckers.svg", 13, 13);
this._showGridButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._showGridButtonClicked, this);
+ this._showGridButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showGridButtonNavigationItem.activated = !!WI.settings.showImageGrid.value;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleDrawer.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleDrawer.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleDrawer.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -39,6 +39,7 @@
this.navigationBar.element.addEventListener("mousedown", this._consoleResizerMouseDown.bind(this));
this._toggleDrawerButton = new WI.ToggleButtonNavigationItem("toggle-drawer", WI.UIString("Hide Console"), WI.UIString("Show Console"), "Images/HideConsoleDrawer.svg", "Images/ShowConsoleDrawer.svg");
+ this._toggleDrawerButton.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
this._toggleDrawerButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, () => { WI.toggleSplitConsole(); });
this.navigationBar.insertNavigationItem(this._toggleDrawerButton, 0);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowser.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowser.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowser.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -57,13 +57,14 @@
this._backNavigationItem = new WI.ButtonNavigationItem("back", WI.UIString("Back (%s)").format(this._backKeyboardShortcut.displayName), backButtonImage, 8, 13);
this._backNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, goBack);
this._backNavigationItem.enabled = false;
- this._navigationBar.addNavigationItem(this._backNavigationItem);
this._forwardNavigationItem = new WI.ButtonNavigationItem("forward", WI.UIString("Forward (%s)").format(this._forwardKeyboardShortcut.displayName), forwardButtonImage, 8, 13);
this._forwardNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, goForward);
this._forwardNavigationItem.enabled = false;
- this._navigationBar.addNavigationItem(this._forwardNavigationItem);
+ let navigationButtonsGroup = new WI.GroupNavigationItem([this._backNavigationItem, this._forwardNavigationItem]);
+ this._navigationBar.addNavigationItem(navigationButtonsGroup);
+
this._navigationBar.addNavigationItem(new WI.DividerNavigationItem);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowserTabContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowserTabContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowserTabContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -56,6 +56,7 @@
this._showNavigationSidebarItem = new WI.ActivateButtonNavigationItem("toggle-navigation-sidebar", showToolTip, hideToolTip, image, 16, 16);
this._showNavigationSidebarItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, WI.toggleNavigationSidebar, WI);
this._showNavigationSidebarItem.activated = !WI.navigationSidebar.collapsed;
+ this._showNavigationSidebarItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
this._contentBrowser.navigationBar.insertNavigationItem(this._showNavigationSidebarItem, 0);
this._contentBrowser.navigationBar.insertNavigationItem(new WI.DividerNavigationItem, 1);
@@ -72,6 +73,7 @@
this._showDetailsSidebarItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, WI.toggleDetailsSidebar, WI);
this._showDetailsSidebarItem.activated = !WI.detailsSidebar.collapsed;
this._showDetailsSidebarItem.enabled = false;
+ this._showDetailsSidebarItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
this._contentBrowser.navigationBar.addNavigationItem(new WI.DividerNavigationItem);
this._contentBrowser.navigationBar.addNavigationItem(this._showDetailsSidebarItem);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -34,6 +34,7 @@
this._compositingBordersButtonNavigationItem = new WI.ActivateButtonNavigationItem("layer-borders", WI.UIString("Show compositing borders"), WI.UIString("Hide compositing borders"), "Images/LayerBorders.svg", 13, 13);
this._compositingBordersButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleCompositingBorders, this);
this._compositingBordersButtonNavigationItem.enabled = !!PageAgent.getCompositingBordersVisible;
+ this._compositingBordersButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
WI.showPaintRectsSetting.addEventListener(WI.Setting.Event.Changed, this._showPaintRectsSettingChanged, this);
this._paintFlashingButtonNavigationItem = new WI.ActivateButtonNavigationItem("paint-flashing", WI.UIString("Enable paint flashing"), WI.UIString("Disable paint flashing"), "Images/Paint.svg", 16, 16);
@@ -40,15 +41,18 @@
this._paintFlashingButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePaintFlashing, this);
this._paintFlashingButtonNavigationItem.enabled = !!PageAgent.setShowPaintRects;
this._paintFlashingButtonNavigationItem.activated = PageAgent.setShowPaintRects && WI.showPaintRectsSetting.value;
+ this._paintFlashingButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
WI.showShadowDOMSetting.addEventListener(WI.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
this._showsShadowDOMButtonNavigationItem = new WI.ActivateButtonNavigationItem("shows-shadow-DOM", WI.UIString("Show shadow DOM nodes"), WI.UIString("Hide shadow DOM nodes"), "Images/ShadowDOM.svg", 13, 13);
this._showsShadowDOMButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleShowsShadowDOMSetting, this);
+ this._showsShadowDOMButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showShadowDOMSettingChanged();
WI.showPrintStylesSetting.addEventListener(WI.Setting.Event.Changed, this._showPrintStylesSettingChanged, this);
this._showPrintStylesButtonNavigationItem = new WI.ActivateButtonNavigationItem("print-styles", WI.UIString("Force Print Media Styles"), WI.UIString("Use Default Media Styles"), "Images/Printer.svg", 16, 16);
this._showPrintStylesButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePrintStylesSetting, this);
+ this._showPrintStylesButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showPrintStylesSettingChanged();
this.element.classList.add("dom-tree");
Copied: trunk/Source/WebInspectorUI/UserInterface/Views/GroupNavigationItem.js (from rev 221337, trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css) (0 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/GroupNavigationItem.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GroupNavigationItem.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -0,0 +1,76 @@
+/*
+ * Copyright (C) 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.GroupNavigationItem = class GroupNavigationItem extends WI.NavigationItem
+{
+ constructor(navigationItems)
+ {
+ console.assert(Array.isArray(navigationItems));
+
+ super();
+
+ this._navigationItems = navigationItems;
+
+ for (let item of this._navigationItems) {
+ console.assert(item instanceof WI.NavigationItem);
+ this.element.appendChild(item.element);
+ }
+ }
+
+ // Public
+
+ get navigationItems() { return this._navigationItems; }
+
+ get minimumWidth()
+ {
+ return this._navigationItems.reduce((total, item) => total + item.minimumWidth, 0);
+ }
+
+ // Protected
+
+ updateLayout(expandOnly)
+ {
+ super.updateLayout(expandOnly);
+
+ for (let item of this._navigationItems)
+ item.updateLayout(expandOnly);
+ }
+
+ didAttach(navigationBar)
+ {
+ super.didAttach(navigationBar);
+
+ for (let item of this._navigationItems)
+ item.didAttach(navigationBar);
+ }
+
+ didDetach()
+ {
+ for (let item of this._navigationItems)
+ item.didDetach();
+
+ super.didDetach();
+ }
+}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathNavigationItem.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathNavigationItem.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathNavigationItem.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -100,6 +100,8 @@
updateLayout(expandOnly)
{
+ super.updateLayout(expandOnly);
+
var navigationBar = this.parentNavigationBar;
if (!navigationBar)
return;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ImageResourceContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ImageResourceContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ImageResourceContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -34,6 +34,7 @@
const toolTip = WI.UIString("Show Grid");
const activatedToolTip = WI.UIString("Hide Grid");
this._showGridButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-grid", toolTip, activatedToolTip, "Images/NavigationItemCheckers.svg", 13, 13);
+ this._showGridButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showGridButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._showGridButtonClicked, this);
this._showGridButtonNavigationItem.activated = !!WI.settings.showImageGrid.value;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -81,6 +81,7 @@
this._refreshButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._refreshButtonClicked, this);
this._clearButtonNavigationItem = new WI.ButtonNavigationItem("indexed-database-object-store-clear", WI.UIString("Clear object store"), "Images/NavigationItemTrash.svg", 15, 15);
+ this._clearButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._clearButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._clearButtonClicked, this);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LogContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/LogContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LogContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -77,12 +77,15 @@
this._scopeBar.addEventListener(WI.ScopeBar.Event.SelectionChanged, this._scopeBarSelectionDidChange, this);
this._garbageCollectNavigationItem = new WI.ButtonNavigationItem("clear-log", WI.UIString("Collect garbage"), "Images/NavigationItemGarbageCollect.svg", 16, 16);
+ this._garbageCollectNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._garbageCollectNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._garbageCollect, this);
this._clearLogNavigationItem = new WI.ButtonNavigationItem("clear-log", WI.UIString("Clear log (%s or %s)").format(WI.clearKeyboardShortcut.displayName, this._logViewController.messagesAlternateClearKeyboardShortcut.displayName), "Images/NavigationItemClear.svg", 16, 16);
+ this._clearLogNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._clearLogNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._clearLog, this);
this._showConsoleTabNavigationItem = new WI.ButtonNavigationItem("show-tab", WI.UIString("Show Console tab"), "Images/SplitToggleUp.svg", 16, 16);
+ this._showConsoleTabNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
this._showConsoleTabNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._showConsoleTab, this);
this.messagesElement.addEventListener("contextmenu", this._handleContextMenuEvent.bind(this), false);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css 2017-08-30 04:04:02 UTC (rev 221338)
@@ -47,3 +47,7 @@
height: auto;
outline: none;
}
+
+.navigation-bar .item.force-hidden {
+ display: none;
+}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -69,7 +69,7 @@
if (navigationItem.parentNavigationBar)
navigationItem.parentNavigationBar.removeNavigationItem(navigationItem);
- navigationItem._parentNavigationBar = this;
+ navigationItem.didAttach(this);
console.assert(index >= 0 && index <= this._navigationItems.length);
index = Math.max(0, Math.min(index, this._navigationItems.length));
@@ -106,7 +106,7 @@
if (navigationItem._parentNavigationBar !== this)
return null;
- navigationItem._parentNavigationBar = null;
+ navigationItem.didDetach();
if (this._selectedNavigationItem === navigationItem)
this.selectedNavigationItem = null;
@@ -174,7 +174,28 @@
findNavigationItem(identifier)
{
- return this._navigationItems.find((item) => item.identifier === identifier) || null;
+ function matchingSelfOrChild(item) {
+ if (item.identifier === identifier)
+ return item;
+
+ if (item instanceof WI.GroupNavigationItem) {
+ for (let childItem of item.navigationItems) {
+ let result = matchingSelfOrChild(childItem);
+ if (result)
+ return result;
+ }
+ }
+
+ return null;
+ }
+
+ for (let item of this._navigationItems) {
+ let result = matchingSelfOrChild(item);
+ if (result)
+ return result;
+ }
+
+ return null;
}
needsLayout()
@@ -194,19 +215,29 @@
// Remove the collapsed style class to test if the items can fit at full width.
this.element.classList.remove(WI.NavigationBar.CollapsedStyleClassName);
+ function forceItemHidden(item, hidden) {
+ item[WI.NavigationBar.ForceHiddenSymbol] = hidden;
+ item.element.classList.toggle("force-hidden", hidden);
+ }
+
+ function isDivider(item) {
+ return item instanceof WI.DividerNavigationItem;
+ }
+
// Tell each navigation item to update to full width if needed.
- for (let navigationItem of this._navigationItems)
- navigationItem.updateLayout(true);
+ for (let item of this._navigationItems) {
+ forceItemHidden(item, false);
+ item.updateLayout(true);
+ }
- let totalItemWidth = 0;
- for (let navigationItem of this._navigationItems) {
- // Skip flexible space items since they can take up no space at the minimum width.
- if (navigationItem instanceof WI.FlexibleSpaceNavigationItem)
- continue;
+ let visibleNavigationItems = this._visibleNavigationItems;
- totalItemWidth += navigationItem.element.realOffsetWidth;
+ function calculateVisibleItemWidth() {
+ return visibleNavigationItems.reduce((total, item) => total + item.width, 0);
}
+ let totalItemWidth = calculateVisibleItemWidth();
+
const barWidth = this.element.realOffsetWidth;
// Add the collapsed class back if the items are wider than the bar.
@@ -214,8 +245,38 @@
this.element.classList.add(WI.NavigationBar.CollapsedStyleClassName);
// Give each navigation item the opportunity to collapse further.
- for (let navigationItem of this._navigationItems)
- navigationItem.updateLayout(false);
+ for (let item of visibleNavigationItems)
+ item.updateLayout(false);
+
+ totalItemWidth = calculateVisibleItemWidth();
+ if (totalItemWidth <= barWidth)
+ return;
+
+ // Hide visible items, starting with the lowest priority item, until the
+ // bar fits the available width.
+ visibleNavigationItems.sort((a, b) => a.visibilityPriority - b.visibilityPriority);
+
+ while (totalItemWidth > barWidth && visibleNavigationItems.length) {
+ let navigationItem = visibleNavigationItems.shift();
+ totalItemWidth -= navigationItem.width;
+ forceItemHidden(navigationItem, true);
+ }
+
+ visibleNavigationItems = this._visibleNavigationItems;
+
+ // Hide leading, trailing, and consecutive dividers.
+ let previousItem = null;
+ for (let item of visibleNavigationItems) {
+ if (isDivider(item) && (!previousItem || isDivider(previousItem))) {
+ forceItemHidden(item);
+ continue;
+ }
+
+ previousItem = item;
+ }
+
+ if (isDivider(previousItem))
+ forceItemHidden(previousItem);
}
// Private
@@ -369,15 +430,8 @@
if (!wasCollapsed)
this.element.classList.add(WI.NavigationBar.CollapsedStyleClassName);
- let totalItemWidth = 0;
- for (let item of this._navigationItems) {
- // Skip flexible space items since they can take up no space at the minimum width.
- if (item instanceof WI.FlexibleSpaceNavigationItem)
- continue;
+ let totalItemWidth = this._visibleNavigationItems.reduce((total, item) => item.minimumWidth, 0);
- totalItemWidth += item.minimumWidth;
- }
-
// Remove the collapsed style class if we were not collapsed before.
if (!wasCollapsed)
this.element.classList.remove(WI.NavigationBar.CollapsedStyleClassName);
@@ -384,8 +438,22 @@
return totalItemWidth;
}
+
+ get _visibleNavigationItems()
+ {
+ return this._navigationItems.filter((item) => {
+ if (item instanceof WI.FlexibleSpaceNavigationItem)
+ return false;
+ if (item.hidden || item[WI.NavigationBar.ForceHiddenSymbol])
+ return false;
+ return true;
+ });
+ }
};
+WI.NavigationBar.CachedWidthSymbol = Symbol("cached-width");
+WI.NavigationBar.ForceHiddenSymbol = Symbol("force-hidden");
+
WI.NavigationBar.CollapsedStyleClassName = "collapsed";
WI.NavigationBar.Event = {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationItem.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationItem.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationItem.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -34,6 +34,8 @@
this._element = document.createElement("div");
this._hidden = false;
this._parentNavigationBar = null;
+ this._visibilityPriority = WI.NavigationItem.VisibilityPriority.Normal;
+ this._cachedWidth = NaN;
if (role)
this._element.setAttribute("role", role);
@@ -48,12 +50,24 @@
get identifier() { return this._identifier; }
get element() { return this._element; }
- get minimumWidth() { return this._element.realOffsetWidth; }
+ get minimumWidth() { return this.width; }
get parentNavigationBar() { return this._parentNavigationBar; }
+ get width()
+ {
+ if (isNaN(this._cachedWidth))
+ this._cachedWidth = this._element.realOffsetWidth;
+ return this._cachedWidth;
+ }
+
+ get visibilityPriority() { return this._visibilityPriority; }
+ set visibilityPriority(priority) { this._visibilityPriority = priority; }
+
updateLayout(expandOnly)
{
// Implemented by subclasses.
+
+ this._cachedWidth = NaN;
}
get hidden()
@@ -74,6 +88,20 @@
this._parentNavigationBar.needsLayout();
}
+ // Protected
+
+ didAttach(navigationBar)
+ {
+ console.assert(navigationBar instanceof WI.NavigationBar);
+ this._parentNavigationBar = navigationBar;
+ }
+
+ didDetach()
+ {
+ this._cachedWidth = NaN;
+ this._parentNavigationBar = null;
+ }
+
// Private
get _classNames()
@@ -86,3 +114,9 @@
return classNames;
}
};
+
+WI.NavigationItem.VisibilityPriority = {
+ Low: -100,
+ Normal: 0,
+ High: 100,
+};
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkGridContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkGridContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkGridContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -141,6 +141,7 @@
}
this._clearNetworkItemsNavigationItem = new WI.ButtonNavigationItem("clear-network-items", WI.UIString("Clear Network Items (%s)").format(WI.clearKeyboardShortcut.displayName), "Images/NavigationItemClear.svg", 16, 16);
+ this._clearNetworkItemsNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._clearNetworkItemsNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, () => this.reset());
this._pendingRecords = [];
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -62,6 +62,8 @@
updateLayout(expandOnly)
{
+ super.updateLayout(expandOnly);
+
if (expandOnly)
return;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RecordingContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/RecordingContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RecordingContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -49,6 +49,7 @@
}
this._showGridButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-grid", WI.UIString("Show Grid"), WI.UIString("Hide Grid"), "Images/NavigationItemCheckers.svg", 13, 13);
+ this._showGridButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._showGridButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._showGridButtonClicked, this);
this._showGridButtonNavigationItem.activated = !!WI.settings.showImageGrid.value;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScriptContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ScriptContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScriptContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -57,6 +57,7 @@
this._prettyPrintButtonNavigationItem = new WI.ActivateButtonNavigationItem("pretty-print", toolTip, activatedToolTip, "Images/NavigationItemCurleyBraces.svg", 13, 13);
this._prettyPrintButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePrettyPrint, this);
this._prettyPrintButtonNavigationItem.enabled = false; // Enabled when the text editor is populated with content.
+ this._prettyPrintButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
var toolTipTypes = WI.UIString("Show type information");
var activatedToolTipTypes = WI.UIString("Hide type information");
@@ -63,6 +64,8 @@
this._showTypesButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-types", toolTipTypes, activatedToolTipTypes, "Images/NavigationItemTypes.svg", 13, 14);
this._showTypesButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleTypeAnnotations, this);
this._showTypesButtonNavigationItem.enabled = false;
+ this._showTypesButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
+
WI.showJavaScriptTypeInformationSetting.addEventListener(WI.Setting.Event.Changed, this._showJavaScriptTypeInformationSettingChanged, this);
let toolTipCodeCoverage = WI.UIString("Fade unexecuted code");
@@ -70,6 +73,8 @@
this._codeCoverageButtonNavigationItem = new WI.ActivateButtonNavigationItem("code-coverage", toolTipCodeCoverage, activatedToolTipCodeCoverage, "Images/NavigationItemCodeCoverage.svg", 13, 14);
this._codeCoverageButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleUnexecutedCodeHighlights, this);
this._codeCoverageButtonNavigationItem.enabled = false;
+ this._codeCoverageButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
+
WI.enableControlFlowProfilerSetting.addEventListener(WI.Setting.Event.Changed, this._enableControlFlowProfilerSettingChanged, this);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TextContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TextContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TextContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -46,16 +46,19 @@
this._prettyPrintButtonNavigationItem = new WI.ActivateButtonNavigationItem("pretty-print", toolTip, activatedToolTip, "Images/NavigationItemCurleyBraces.svg", 13, 13);
this._prettyPrintButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePrettyPrint, this);
this._prettyPrintButtonNavigationItem.enabled = this._textEditor.canBeFormatted();
+ this._prettyPrintButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
var toolTipTypes = WI.UIString("Show type information");
var activatedToolTipTypes = WI.UIString("Hide type information");
this._showTypesButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-types", toolTipTypes, activatedToolTipTypes, "Images/NavigationItemTypes.svg", 13, 14);
this._showTypesButtonNavigationItem.enabled = false;
+ this._showTypesButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
let toolTipCodeCoverage = WI.UIString("Fade unexecuted code");
let activatedToolTipCodeCoverage = WI.UIString("Do not fade unexecuted code");
this._codeCoverageButtonNavigationItem = new WI.ActivateButtonNavigationItem("code-coverage", toolTipCodeCoverage, activatedToolTipCodeCoverage, "Images/NavigationItemCodeCoverage.svg", 13, 14);
this._codeCoverageButtonNavigationItem.enabled = false;
+ this._codeCoverageButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
}
// Public
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TextResourceContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TextResourceContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TextResourceContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -48,6 +48,7 @@
this._prettyPrintButtonNavigationItem = new WI.ActivateButtonNavigationItem("pretty-print", toolTip, activatedToolTip, "Images/NavigationItemCurleyBraces.svg", 13, 13);
this._prettyPrintButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePrettyPrint, this);
this._prettyPrintButtonNavigationItem.enabled = false; // Enabled when the text editor is populated with content.
+ this._prettyPrintButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
var toolTipTypes = WI.UIString("Show type information");
var activatedToolTipTypes = WI.UIString("Hide type information");
@@ -54,6 +55,7 @@
this._showTypesButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-types", toolTipTypes, activatedToolTipTypes, "Images/NavigationItemTypes.svg", 13, 14);
this._showTypesButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleTypeAnnotations, this);
this._showTypesButtonNavigationItem.enabled = false;
+ this._showTypesButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
WI.showJavaScriptTypeInformationSetting.addEventListener(WI.Setting.Event.Changed, this._showJavaScriptTypeInformationSettingChanged, this);
let toolTipCodeCoverage = WI.UIString("Fade unexecuted code");
@@ -61,6 +63,7 @@
this._codeCoverageButtonNavigationItem = new WI.ActivateButtonNavigationItem("code-coverage", toolTipCodeCoverage, activatedToolTipCodeCoverage, "Images/NavigationItemCodeCoverage.svg", 13, 14);
this._codeCoverageButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleUnexecutedCodeHighlights, this);
this._codeCoverageButtonNavigationItem.enabled = false;
+ this._codeCoverageButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
WI.enableControlFlowProfilerSetting.addEventListener(WI.Setting.Event.Changed, this._enableControlFlowProfilerSettingChanged, this);
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -57,6 +57,7 @@
this.addSubview(this._timelineContentBrowser);
this._clearTimelineNavigationItem = new WI.ButtonNavigationItem("clear-timeline", WI.UIString("Clear Timeline (%s)").format(WI.clearKeyboardShortcut.displayName), "Images/NavigationItemClear.svg", 16, 16);
+ this._clearTimelineNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._clearTimelineNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._clearTimeline, this);
this._overviewTimelineView = new WI.OverviewTimelineView(recording);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineTabContentView.js (221337 => 221338)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineTabContentView.js 2017-08-30 02:54:31 UTC (rev 221337)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineTabContentView.js 2017-08-30 04:04:02 UTC (rev 221338)
@@ -50,6 +50,7 @@
let toolTip = WI.UIString("Start recording (%s)\nCreate new recording (%s)").format(this._toggleRecordingShortcut.displayName, this._toggleNewRecordingShortcut.displayName);
let altToolTip = WI.UIString("Stop recording (%s)").format(this._toggleRecordingShortcut.displayName);
this._recordButton = new WI.ToggleButtonNavigationItem("record-start-stop", toolTip, altToolTip, "Images/Record.svg", "Images/Stop.svg", 13, 13);
+ this._recordButton.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
this._recordButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._recordButtonClicked, this);
this.contentBrowser.navigationBar.insertNavigationItem(this._recordButton, 0);
@@ -58,9 +59,10 @@
let timelinesNavigationItem = new WI.RadioButtonNavigationItem(WI.TimelineOverview.ViewMode.Timelines, WI.UIString("Events"));
let renderingFramesNavigationItem = new WI.RadioButtonNavigationItem(WI.TimelineOverview.ViewMode.RenderingFrames, WI.UIString("Frames"));
- this.contentBrowser.navigationBar.insertNavigationItem(timelinesNavigationItem, 1);
- this.contentBrowser.navigationBar.insertNavigationItem(renderingFramesNavigationItem, 2);
+ let viewModeGroup = new WI.GroupNavigationItem([timelinesNavigationItem, renderingFramesNavigationItem]);
+ viewModeGroup.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
+ this.contentBrowser.navigationBar.insertNavigationItem(viewModeGroup, 1);
this.contentBrowser.navigationBar.addEventListener(WI.NavigationBar.Event.NavigationItemSelected, this._viewModeSelected, this);
}
