Web Inspector: Network Tab - Set column initial widths to try allow w…

…aterfall column to expand more by default

https://bugs.webkit.org/show_bug.cgi?id=178142
<rdar://problem/34918233>

Patch by Joseph Pecoraro <pecoraro@apple.com> on 2017-10-10
Reviewed by Brian Burg.

* UserInterface/Views/NetworkTableContentView.js:
(WI.NetworkTableContentView.prototype.initialLayout):
Provide initial widths for many columns where the max could fit
but we'd prefer a smaller than max initial width in wide cases.

* UserInterface/Views/Table.js:
(WI.Table.prototype._resizeColumnsAndFiller):
When auto sizing all columns use the preferred initial widths.

* UserInterface/Views/TableColumn.js:
(WI.TableColumn.prototype.get preferredInitialWidth):
Save the initial width.

Canonical link: https://commits.webkit.org/194390@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@223147 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog

@@ -1,3 +1,24 @@
+2017-10-10  Joseph Pecoraro  <pecoraro@apple.com>
+
+        Web Inspector: Network Tab - Set column initial widths to try allow waterfall column to expand more by default
+        https://bugs.webkit.org/show_bug.cgi?id=178142
+        <rdar://problem/34918233>
+
+        Reviewed by Brian Burg.
+
+        * UserInterface/Views/NetworkTableContentView.js:
+        (WI.NetworkTableContentView.prototype.initialLayout):
+        Provide initial widths for many columns where the max could fit
+        but we'd prefer a smaller than max initial width in wide cases.
+
+        * UserInterface/Views/Table.js:
+        (WI.Table.prototype._resizeColumnsAndFiller):
+        When auto sizing all columns use the preferred initial widths.
+
+        * UserInterface/Views/TableColumn.js:
+        (WI.TableColumn.prototype.get preferredInitialWidth):
+        Save the initial width.
+
 2017-10-10  Ross Kirsling  <ross.kirsling@sony.com>
 
         Web Inspector: Views should explicitly remove event listeners from managers/Frame

Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js

@@ -477,9 +477,9 @@ WI.NetworkTableContentView = class NetworkTableContentView extends WI.ContentVie
     initialLayout()
     {
         this._nameColumn = new WI.TableColumn("name", WI.UIString("Name"), {
-            initialWidth: this._nameColumnWidthSetting.value,
             minWidth: WI.Sidebar.AbsoluteMinimumWidth,
             maxWidth: 500,
+            initialWidth: this._nameColumnWidthSetting.value,
             resizeType: WI.TableColumn.ResizeType.Locked,
         });
 
@@ -488,29 +488,34 @@ WI.NetworkTableContentView = class NetworkTableContentView extends WI.ContentVie
         this._domainColumn = new WI.TableColumn("domain", WI.UIString("Domain"), {
             minWidth: 120,
             maxWidth: 200,
+            initialWidth: 150,
         });
 
         this._typeColumn = new WI.TableColumn("type", WI.UIString("Type"), {
             minWidth: 70,
             maxWidth: 120,
+            initialWidth: 90,
         });
 
         this._mimeTypeColumn = new WI.TableColumn("mimeType", WI.UIString("MIME Type"), {
             hidden: true,
             minWidth: 100,
             maxWidth: 150,
+            initialWidth: 120,
         });
 
         this._methodColumn = new WI.TableColumn("method", WI.UIString("Method"), {
             hidden: true,
             minWidth: 55,
             maxWidth: 80,
+            initialWidth: 65,
         });
 
         this._schemeColumn = new WI.TableColumn("scheme", WI.UIString("Scheme"), {
             hidden: true,
             minWidth: 55,
             maxWidth: 80,
+            initialWidth: 65,
         });
 
         this._statusColumn = new WI.TableColumn("status", WI.UIString("Status"), {
@@ -524,12 +529,14 @@ WI.NetworkTableContentView = class NetworkTableContentView extends WI.ContentVie
             hidden: true,
             minWidth: 65,
             maxWidth: 80,
+            initialWidth: 75,
         });
 
         this._priorityColumn = new WI.TableColumn("priority", WI.UIString("Priority"), {
             hidden: true,
             minWidth: 65,
             maxWidth: 80,
+            initialWidth: 70,
         });
 
         this._remoteAddressColumn = new WI.TableColumn("remoteAddress", WI.UIString("IP Address"), {
@@ -541,25 +548,29 @@ WI.NetworkTableContentView = class NetworkTableContentView extends WI.ContentVie
             hidden: true,
             minWidth: 50,
             maxWidth: 120,
+            initialWidth: 80,
             align: "right",
         });
 
         this._resourceSizeColumn = new WI.TableColumn("resourceSize", WI.UIString("Resource Size"), {
             hidden: true,
             minWidth: 80,
             maxWidth: 100,
+            initialWidth: 80,
             align: "right",
         });
 
         this._transferSizeColumn = new WI.TableColumn("transferSize", WI.UIString("Transfer Size"), {
             minWidth: 100,
             maxWidth: 150,
+            initialWidth: 100,
             align: "right",
         });
 
         this._timeColumn = new WI.TableColumn("time", WI.UIString("Time"), {
             minWidth: 65,
             maxWidth: 90,
+            initialWidth: 65,
             align: "right",
         });
 

Source/WebInspectorUI/UserInterface/Views/Table.js

@@ -820,6 +820,13 @@ WI.Table = class Table extends WI.View
                     this._columnWidths[i] = column.width;
             }
 
+            // Best fit with the preferred initial width for flexible columns.
+            bestFit.call(this, (column, width) => {
+                if (!column.preferredInitialWidth || width <= column.preferredInitialWidth)
+                    return -1;
+                return column.preferredInitialWidth;
+            });
+
             // Best fit max size flexible columns. May make more pixels available for other columns.
             bestFit.call(this, (column, width) => {
                 if (!column.maxWidth || width <= column.maxWidth)

Source/WebInspectorUI/UserInterface/Views/TableColumn.js

@@ -41,6 +41,7 @@ WI.TableColumn = class TableColumn extends WI.Object
         this._width = initialWidth || NaN;
         this._minWidth = minWidth || 50;
         this._maxWidth = maxWidth || 0;
+        this._initialWidth = initialWidth || NaN;
         this._hidden = hidden || false;
         this._defaultHidden = hidden || false;
         this._sortable = typeof sortable === "boolean" ? sortable : true;
@@ -59,6 +60,7 @@ WI.TableColumn = class TableColumn extends WI.Object
     get name() { return this._name; }
     get minWidth() { return this._minWidth; }
     get maxWidth() { return this._maxWidth; }
+    get preferredInitialWidth() { return this._initialWidth; }
     get defaultHidden() { return this._defaultHidden; }
     get sortable() { return this._sortable; }
     get hideable() { return this._hideable; }