Web Inspector: Resources: add a "Show Grid" navigation item for the Images collection
authordrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 30 Jul 2019 05:29:59 +0000 (05:29 +0000)
committerdrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 30 Jul 2019 05:29:59 +0000 (05:29 +0000)
https://bugs.webkit.org/show_bug.cgi?id=200260

Reviewed by Joseph Pecoraro.

Each subview `WI.ImageResourceContentView` already listens for changes to the underlying
`WI.settings.showImageGrid` and adds the `.show-grid` class if enabled. As such, this change
just adds a `WI.ButtonNavigationItem` for toggling `WI.settings.showImageGrid` from the
Images "folder".

* UserInterface/Views/ResourceCollectionContentView.js:
(WI.ResourceCollectionContentView):
(WI.ResourceCollectionContentView.prototype.get navigationItems):
(WI.ResourceCollectionContentView.prototype.attached): Added.
(WI.ResourceCollectionContentView.prototype.detached): Added.
(WI.ResourceCollectionContentView.prototype._updateImageTypeScopeBar):
Drive-by: hide the image type `WI.ScopeBar` if there's only one type of image.
(WI.ResourceCollectionContentView.prototype._handleShowGridButtonClicked): Added.
(WI.ResourceCollectionContentView.prototype._handleShowImageGridSettingChanged): Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@248004 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/ResourceCollectionContentView.js

index 06f142e..85256cc 100644 (file)
@@ -1,5 +1,27 @@
 2019-07-29  Devin Rousso  <drousso@apple.com>
 
+        Web Inspector: Resources: add a "Show Grid" navigation item for the Images collection
+        https://bugs.webkit.org/show_bug.cgi?id=200260
+
+        Reviewed by Joseph Pecoraro.
+
+        Each subview `WI.ImageResourceContentView` already listens for changes to the underlying
+        `WI.settings.showImageGrid` and adds the `.show-grid` class if enabled. As such, this change
+        just adds a `WI.ButtonNavigationItem` for toggling `WI.settings.showImageGrid` from the
+        Images "folder".
+
+        * UserInterface/Views/ResourceCollectionContentView.js:
+        (WI.ResourceCollectionContentView):
+        (WI.ResourceCollectionContentView.prototype.get navigationItems):
+        (WI.ResourceCollectionContentView.prototype.attached): Added.
+        (WI.ResourceCollectionContentView.prototype.detached): Added.
+        (WI.ResourceCollectionContentView.prototype._updateImageTypeScopeBar):
+        Drive-by: hide the image type `WI.ScopeBar` if there's only one type of image.
+        (WI.ResourceCollectionContentView.prototype._handleShowGridButtonClicked): Added.
+        (WI.ResourceCollectionContentView.prototype._handleShowImageGridSettingChanged): Added.
+
+2019-07-29  Devin Rousso  <drousso@apple.com>
+
         Web Inspector: add -webkit-* keywords for *-height CSS properties
         https://bugs.webkit.org/show_bug.cgi?id=200240
 
index 4c546ae..5696abf 100644 (file)
@@ -36,6 +36,11 @@ WI.ResourceCollectionContentView = class ResourceCollectionContentView extends W
         super(collection, contentViewConstructor);
 
         if (collection.resourceType === WI.Resource.Type.Image) {
+            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._handleShowGridButtonClicked, this);
+            this._showGridButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
+            this._showGridButtonNavigationItem.activated = !!WI.settings.showImageGrid.value;
+
             let allItem = new WI.ScopeBarItem("all", WI.UIString("All"));
 
             let items = [allItem];
@@ -68,14 +73,31 @@ WI.ResourceCollectionContentView = class ResourceCollectionContentView extends W
 
     get navigationItems()
     {
-        let navigationItems = super.navigationItems;
+        let navigationItems = [];
         if (this._imageTypeScopeBar)
-            navigationItems.unshift(this._imageTypeScopeBar);
+            navigationItems.push(this._imageTypeScopeBar);
+        if (this._showGridButtonNavigationItem)
+            navigationItems.push(this._showGridButtonNavigationItem);
+        navigationItems = navigationItems.concat(super.navigationItems);
         return navigationItems;
     }
 
     // Protected
 
+    attached()
+    {
+        super.attached();
+
+        WI.settings.showImageGrid.addEventListener(WI.Setting.Event.Changed, this._handleShowImageGridSettingChanged, this);
+    }
+
+    detached()
+    {
+        WI.settings.showImageGrid.removeEventListener(null, null, this);
+
+        super.detached();
+    }
+
     contentViewAdded(contentView)
     {
         console.assert(contentView instanceof WI.ResourceContentView);
@@ -99,6 +121,7 @@ WI.ResourceCollectionContentView = class ResourceCollectionContentView extends W
     _updateImageTypeScopeBar()
     {
         let extensions = new Set;
+        let visibleExtensions = 0;
 
         for (let resource of this.representedObject)
             extensions.add(WI.fileExtensionForMIMEType(resource.mimeType));
@@ -108,7 +131,18 @@ WI.ResourceCollectionContentView = class ResourceCollectionContentView extends W
             item.hidden = hidden;
             if (hidden && item.selected)
                 item.selected = false;
+
+            if (!item.hidden)
+                ++visibleExtensions;
         }
+
+        this._imageTypeScopeBar.hidden = visibleExtensions <= 1;
+        this.dispatchEventToListeners(WI.ContentView.Event.NavigationItemsDidChange);
+    }
+
+    _handleShowGridButtonClicked(event)
+    {
+        WI.settings.showImageGrid.value = !this._showGridButtonNavigationItem.activated;
     }
 
     _handleImageTypeSelectionChanged()
@@ -123,6 +157,12 @@ WI.ResourceCollectionContentView = class ResourceCollectionContentView extends W
         }
     }
 
+    _handleShowImageGridSettingChanged(event)
+    {
+        let activated = WI.settings.showImageGrid.value;
+        this._showGridButtonNavigationItem.activated = activated;
+    }
+
     _handleContentError(event)
     {
         if (event && event.target)