Add support for changing the sort order of the resources. The two sorting
authortimothy@apple.com <timothy@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 14 Apr 2008 17:05:29 +0000 (17:05 +0000)
committertimothy@apple.com <timothy@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 14 Apr 2008 17:05:29 +0000 (17:05 +0000)
methods supported current are Time and Size.

Reviewed by Adam Roben.

* page/inspector/Images/statusbarMenuButton.png: Added.
* page/inspector/Images/statusbarMenuButtonSelected.png: Added.
* page/inspector/ResourcesPanel.js:
(WebInspector.ResourcesPanel): Create the status bar menu button and
setup the event listener to call _changeSortingFunction. Each option in
the select references a sorting function.
(WebInspector.ResourcesPanel.get statusBarItems): Add the sorting menu to the
items returned.
(WebInspector.ResourcesPanel._changeSortingFunction): Set the sorting function
to the selected option's function in the sorting menu.
* page/inspector/inspector.css: Added CSS rules for select elements in status bars.

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

WebCore/ChangeLog
WebCore/page/inspector/Images/statusbarMenuButton.png [new file with mode: 0644]
WebCore/page/inspector/Images/statusbarMenuButtonSelected.png [new file with mode: 0644]
WebCore/page/inspector/ResourcesPanel.js
WebCore/page/inspector/inspector.css

index 218b275..e38b4d7 100644 (file)
@@ -1,5 +1,24 @@
 2008-04-14  Timothy Hatcher  <timothy@apple.com>
 
+        Add support for changing the sort order of the resources. The two sorting
+        methods supported current are Time and Size.
+
+        Reviewed by Adam Roben.
+
+        * page/inspector/Images/statusbarMenuButton.png: Added.
+        * page/inspector/Images/statusbarMenuButtonSelected.png: Added.
+        * page/inspector/ResourcesPanel.js:
+        (WebInspector.ResourcesPanel): Create the status bar menu button and
+        setup the event listener to call _changeSortingFunction. Each option in
+        the select references a sorting function.
+        (WebInspector.ResourcesPanel.get statusBarItems): Add the sorting menu to the
+        items returned.
+        (WebInspector.ResourcesPanel._changeSortingFunction): Set the sorting function
+        to the selected option's function in the sorting menu.
+        * page/inspector/inspector.css: Added CSS rules for select elements in status bars.
+
+2008-04-14  Timothy Hatcher  <timothy@apple.com>
+
         Add support for toggling between small and large resource rows
         in the Resources panel.
 
diff --git a/WebCore/page/inspector/Images/statusbarMenuButton.png b/WebCore/page/inspector/Images/statusbarMenuButton.png
new file mode 100644 (file)
index 0000000..9b3abdd
Binary files /dev/null and b/WebCore/page/inspector/Images/statusbarMenuButton.png differ
diff --git a/WebCore/page/inspector/Images/statusbarMenuButtonSelected.png b/WebCore/page/inspector/Images/statusbarMenuButtonSelected.png
new file mode 100644 (file)
index 0000000..8189c43
Binary files /dev/null and b/WebCore/page/inspector/Images/statusbarMenuButtonSelected.png differ
index fe4d9a9..a44032f 100644 (file)
@@ -109,6 +109,20 @@ WebInspector.ResourcesPanel = function()
     this.largerResourcesButton.title = WebInspector.UIString("Use large resource rows.");
     this.largerResourcesButton.addEventListener("click", this._toggleLargerResources.bind(this), false);
 
+    this.sortingSelectElement = document.createElement("select");
+    this.sortingSelectElement.className = "status-bar-item";
+    this.sortingSelectElement.addEventListener("change", this._changeSortingFunction.bind(this), false);
+
+    var sortingOption = document.createElement("option");
+    sortingOption.label = WebInspector.UIString("Sort by Time");
+    sortingOption.sortingFunction = WebInspector.ResourceSidebarTreeElement.CompareByTime;
+    this.sortingSelectElement.appendChild(sortingOption);
+
+    sortingOption = document.createElement("option");
+    sortingOption.label = WebInspector.UIString("Sort by Size");
+    sortingOption.sortingFunction = WebInspector.ResourceSidebarTreeElement.CompareByDescendingSize;
+    this.sortingSelectElement.appendChild(sortingOption);
+
     this.sortingFunction = WebInspector.ResourceSidebarTreeElement.CompareByTime;
 
     this.reset();
@@ -126,7 +140,7 @@ WebInspector.ResourcesPanel.prototype = {
 
     get statusBarItems()
     {
-        return [this.largerResourcesButton];
+        return [this.largerResourcesButton, this.sortingSelectElement];
     },
 
     show: function()
@@ -815,6 +829,12 @@ WebInspector.ResourcesPanel.prototype = {
         }
     },
 
+    _changeSortingFunction: function()
+    {
+        var selectedOption = this.sortingSelectElement[this.sortingSelectElement.selectedIndex];
+        this.sortingFunction = selectedOption.sortingFunction;
+    },
+
     _createResourceView: function(resource)
     {
         if (resource.finished && !resource.failed) {
index 7d93ae7..fc8f231 100644 (file)
@@ -210,6 +210,24 @@ button.status-bar-item:active {
     background-position: 32px 0;
 }
 
+select.status-bar-item {
+    min-width: 48px;
+    border-width: 0 17px 0 2px;
+    outline: none;
+    padding: 0 2px 0 6px;
+    font-weight: bold;
+    color: rgb(48, 48, 48);
+    text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0;
+    -webkit-border-image: url(Images/statusbarMenuButton.png) 0 17 0 2;
+    -webkit-border-radius: 0;
+    -webkit-appearance: none;
+}
+
+select.status-bar-item:active {
+    color: black;
+    -webkit-border-image: url(Images/statusbarMenuButtonSelected.png) 0 17 0 2;
+}
+
 #dock-status-bar-item {
     background-image: url(Images/dockButtons.png);
 }