Web Inspector: make DataGrid a view
authorpfeldman@chromium.org <pfeldman@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 24 Oct 2011 09:25:22 +0000 (09:25 +0000)
committerpfeldman@chromium.org <pfeldman@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 24 Oct 2011 09:25:22 +0000 (09:25 +0000)
https://bugs.webkit.org/show_bug.cgi?id=70695

Patch by Pavel Feldman <pfeldman@chromium.org> on 2011-10-24
Reviewed by Yury Semikhatsky.

* inspector/front-end/ApplicationCacheItemsView.js:
(WebInspector.ApplicationCacheItemsView.prototype._createDataGrid):
* inspector/front-end/CookieItemsView.js:
(WebInspector.CookieItemsView.prototype._updateWithCookies):
(WebInspector.SimpleCookiesTable):
(WebInspector.SimpleCookiesTable.prototype.setCookies):
* inspector/front-end/CookiesTable.js:
(WebInspector.CookiesTable):
* inspector/front-end/DOMStorageItemsView.js:
(WebInspector.DOMStorageItemsView.prototype._showDOMStorageEntries):
* inspector/front-end/DataGrid.js:
(WebInspector.DataGrid):
(WebInspector.DataGrid.prototype.onResize):
* inspector/front-end/DatabaseQueryView.js:
(WebInspector.DatabaseQueryView.prototype._queryFinished):
(WebInspector.DatabaseQueryView.prototype._queryError):
(WebInspector.DatabaseQueryView.prototype._appendViewQueryResult):
(WebInspector.DatabaseQueryView.prototype._appendErrorQueryResult):
(WebInspector.DatabaseQueryView.prototype._appendQueryResult):
* inspector/front-end/DatabaseTableView.js:
(WebInspector.DatabaseTableView.prototype._queryFinished):
* inspector/front-end/DetailedHeapshotView.js:
(WebInspector.DetailedHeapshotView.prototype.wasShown.profileCallback2):
(WebInspector.DetailedHeapshotView.prototype.wasShown):
(WebInspector.DetailedHeapshotView.prototype.onResize):
* inspector/front-end/NetworkPanel.js:
(WebInspector.NetworkLogView.prototype.onResize):
(WebInspector.NetworkLogView.prototype._createTable):
* inspector/front-end/ProfileView.js:
* inspector/front-end/ResourceCookiesView.js:
(WebInspector.ResourceCookiesView.prototype._buildCookiesTable):
* inspector/front-end/ResourceView.js:
(WebInspector.ResourceView):

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

13 files changed:
Source/WebCore/ChangeLog
Source/WebCore/inspector/front-end/ApplicationCacheItemsView.js
Source/WebCore/inspector/front-end/CookieItemsView.js
Source/WebCore/inspector/front-end/CookiesTable.js
Source/WebCore/inspector/front-end/DOMStorageItemsView.js
Source/WebCore/inspector/front-end/DataGrid.js
Source/WebCore/inspector/front-end/DatabaseQueryView.js
Source/WebCore/inspector/front-end/DatabaseTableView.js
Source/WebCore/inspector/front-end/DetailedHeapshotView.js
Source/WebCore/inspector/front-end/NetworkPanel.js
Source/WebCore/inspector/front-end/ProfileView.js
Source/WebCore/inspector/front-end/ResourceCookiesView.js
Source/WebCore/inspector/front-end/View.js

index be8eb61bdbbac1eba8252767596a9655d2cc663d..a4115604d39d1a4666e3ec07363f66557502778e 100755 (executable)
@@ -1,3 +1,44 @@
+2011-10-24  Pavel Feldman  <pfeldman@chromium.org>
+
+        Web Inspector: make DataGrid a view
+        https://bugs.webkit.org/show_bug.cgi?id=70695
+
+        Reviewed by Yury Semikhatsky.
+
+        * inspector/front-end/ApplicationCacheItemsView.js:
+        (WebInspector.ApplicationCacheItemsView.prototype._createDataGrid):
+        * inspector/front-end/CookieItemsView.js:
+        (WebInspector.CookieItemsView.prototype._updateWithCookies):
+        (WebInspector.SimpleCookiesTable):
+        (WebInspector.SimpleCookiesTable.prototype.setCookies):
+        * inspector/front-end/CookiesTable.js:
+        (WebInspector.CookiesTable):
+        * inspector/front-end/DOMStorageItemsView.js:
+        (WebInspector.DOMStorageItemsView.prototype._showDOMStorageEntries):
+        * inspector/front-end/DataGrid.js:
+        (WebInspector.DataGrid):
+        (WebInspector.DataGrid.prototype.onResize):
+        * inspector/front-end/DatabaseQueryView.js:
+        (WebInspector.DatabaseQueryView.prototype._queryFinished):
+        (WebInspector.DatabaseQueryView.prototype._queryError):
+        (WebInspector.DatabaseQueryView.prototype._appendViewQueryResult):
+        (WebInspector.DatabaseQueryView.prototype._appendErrorQueryResult):
+        (WebInspector.DatabaseQueryView.prototype._appendQueryResult):
+        * inspector/front-end/DatabaseTableView.js:
+        (WebInspector.DatabaseTableView.prototype._queryFinished):
+        * inspector/front-end/DetailedHeapshotView.js:
+        (WebInspector.DetailedHeapshotView.prototype.wasShown.profileCallback2):
+        (WebInspector.DetailedHeapshotView.prototype.wasShown):
+        (WebInspector.DetailedHeapshotView.prototype.onResize):
+        * inspector/front-end/NetworkPanel.js:
+        (WebInspector.NetworkLogView.prototype.onResize):
+        (WebInspector.NetworkLogView.prototype._createTable):
+        * inspector/front-end/ProfileView.js:
+        * inspector/front-end/ResourceCookiesView.js:
+        (WebInspector.ResourceCookiesView.prototype._buildCookiesTable):
+        * inspector/front-end/ResourceView.js:
+        (WebInspector.ResourceView):
+
 2011-10-24  Yosifumi Inoue  <yosin@chromium.org>
 
         [Forms] Setting defaultValue should hide an input placeholder.
index c9d6edace333cfb30facb12b3ccd6c3d6e92000e..9b398e444f29b13aa39df6ac3f6909da8efff067 100644 (file)
@@ -200,9 +200,8 @@ WebInspector.ApplicationCacheItemsView.prototype = {
         columns[2].aligned = "right";
         columns[2].sortable = true;
         this._dataGrid = new WebInspector.DataGrid(columns);
-        this.element.appendChild(this._dataGrid.element);
+        this._dataGrid.show(this.element);
         this._dataGrid.addEventListener("sorting changed", this._populateDataGrid, this);
-        this._dataGrid.updateWidths();
     },
 
     _populateDataGrid: function()
@@ -251,12 +250,6 @@ WebInspector.ApplicationCacheItemsView.prototype = {
             this._dataGrid.children[0].selected = true;
     },
 
-    onResize: function()
-    {
-        if (this._dataGrid)
-            this._dataGrid.updateWidths();
-    },
-
     _deleteButtonClicked: function(event)
     {
         if (!this._dataGrid || !this._dataGrid.selectedNode)
index 48aa2934169fc667e7f56256123adc2c651f7aa0..e2d4b19dba5941d0dbade180be2f53d21af58ec5 100644 (file)
@@ -69,12 +69,6 @@ WebInspector.CookieItemsView.prototype = {
         this._deleteButton.visible = false;
     },
 
-    onResize: function()
-    {
-        if (this._cookiesTable)
-            this._cookiesTable.updateWidths();
-    },
-
     _update: function()
     {
         WebInspector.Cookies.getCookiesAsync(this._updateWithCookies.bind(this));
@@ -89,24 +83,21 @@ WebInspector.CookieItemsView.prototype = {
             this._emptyView.show(this.element);
             this._deleteButton.visible = false;
             if (this._cookiesTable)
-                this._cookiesTable.element.addStyleClass("hidden");
+                this._cookiesTable.detach();
             return;
         }
 
-        if (!this._cookiesTable) {
+        if (!this._cookiesTable)
             this._cookiesTable = isAdvanced ? new WebInspector.CookiesTable(this._cookieDomain, false, this._deleteCookie.bind(this), this._update.bind(this)) : new WebInspector.SimpleCookiesTable();
-            this.element.appendChild(this._cookiesTable.element);
-        }
 
         this._cookiesTable.setCookies(this._cookies);
-        this._cookiesTable.element.removeStyleClass("hidden");
         this._emptyView.detach();
+        this._cookiesTable.show(this.element);
         if (isAdvanced) {
             this._treeElement.subtitle = String.sprintf(WebInspector.UIString("%d cookies (%s)"), this._cookies.length,
                 Number.bytesToString(this._totalSize));
             this._deleteButton.visible = true;
         }
-        this._cookiesTable.updateWidths();
     },
 
     _filterCookiesForDomain: function(allCookies)
@@ -171,10 +162,12 @@ WebInspector.CookieItemsView.prototype.__proto__ = WebInspector.View.prototype;
 
 /**
  * @constructor
+ * @extends {WebInspector.View}
  */
 WebInspector.SimpleCookiesTable = function()
 {
-    this.element = document.createElement("div");
+    WebInspector.View.call(this);
+
     var columns = {};
     columns[0] = {};
     columns[1] = {};
@@ -183,8 +176,7 @@ WebInspector.SimpleCookiesTable = function()
 
     this._dataGrid = new WebInspector.DataGrid(columns);
     this._dataGrid.autoSizeColumns(20, 80);
-    this.element.appendChild(this._dataGrid.element);
-    this._dataGrid.updateWidths();
+    this._dataGrid.show(this.element);
 }
 
 WebInspector.SimpleCookiesTable.prototype = {
@@ -205,15 +197,10 @@ WebInspector.SimpleCookiesTable.prototype = {
             this._dataGrid.appendChild(node);
         }
         this._dataGrid.children[0].selected = true;
-    },
-
-    onResize: function()
-    {
-        if (this._dataGrid)
-            this._dataGrid.updateWidths();
     }
 }
 
+WebInspector.SimpleCookiesTable.prototype.__proto__ = WebInspector.View.prototype;
 
 WebInspector.Cookies = {}
 
index 71fdbf769dc2efc590a522b4becb0041e95ca274..61f804e2cc9e74b0b746af28d4be7f9262bb0b89 100644 (file)
 
 /**
  * @constructor
+ * @extends {WebInspector.View}
  * @param {function(PageAgent.Cookie)=} deleteCallback
  * @param {function()=} refreshCallback
  */
 WebInspector.CookiesTable = function(cookieDomain, expandable, deleteCallback, refreshCallback)
 {
+    WebInspector.View.call(this);
+    this.element.className = "fill";
+
     this._cookieDomain = cookieDomain;
 
     var columns = { 0: {}, 1: {}, 2: {}, 3: {}, 4: {}, 5: {}, 6: {}, 7: {} };
@@ -71,7 +75,7 @@ WebInspector.CookiesTable = function(cookieDomain, expandable, deleteCallback, r
     this._dataGrid.addEventListener("sorting changed", this._rebuildTable, this);
     this._dataGrid.refreshCallback = refreshCallback;
 
-    this.element = this._dataGrid.element;
+    this._dataGrid.show(this.element);
     this._data = [];
 }
 
@@ -211,3 +215,5 @@ WebInspector.CookiesTable.prototype = {
         deleteCallback(node.cookie);
     }
 }
+
+WebInspector.CookiesTable.prototype.__proto__ = WebInspector.View.prototype;
index b8694f7c394295bff669538083d2ad5a029d7b93..c5ea67b8ffdfdbe374f0e90dc030b52ca8704553 100644 (file)
@@ -72,17 +72,11 @@ WebInspector.DOMStorageItemsView.prototype = {
             return;
 
         this._dataGrid = this._dataGridForDOMStorageEntries(entries);
-        this.element.appendChild(this._dataGrid.element);
+        this._dataGrid.show(this.element);
         this._dataGrid.autoSizeColumns(10);
         this.deleteButton.visible = true;
     },
 
-    onResize: function()
-    {
-        if (this._dataGrid)
-            this._dataGrid.updateWidths();
-    },
-
     _dataGridForDOMStorageEntries: function(entries)
     {
         var columns = {};
index bc3dce7c596fc816b85eeca242664fbc91ba88dd..ceb4b645adcd2ecb14700a8ff063dbda8b620a1e 100644 (file)
 
 /**
  * @constructor
- * @extends {WebInspector.Object}
+ * @extends {WebInspector.View}
  * @param {function(WebInspector.DataGridNode, number, string, string)=} editCallback
  * @param {function(WebInspector.DataGridNode)=} deleteCallback
  */
 WebInspector.DataGrid = function(columns, editCallback, deleteCallback)
 {
-    this.element = document.createElement("div");
+    WebInspector.View.call(this);
+
     this.element.className = "data-grid";
     this.element.tabIndex = 0;
     this.element.addEventListener("keydown", this._keyDown.bind(this), false);
@@ -486,6 +487,11 @@ WebInspector.DataGrid.prototype = {
         return result;
     },
 
+    onResize: function()
+    {
+        this.updateWidths();
+    },
+
     // Updates the widths of the table, including the positions of the column
     // resizers.
     //
@@ -1108,7 +1114,7 @@ WebInspector.DataGrid.ResizeMethod = {
     Last: "last"
 }
 
-WebInspector.DataGrid.prototype.__proto__ = WebInspector.Object.prototype;
+WebInspector.DataGrid.prototype.__proto__ = WebInspector.View.prototype;
 
 /**
  * @constructor
index e04354c0daf6cfb51f8374e120360cf8821ed938..469e9d5e195fb5d4337c8c5867a7c168731bad08 100644 (file)
@@ -150,7 +150,7 @@ WebInspector.DatabaseQueryView.prototype = {
 
         if (dataGrid) {
             dataGrid.element.addStyleClass("inline");
-            this._appendQueryResult(trimmedQuery, dataGrid.element);
+            this._appendViewQueryResult(trimmedQuery, dataGrid);
             dataGrid.autoSizeColumns(5);
         }
 
@@ -167,16 +167,39 @@ WebInspector.DatabaseQueryView.prototype = {
         else
             var message = WebInspector.UIString("An unexpected error %s occurred.", error.code);
 
-        this._appendQueryResult(query, message, "error");
+        this._appendErrorQueryResult(query, message);
     },
 
     /**
-     * @param {string=} resultClassName
+     * @param {string} query
+     * @param {WebInspector.View} view
      */
-    _appendQueryResult: function(query, result, resultClassName)
+    _appendViewQueryResult: function(query, view)
+    {
+        var resultElement = this._appendQueryResult(query);
+        view.show(resultElement);
+
+        this.promptElement.scrollIntoView(false);
+    },
+
+    /**
+     * @param {string} query
+     * @param {string} errorText
+     */
+    _appendErrorQueryResult: function(query, errorText)
+    {
+        var resultElement = this._appendQueryResult(query);
+        resultElement.addStyleClass("error")
+        resultElement.textContent = errorText;
+
+        this.promptElement.scrollIntoView(false);
+    },
+
+    _appendQueryResult: function(query)
     {
         var element = document.createElement("div");
         element.className = "database-user-query";
+        this.element.insertBefore(element, this.promptElement);
 
         var commandTextElement = document.createElement("span");
         commandTextElement.className = "database-query-text";
@@ -185,20 +208,8 @@ WebInspector.DatabaseQueryView.prototype = {
 
         var resultElement = document.createElement("div");
         resultElement.className = "database-query-result";
-
-        if (resultClassName)
-            resultElement.addStyleClass(resultClassName);
-
-        if (typeof result === "string" || result instanceof String)
-            resultElement.textContent = result;
-        else if (result && result.nodeName)
-            resultElement.appendChild(result);
-
-        if (resultElement.childNodes.length)
-            element.appendChild(resultElement);
-
-        this.element.insertBefore(element, this.promptElement);
-        this.promptElement.scrollIntoView(false);
+        element.appendChild(resultElement);
+        return resultElement;
     }
 }
 
index 576ece356f1e334f80e0ab4497b2aaaab6d56e04..f4346d20bc54bc993105990a5281422d3d360f49 100644 (file)
@@ -59,7 +59,7 @@ WebInspector.DatabaseTableView.prototype = {
 
     _queryFinished: function(columnNames, values)
     {
-        this.element.removeChildren();
+        this.detachChildViews();
 
         var dataGrid = WebInspector.DataGrid.createSortableDataGrid(columnNames, values);
         if (!dataGrid) {
@@ -67,8 +67,7 @@ WebInspector.DatabaseTableView.prototype = {
             this._emptyView.show(this.element);
             return;
         }
-
-        this.element.appendChild(dataGrid.element);
+        dataGrid.show(this.element);
         dataGrid.autoSizeColumns(5);
     },
 
index 683ffa75e389292ea333c097893506fbed3959b4..2fa6b51c7361246638957864fc7a5666f3d83409 100644 (file)
@@ -585,27 +585,27 @@ WebInspector.DetailedHeapshotView = function(parent, profile)
     this.containmentDataGrid = new WebInspector.HeapSnapshotContainmentDataGrid();
     this.containmentDataGrid.element.addEventListener("click", this._mouseClickInContentsGrid.bind(this), true);
     this.containmentDataGrid.element.addEventListener("mousedown", this._mouseDownInContentsGrid.bind(this), true);
-    this.containmentView.element.appendChild(this.containmentDataGrid.element);
+    this.containmentDataGrid.show(this.containmentView.element);
 
     this.constructorsView = new WebInspector.View();
     this.constructorsView.element.addStyleClass("view");
     this.constructorsDataGrid = new WebInspector.HeapSnapshotConstructorsDataGrid();
     this.constructorsDataGrid.element.addEventListener("click", this._mouseClickInContentsGrid.bind(this), true);
     this.constructorsDataGrid.element.addEventListener("mousedown", this._mouseDownInContentsGrid.bind(this), true);
-    this.constructorsView.element.appendChild(this.constructorsDataGrid.element);
+    this.constructorsDataGrid.show(this.constructorsView.element);
 
     this.diffView = new WebInspector.View();
     this.diffView.element.addStyleClass("view");
     this.diffDataGrid = new WebInspector.HeapSnapshotDiffDataGrid();
     this.diffDataGrid.element.addEventListener("click", this._mouseClickInContentsGrid.bind(this), true);
-    this.diffView.element.appendChild(this.diffDataGrid.element);
+    this.diffDataGrid.show(this.diffView.element);
 
     this.dominatorView = new WebInspector.View();
     this.dominatorView.element.addStyleClass("view");
     this.dominatorDataGrid = new WebInspector.HeapSnapshotDominatorsDataGrid();
     this.dominatorDataGrid.element.addEventListener("click", this._mouseClickInContentsGrid.bind(this), true);
     this.dominatorDataGrid.element.addEventListener("mousedown", this._mouseDownInContentsGrid.bind(this), true);
-    this.dominatorView.element.appendChild(this.dominatorDataGrid.element);
+    this.dominatorDataGrid.show(this.dominatorView.element);
 
     this.retainmentViewHeader = document.createElement("div");
     this.retainmentViewHeader.addStyleClass("retainers-view-header");
@@ -633,7 +633,7 @@ WebInspector.DetailedHeapshotView = function(parent, profile)
     this.retainmentView.element.addStyleClass("retaining-paths-view");
     this.retainmentDataGrid = new WebInspector.HeapSnapshotRetainingPathsList();
     this.retainmentDataGrid.element.addEventListener("click", this._mouseClickInRetainmentGrid.bind(this), true);
-    this.retainmentView.element.appendChild(this.retainmentDataGrid.element);
+    this.retainmentDataGrid.show(this.retainmentView.element);
     this.retainmentView.show(this.element);
     this.retainmentDataGrid.reset();
 
@@ -751,7 +751,6 @@ WebInspector.DetailedHeapshotView.prototype = {
 
         function profileCallback2() {
             this.currentView.show(this.element);
-            this.dataGrid.updateWidths();
         }
     },
 
@@ -762,9 +761,6 @@ WebInspector.DetailedHeapshotView.prototype = {
 
     onResize: function()
     {
-        if (this.dataGrid)
-            this.dataGrid.updateWidths();
-
         var height = this.retainmentView.element.clientHeight;
         this._updateRetainmentViewHeight(height);
     },
index 83c83e6b31a5d590faecdd80792338b33bdbc91a..a774700fd46e647c07a141bfc475ef4dc37c0b9a 100644 (file)
@@ -125,7 +125,6 @@ WebInspector.NetworkLogView.prototype = {
 
     onResize: function()
     {
-        this._dataGrid.updateWidths();
         this._updateOffscreenRows();
     },
 
@@ -188,8 +187,7 @@ WebInspector.NetworkLogView.prototype = {
         this._dataGrid.resizeMethod = WebInspector.DataGrid.ResizeMethod.Last;
         this._dataGrid.element.addStyleClass("network-log-grid");
         this._dataGrid.element.addEventListener("contextmenu", this._contextMenu.bind(this), true);
-
-        this.element.appendChild(this._dataGrid.element);
+        this._dataGrid.show(this.element);
 
         // Event listeners need to be added _after_ we attach to the document, so that owner document is properly update.
         this._dataGrid.addEventListener("sorting changed", this._sortItems, this);
index 5904ac631f1c4c5371dfd51778b7f534844d03ee..66e73b59a459a7e969141a3d7b3a4e33d60058c0 100644 (file)
@@ -50,7 +50,7 @@ WebInspector.CPUProfileView = function(profile)
     this.dataGrid = new WebInspector.DataGrid(columns);
     this.dataGrid.addEventListener("sorting changed", this._sortData, this);
     this.dataGrid.element.addEventListener("mousedown", this._mouseDownInDataGrid.bind(this), true);
-    this.element.appendChild(this.dataGrid.element);
+    this.dataGrid.show(this.element);
 
     this.viewSelectElement = document.createElement("select");
     this.viewSelectElement.className = "status-bar-item";
@@ -169,12 +169,6 @@ WebInspector.CPUProfileView.prototype = {
         this._currentSearchResultIndex = -1;
     },
 
-    onResize: function()
-    {
-        if (this.dataGrid)
-            this.dataGrid.updateWidths();
-    },
-
     refresh: function()
     {
         var selectedProfileNode = this.dataGrid.selectedNode ? this.dataGrid.selectedNode.profileNode : null;
index 652692f976392eae4dd5cfc45293ae507e7a251d..cbff47d27c71f7df25add07db524977e91bb7a1e 100644 (file)
@@ -58,12 +58,6 @@ WebInspector.ResourceCookiesView.prototype = {
             this._buildCookiesTable();
     },
 
-    onResize: function()
-    {
-        if (this._cookiesTable)
-            this._cookiesTable.updateWidths();
-    },
-
     get _gotCookies()
     {
         return !!(this._resource.requestCookies || this._resource.responseCookies);
@@ -71,12 +65,12 @@ WebInspector.ResourceCookiesView.prototype = {
 
     _buildCookiesTable: function()
     {
-        this.element.removeChildren();
+        this.detachChildViews();
 
         this._cookiesTable = new WebInspector.CookiesTable(null, true);
         this._cookiesTable.addCookiesFolder(WebInspector.UIString("Request Cookies"), this._resource.requestCookies);
         this._cookiesTable.addCookiesFolder(WebInspector.UIString("Response Cookies"), this._resource.responseCookies);
-        this.element.appendChild(this._cookiesTable.element);
+        this._cookiesTable.show(this.element);
     },
 
     _refreshCookies: function()
index d8c8a248da5bb6ab920c6acc33a2b0eef7e2bf13..18719accf674b69a093293f9cb9e01de0ca443b5 100644 (file)
@@ -176,6 +176,13 @@ WebInspector.View.prototype = {
         this._visible = false;
     },
 
+    detachChildViews: function()
+    {
+        var children = this._children.slice();
+        for (var i = 0; i < children.length; ++i)
+            children[i].detach();
+    },
+
     elementsToRestoreScrollPositionsFor: function()
     {
         return [this.element];