[SCM] WebKit Debian packaging branch, webkit-1.2, updated. upstream/1.1.90-6072-g9a69373
pfeldman at chromium.org
pfeldman at chromium.org
Wed Apr 7 23:06:46 UTC 2010
The following commit has been merged in the webkit-1.2 branch:
commit 4fcee405d216536fc6acd1b024e79b218b70c28f
Author: pfeldman at chromium.org <pfeldman at chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Date: Mon Oct 26 21:35:50 2009 +0000
2009-10-26 Pavel Feldman <pfeldman at chromium.org>
Reviewed by Timothy Hatcher.
Web Inspector: Extract AbstractTimelinePanel that will be a base
class for ResourcesPanel and TimelinePanel.
https://bugs.webkit.org/show_bug.cgi?id=30776
* WebCore.gypi:
* WebCore.vcproj/WebCore.vcproj:
* inspector/front-end/AbstractTimelinePanel.js: Added.
(WebInspector.AbstractTimelinePanel):
(WebInspector.AbstractTimelinePanel.prototype.get categories):
(WebInspector.AbstractTimelinePanel.prototype.showCategory):
(WebInspector.AbstractTimelinePanel.prototype.hideCategory):
(WebInspector.AbstractTimelinePanel.prototype.createTimelinePanels):
(WebInspector.AbstractTimelinePanel.prototype._createFilterPanel.createFilterElement):
(WebInspector.AbstractTimelinePanel.prototype._createFilterPanel):
(WebInspector.AbstractTimelinePanel.prototype.filter):
(WebInspector.AbstractTimelinePanel.prototype._updateFilter):
(WebInspector.AbstractTimelinePanel.prototype._createGraph):
(WebInspector.AbstractTimelinePanel.prototype.updateGraphDividersIfNeeded):
(WebInspector.AbstractTimelinePanel.prototype._updateSummaryGraph):
(WebInspector.AbstractTimelinePanel.prototype._updateDividersLabelBarPosition):
(WebInspector.AbstractTimelinePanel.prototype.get needsRefresh):
(WebInspector.AbstractTimelinePanel.prototype.set needsRefresh):
(WebInspector.AbstractTimelinePanel.prototype.refreshIfNeeded):
(WebInspector.AbstractTimelinePanel.prototype.show):
(WebInspector.AbstractTimelinePanel.prototype.resize):
(WebInspector.AbstractTimelinePanel.prototype.updateMainViewWidth):
(WebInspector.TimelineCalculator):
(WebInspector.TimelineCalculator.prototype.computeSummaryValues):
(WebInspector.TimelineCalculator.prototype.computeBarGraphPercentages):
(WebInspector.TimelineCalculator.prototype.computeBarGraphLabels):
(WebInspector.TimelineCalculator.prototype.get boundarySpan):
(WebInspector.TimelineCalculator.prototype.updateBoundaries):
(WebInspector.TimelineCalculator.prototype.reset):
(WebInspector.TimelineCalculator.prototype._value):
(WebInspector.TimelineCalculator.prototype.formatValue):
* inspector/front-end/ResourceCategory.js:
(WebInspector.ResourceCategory):
* inspector/front-end/ResourcesPanel.js:
(WebInspector.ResourcesPanel):
(WebInspector.ResourcesPanel.prototype.toolbarItemClass.get toolbarItemLabel):
(WebInspector.ResourcesPanel.prototype.get statusBarItems):
(WebInspector.ResourcesPanel.prototype.get categories):
(WebInspector.ResourcesPanel.prototype.showCategory):
(WebInspector.ResourcesPanel.prototype.hideCategory):
(WebInspector.ResourcesPanel.prototype.isCategoryVisible):
(WebInspector.ResourcesPanel.prototype.populateSidebar):
(WebInspector.ResourcesPanel.prototype.createPanelEnabler):
(WebInspector.ResourcesPanel.prototype.createStatusbarButtons):
(WebInspector.ResourcesPanel.prototype.set mainResourceLoadTime):
(WebInspector.ResourcesPanel.prototype.set mainResourceDOMContentTime):
(WebInspector.ResourcesPanel.prototype.show):
(WebInspector.ResourcesPanel.prototype.resize):
(WebInspector.ResourcesPanel.prototype.reset):
(WebInspector.ResourcesPanel.prototype.updateGraphDividersIfNeeded):
(WebInspector.ResourcesPanel.prototype.updateMainViewWidth):
(WebInspector.ResourceTimeCalculator):
(WebInspector.ResourceTransferSizeCalculator):
(WebInspector.ResourceTransferSizeCalculator.prototype.computeBarGraphLabels):
* inspector/front-end/SummaryBar.js:
(WebInspector.SummaryBar.prototype.update):
* inspector/front-end/WebKit.qrc:
* inspector/front-end/inspector.html:
* inspector/front-end/inspector.js:
(WebInspector.loaded):
git-svn-id: http://svn.webkit.org/repository/webkit/trunk@50095 268f45cc-cd09-0410-ab3c-d52691b4dbfc
diff --git a/WebCore/ChangeLog b/WebCore/ChangeLog
index 81f5c16..d8fed32 100644
--- a/WebCore/ChangeLog
+++ b/WebCore/ChangeLog
@@ -1,3 +1,73 @@
+2009-10-26 Pavel Feldman <pfeldman at chromium.org>
+
+ Reviewed by Timothy Hatcher.
+
+ Web Inspector: Extract AbstractTimelinePanel that will be a base
+ class for ResourcesPanel and TimelinePanel.
+
+ https://bugs.webkit.org/show_bug.cgi?id=30776
+
+ * WebCore.gypi:
+ * WebCore.vcproj/WebCore.vcproj:
+ * inspector/front-end/AbstractTimelinePanel.js: Added.
+ (WebInspector.AbstractTimelinePanel):
+ (WebInspector.AbstractTimelinePanel.prototype.get categories):
+ (WebInspector.AbstractTimelinePanel.prototype.showCategory):
+ (WebInspector.AbstractTimelinePanel.prototype.hideCategory):
+ (WebInspector.AbstractTimelinePanel.prototype.createTimelinePanels):
+ (WebInspector.AbstractTimelinePanel.prototype._createFilterPanel.createFilterElement):
+ (WebInspector.AbstractTimelinePanel.prototype._createFilterPanel):
+ (WebInspector.AbstractTimelinePanel.prototype.filter):
+ (WebInspector.AbstractTimelinePanel.prototype._updateFilter):
+ (WebInspector.AbstractTimelinePanel.prototype._createGraph):
+ (WebInspector.AbstractTimelinePanel.prototype.updateGraphDividersIfNeeded):
+ (WebInspector.AbstractTimelinePanel.prototype._updateSummaryGraph):
+ (WebInspector.AbstractTimelinePanel.prototype._updateDividersLabelBarPosition):
+ (WebInspector.AbstractTimelinePanel.prototype.get needsRefresh):
+ (WebInspector.AbstractTimelinePanel.prototype.set needsRefresh):
+ (WebInspector.AbstractTimelinePanel.prototype.refreshIfNeeded):
+ (WebInspector.AbstractTimelinePanel.prototype.show):
+ (WebInspector.AbstractTimelinePanel.prototype.resize):
+ (WebInspector.AbstractTimelinePanel.prototype.updateMainViewWidth):
+ (WebInspector.TimelineCalculator):
+ (WebInspector.TimelineCalculator.prototype.computeSummaryValues):
+ (WebInspector.TimelineCalculator.prototype.computeBarGraphPercentages):
+ (WebInspector.TimelineCalculator.prototype.computeBarGraphLabels):
+ (WebInspector.TimelineCalculator.prototype.get boundarySpan):
+ (WebInspector.TimelineCalculator.prototype.updateBoundaries):
+ (WebInspector.TimelineCalculator.prototype.reset):
+ (WebInspector.TimelineCalculator.prototype._value):
+ (WebInspector.TimelineCalculator.prototype.formatValue):
+ * inspector/front-end/ResourceCategory.js:
+ (WebInspector.ResourceCategory):
+ * inspector/front-end/ResourcesPanel.js:
+ (WebInspector.ResourcesPanel):
+ (WebInspector.ResourcesPanel.prototype.toolbarItemClass.get toolbarItemLabel):
+ (WebInspector.ResourcesPanel.prototype.get statusBarItems):
+ (WebInspector.ResourcesPanel.prototype.get categories):
+ (WebInspector.ResourcesPanel.prototype.showCategory):
+ (WebInspector.ResourcesPanel.prototype.hideCategory):
+ (WebInspector.ResourcesPanel.prototype.isCategoryVisible):
+ (WebInspector.ResourcesPanel.prototype.populateSidebar):
+ (WebInspector.ResourcesPanel.prototype.createPanelEnabler):
+ (WebInspector.ResourcesPanel.prototype.createStatusbarButtons):
+ (WebInspector.ResourcesPanel.prototype.set mainResourceLoadTime):
+ (WebInspector.ResourcesPanel.prototype.set mainResourceDOMContentTime):
+ (WebInspector.ResourcesPanel.prototype.show):
+ (WebInspector.ResourcesPanel.prototype.resize):
+ (WebInspector.ResourcesPanel.prototype.reset):
+ (WebInspector.ResourcesPanel.prototype.updateGraphDividersIfNeeded):
+ (WebInspector.ResourcesPanel.prototype.updateMainViewWidth):
+ (WebInspector.ResourceTimeCalculator):
+ (WebInspector.ResourceTransferSizeCalculator):
+ (WebInspector.ResourceTransferSizeCalculator.prototype.computeBarGraphLabels):
+ * inspector/front-end/SummaryBar.js:
+ (WebInspector.SummaryBar.prototype.update):
+ * inspector/front-end/WebKit.qrc:
+ * inspector/front-end/inspector.html:
+ * inspector/front-end/inspector.js:
+ (WebInspector.loaded):
+
2009-10-26 Avi Drissman <avi at google.com>
Reviewed by Darin Adler.
diff --git a/WebCore/WebCore.gypi b/WebCore/WebCore.gypi
index 0362936..a790a8c 100644
--- a/WebCore/WebCore.gypi
+++ b/WebCore/WebCore.gypi
@@ -3587,6 +3587,7 @@
'webinspector_files': [
'inspector/front-end/inspector.html',
+ 'inspector/front-end/AbstractTimelinePanel.js',
'inspector/front-end/BottomUpProfileDataGridTree.js',
'inspector/front-end/Breakpoint.js',
'inspector/front-end/BreakpointsSidebarPane.js',
diff --git a/WebCore/WebCore.vcproj/WebCore.vcproj b/WebCore/WebCore.vcproj/WebCore.vcproj
index 97b79c9..89e35e6 100644
--- a/WebCore/WebCore.vcproj/WebCore.vcproj
+++ b/WebCore/WebCore.vcproj/WebCore.vcproj
@@ -36270,6 +36270,10 @@
Name="front-end"
>
<File
+ RelativePath="..\inspector\front-end\AbstractTimelinePanel.js"
+ >
+ </File>
+ <File
RelativePath="..\inspector\front-end\BottomUpProfileDataGridTree.js"
>
</File>
diff --git a/WebCore/inspector/front-end/AbstractTimelinePanel.js b/WebCore/inspector/front-end/AbstractTimelinePanel.js
new file mode 100644
index 0000000..e9e0ad1
--- /dev/null
+++ b/WebCore/inspector/front-end/AbstractTimelinePanel.js
@@ -0,0 +1,367 @@
+/*
+ * Copyright (C) 2007, 2008 Apple Inc. All rights reserved.
+ * Copyright (C) 2008, 2009 Anthony Ricaud <rik at webkit.org>
+ * Copyright (C) 2009 Google 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.
+ * 3. Neither the name of Apple Computer, Inc. ("Apple") nor the names of
+ * its contributors may be used to endorse or promote products derived
+ * from this software without specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE 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 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.
+ */
+
+WebInspector.AbstractTimelinePanel = function()
+{
+ WebInspector.Panel.call(this);
+}
+
+WebInspector.AbstractTimelinePanel.prototype = {
+ get categories()
+ {
+ // Should be implemented by the concrete subclasses.
+ return {};
+ },
+
+ showCategory: function(category)
+ {
+ // Should be implemented by the concrete subclasses.
+ },
+
+ hideCategory: function(category)
+ {
+ // Should be implemented by the concrete subclasses.
+ },
+
+ createInterface: function()
+ {
+ this._createFilterPanel();
+
+ this.containerElement = document.createElement("div");
+ this.containerElement.id = "resources-container";
+ this.containerElement.addEventListener("scroll", this._updateDividersLabelBarPosition.bind(this), false);
+ this.element.appendChild(this.containerElement);
+
+ this.createSidebar(this.containerElement, this.element);
+ this.sidebarElement.id = "resources-sidebar";
+ this.populateSidebar();
+
+ this._createGraph();
+ },
+
+ _createFilterPanel: function()
+ {
+ this.filterBarElement = document.createElement("div");
+ this.filterBarElement.id = "resources-filter";
+ this.filterBarElement.className = "scope-bar";
+ this.element.appendChild(this.filterBarElement);
+
+ function createFilterElement(category)
+ {
+ if (category === "all")
+ var label = WebInspector.UIString("All");
+ else if (this.categories[category])
+ var label = this.categories[category].title;
+
+ var categoryElement = document.createElement("li");
+ categoryElement.category = category;
+ categoryElement.addStyleClass(category);
+ categoryElement.appendChild(document.createTextNode(label));
+ categoryElement.addEventListener("click", this._updateFilter.bind(this), false);
+ this.filterBarElement.appendChild(categoryElement);
+
+ return categoryElement;
+ }
+
+ this.filterAllElement = createFilterElement.call(this, "all");
+
+ // Add a divider
+ var dividerElement = document.createElement("div");
+ dividerElement.addStyleClass("divider");
+ this.filterBarElement.appendChild(dividerElement);
+
+ for (var category in this.categories)
+ createFilterElement.call(this, category);
+ },
+
+ filter: function(target, selectMultiple)
+ {
+ function unselectAll()
+ {
+ for (var i = 0; i < this.filterBarElement.childNodes.length; ++i) {
+ var child = this.filterBarElement.childNodes[i];
+ if (!child.category)
+ continue;
+
+ child.removeStyleClass("selected");
+ this.hideCategory(child.category);
+ }
+ }
+
+ if (target === this.filterAllElement) {
+ if (target.hasStyleClass("selected")) {
+ // We can't unselect All, so we break early here
+ return;
+ }
+
+ // If All wasn't selected, and now is, unselect everything else.
+ unselectAll.call(this);
+ } else {
+ // Something other than All is being selected, so we want to unselect All.
+ if (this.filterAllElement.hasStyleClass("selected")) {
+ this.filterAllElement.removeStyleClass("selected");
+ this.hideCategory("all");
+ }
+ }
+
+ if (!selectMultiple) {
+ // If multiple selection is off, we want to unselect everything else
+ // and just select ourselves.
+ unselectAll.call(this);
+
+ target.addStyleClass("selected");
+ this.showCategory(target.category);
+ return;
+ }
+
+ if (target.hasStyleClass("selected")) {
+ // If selectMultiple is turned on, and we were selected, we just
+ // want to unselect ourselves.
+ target.removeStyleClass("selected");
+ this.hideCategory(target.category);
+ } else {
+ // If selectMultiple is turned on, and we weren't selected, we just
+ // want to select ourselves.
+ target.addStyleClass("selected");
+ this.showCategory(target.category);
+ }
+ },
+
+ _updateFilter: function(e)
+ {
+ var isMac = InspectorController.platform().indexOf("mac-") === 0;
+ var selectMultiple = false;
+ if (isMac && e.metaKey && !e.ctrlKey && !e.altKey && !e.shiftKey)
+ selectMultiple = true;
+ if (!isMac && e.ctrlKey && !e.metaKey && !e.altKey && !e.shiftKey)
+ selectMultiple = true;
+
+ this.filter(e.target, selectMultiple);
+ },
+
+ _createGraph: function()
+ {
+ this._containerContentElement = document.createElement("div");
+ this._containerContentElement.id = "resources-container-content";
+ this.containerElement.appendChild(this._containerContentElement);
+
+ this.summaryBar = new WebInspector.SummaryBar(this.categories);
+ this.summaryBar.element.id = "resources-summary";
+ this._containerContentElement.appendChild(this.summaryBar.element);
+
+ this.resourcesGraphsElement = document.createElement("div");
+ this.resourcesGraphsElement.id = "resources-graphs";
+ this._containerContentElement.appendChild(this.resourcesGraphsElement);
+
+ this.dividersElement = document.createElement("div");
+ this.dividersElement.id = "resources-dividers";
+ this._containerContentElement.appendChild(this.dividersElement);
+
+ this.eventDividersElement = document.createElement("div");
+ this.eventDividersElement.id = "resources-event-dividers";
+ this._containerContentElement.appendChild(this.eventDividersElement);
+
+ this.dividersLabelBarElement = document.createElement("div");
+ this.dividersLabelBarElement.id = "resources-dividers-label-bar";
+ this._containerContentElement.appendChild(this.dividersLabelBarElement);
+ },
+
+ updateGraphDividersIfNeeded: function(force)
+ {
+ if (!this.visible) {
+ this.needsRefresh = true;
+ return false;
+ }
+
+ if (document.body.offsetWidth <= 0) {
+ // The stylesheet hasn't loaded yet or the window is closed,
+ // so we can't calculate what is need. Return early.
+ return false;
+ }
+
+ var dividerCount = Math.round(this.dividersElement.offsetWidth / 64);
+ var slice = this.calculator.boundarySpan / dividerCount;
+ if (!force && this._currentDividerSlice === slice)
+ return false;
+
+ this._currentDividerSlice = slice;
+
+ this.dividersElement.removeChildren();
+ this.eventDividersElement.removeChildren();
+ this.dividersLabelBarElement.removeChildren();
+
+ for (var i = 1; i <= dividerCount; ++i) {
+ var divider = document.createElement("div");
+ divider.className = "resources-divider";
+ if (i === dividerCount)
+ divider.addStyleClass("last");
+ divider.style.left = ((i / dividerCount) * 100) + "%";
+
+ this.dividersElement.appendChild(divider.cloneNode());
+
+ var label = document.createElement("div");
+ label.className = "resources-divider-label";
+ if (!isNaN(slice))
+ label.textContent = this.calculator.formatValue(slice * i);
+ divider.appendChild(label);
+
+ this.dividersLabelBarElement.appendChild(divider);
+ }
+ },
+
+ _updateDividersLabelBarPosition: function()
+ {
+ var scrollTop = this.containerElement.scrollTop;
+ var dividersTop = (scrollTop < this.summaryBar.element.offsetHeight ? this.summaryBar.element.offsetHeight : scrollTop);
+ this.dividersElement.style.top = scrollTop + "px";
+ this.eventDividersElement.style.top = scrollTop + "px";
+ this.dividersLabelBarElement.style.top = dividersTop + "px";
+ },
+
+ get needsRefresh()
+ {
+ return this._needsRefresh;
+ },
+
+ set needsRefresh(x)
+ {
+ if (this._needsRefresh === x)
+ return;
+
+ this._needsRefresh = x;
+
+ if (x) {
+ if (this.visible && !("_refreshTimeout" in this))
+ this._refreshTimeout = setTimeout(this.refresh.bind(this), 500);
+ } else {
+ if ("_refreshTimeout" in this) {
+ clearTimeout(this._refreshTimeout);
+ delete this._refreshTimeout;
+ }
+ }
+ },
+
+ refreshIfNeeded: function()
+ {
+ if (this.needsRefresh)
+ this.refresh();
+ },
+
+ show: function()
+ {
+ WebInspector.Panel.prototype.show.call(this);
+
+ this._updateDividersLabelBarPosition();
+ this.refreshIfNeeded();
+ },
+
+ resize: function()
+ {
+ this.updateGraphDividersIfNeeded();
+ },
+
+ updateMainViewWidth: function(width)
+ {
+ this._containerContentElement.style.left = width + "px";
+ this.updateGraphDividersIfNeeded();
+ }
+}
+
+WebInspector.AbstractTimelinePanel.prototype.__proto__ = WebInspector.Panel.prototype;
+
+WebInspector.TimelineCalculator = function()
+{
+}
+
+WebInspector.TimelineCalculator.prototype = {
+ computeSummaryValues: function(items)
+ {
+ var total = 0;
+ var categoryValues = {};
+
+ var itemsLength = items.length;
+ for (var i = 0; i < itemsLength; ++i) {
+ var item = items[i];
+ var value = this._value(item);
+ if (typeof value === "undefined")
+ continue;
+ if (!(item.category.name in categoryValues))
+ categoryValues[item.category.name] = 0;
+ categoryValues[item.category.name] += value;
+ total += value;
+ }
+
+ return {categoryValues: categoryValues, total: total};
+ },
+
+ computeBarGraphPercentages: function(item)
+ {
+ return {start: 0, middle: 0, end: (this._value(item) / this.boundarySpan) * 100};
+ },
+
+ computeBarGraphLabels: function(item)
+ {
+ const label = this.formatValue(this._value(item));
+ return {left: label, right: label, tooltip: label};
+ },
+
+ get boundarySpan()
+ {
+ return this.maximumBoundary - this.minimumBoundary;
+ },
+
+ updateBoundaries: function(item)
+ {
+ this.minimumBoundary = 0;
+
+ var value = this._value(item);
+ if (typeof this.maximumBoundary === "undefined" || value > this.maximumBoundary) {
+ this.maximumBoundary = value;
+ return true;
+ }
+ return false;
+ },
+
+ reset: function()
+ {
+ delete this.minimumBoundary;
+ delete this.maximumBoundary;
+ },
+
+ _value: function(item)
+ {
+ return 0;
+ },
+
+ formatValue: function(value)
+ {
+ return value.toString();
+ }
+}
diff --git a/WebCore/inspector/front-end/ResourceCategory.js b/WebCore/inspector/front-end/ResourceCategory.js
index fc508d0..7b46764 100644
--- a/WebCore/inspector/front-end/ResourceCategory.js
+++ b/WebCore/inspector/front-end/ResourceCategory.js
@@ -26,10 +26,11 @@
* THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
-WebInspector.ResourceCategory = function(title, name)
+WebInspector.ResourceCategory = function(name, title, color)
{
this.name = name;
this.title = title;
+ this.color = color;
this.resources = [];
}
diff --git a/WebCore/inspector/front-end/ResourcesPanel.js b/WebCore/inspector/front-end/ResourcesPanel.js
index ffbed87..41485dd 100644
--- a/WebCore/inspector/front-end/ResourcesPanel.js
+++ b/WebCore/inspector/front-end/ResourcesPanel.js
@@ -29,249 +29,132 @@
WebInspector.ResourcesPanel = function()
{
- WebInspector.Panel.call(this);
-
+ WebInspector.AbstractTimelinePanel.call(this);
this.element.addStyleClass("resources");
- this.filterBarElement = document.createElement("div");
- this.filterBarElement.id = "resources-filter";
- this.filterBarElement.className = "scope-bar";
- this.element.appendChild(this.filterBarElement);
+ this._createPanelEnabler();
this.viewsContainerElement = document.createElement("div");
this.viewsContainerElement.id = "resource-views";
this.element.appendChild(this.viewsContainerElement);
- this.containerElement = document.createElement("div");
- this.containerElement.id = "resources-container";
- this.containerElement.addEventListener("scroll", this._updateDividersLabelBarPosition.bind(this), false);
- this.element.appendChild(this.containerElement);
-
- this.createSidebar(this.containerElement, this.element);
-
- this.sidebarElement.id = "resources-sidebar";
-
- this.containerContentElement = document.createElement("div");
- this.containerContentElement.id = "resources-container-content";
- this.containerElement.appendChild(this.containerContentElement);
-
- this.summaryBar = new WebInspector.SummaryBar(this.categories);
- this.summaryBar.element.id = "resources-summary";
- this.containerContentElement.appendChild(this.summaryBar.element);
-
- this.resourcesGraphsElement = document.createElement("div");
- this.resourcesGraphsElement.id = "resources-graphs";
- this.containerContentElement.appendChild(this.resourcesGraphsElement);
-
- this.dividersElement = document.createElement("div");
- this.dividersElement.id = "resources-dividers";
- this.containerContentElement.appendChild(this.dividersElement);
-
- this.eventDividersElement = document.createElement("div");
- this.eventDividersElement.id = "resources-event-dividers";
- this.containerContentElement.appendChild(this.eventDividersElement);
-
- this.dividersLabelBarElement = document.createElement("div");
- this.dividersLabelBarElement.id = "resources-dividers-label-bar";
- this.containerContentElement.appendChild(this.dividersLabelBarElement);
-
- var timeGraphItem = new WebInspector.SidebarTreeElement("resources-time-graph-sidebar-item", WebInspector.UIString("Time"));
- timeGraphItem.onselect = this._graphSelected.bind(this);
-
- var transferTimeCalculator = new WebInspector.ResourceTransferTimeCalculator();
- var transferDurationCalculator = new WebInspector.ResourceTransferDurationCalculator();
-
- timeGraphItem.sortingOptions = [
- { name: WebInspector.UIString("Sort by Start Time"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByAscendingStartTime, calculator: transferTimeCalculator },
- { name: WebInspector.UIString("Sort by Response Time"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByAscendingResponseReceivedTime, calculator: transferTimeCalculator },
- { name: WebInspector.UIString("Sort by End Time"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByAscendingEndTime, calculator: transferTimeCalculator },
- { name: WebInspector.UIString("Sort by Duration"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByDescendingDuration, calculator: transferDurationCalculator },
- { name: WebInspector.UIString("Sort by Latency"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByDescendingLatency, calculator: transferDurationCalculator },
- ];
-
- timeGraphItem.selectedSortingOptionIndex = 1;
+ this.createInterface();
- var sizeGraphItem = new WebInspector.SidebarTreeElement("resources-size-graph-sidebar-item", WebInspector.UIString("Size"));
- sizeGraphItem.onselect = this._graphSelected.bind(this);
+ this._createStatusbarButtons();
- var transferSizeCalculator = new WebInspector.ResourceTransferSizeCalculator();
- sizeGraphItem.sortingOptions = [
- { name: WebInspector.UIString("Sort by Size"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByDescendingSize, calculator: transferSizeCalculator },
- ];
-
- sizeGraphItem.selectedSortingOptionIndex = 0;
-
- this.graphsTreeElement = new WebInspector.SidebarSectionTreeElement(WebInspector.UIString("GRAPHS"), {}, true);
- this.sidebarTree.appendChild(this.graphsTreeElement);
-
- this.graphsTreeElement.appendChild(timeGraphItem);
- this.graphsTreeElement.appendChild(sizeGraphItem);
- this.graphsTreeElement.expand();
-
- this.resourcesTreeElement = new WebInspector.SidebarSectionTreeElement(WebInspector.UIString("RESOURCES"), {}, true);
- this.sidebarTree.appendChild(this.resourcesTreeElement);
-
- this.resourcesTreeElement.expand();
+ this.reset();
+ this.filter(this.filterAllElement, false);
+ this.graphsTreeElement.children[0].select();
+}
- var panelEnablerHeading = WebInspector.UIString("You need to enable resource tracking to use this panel.");
- var panelEnablerDisclaimer = WebInspector.UIString("Enabling resource tracking will reload the page and make page loading slower.");
- var panelEnablerButton = WebInspector.UIString("Enable resource tracking");
+WebInspector.ResourcesPanel.prototype = {
+ toolbarItemClass: "resources",
- this.panelEnablerView = new WebInspector.PanelEnablerView("resources", panelEnablerHeading, panelEnablerDisclaimer, panelEnablerButton);
- this.panelEnablerView.addEventListener("enable clicked", this._enableResourceTracking, this);
+ get toolbarItemLabel()
+ {
+ return WebInspector.UIString("Resources");
+ },
- this.element.appendChild(this.panelEnablerView.element);
+ get statusBarItems()
+ {
+ return [this.enableToggleButton.element, this.largerResourcesButton.element, this.sortingSelectElement];
+ },
- this.enableToggleButton = new WebInspector.StatusBarButton("", "enable-toggle-status-bar-item");
- this.enableToggleButton.addEventListener("click", this._toggleResourceTracking.bind(this), false);
+ get categories()
+ {
+ return WebInspector.resourceCategories;
+ },
- this.largerResourcesButton = new WebInspector.StatusBarButton(WebInspector.UIString("Use small resource rows."), "resources-larger-resources-status-bar-item");
- this.largerResourcesButton.toggled = Preferences.resourcesLargeRows;
- this.largerResourcesButton.addEventListener("click", this._toggleLargerResources.bind(this), false);
- if (!Preferences.resourcesLargeRows) {
- Preferences.resourcesLargeRows = !Preferences.resourcesLargeRows;
- this._toggleLargerResources(); // this will toggle the preference back to the original
- }
+ showCategory: function(category)
+ {
+ var filterClass = "filter-" + category.toLowerCase();
+ this.resourcesGraphsElement.addStyleClass(filterClass);
+ this.resourcesTreeElement.childrenListElement.addStyleClass(filterClass);
+ },
+
+ hideCategory: function(category)
+ {
+ var filterClass = "filter-" + category.toLowerCase();
+ this.resourcesGraphsElement.removeStyleClass(filterClass);
+ this.resourcesTreeElement.childrenListElement.removeStyleClass(filterClass);
+ },
- this.sortingSelectElement = document.createElement("select");
- this.sortingSelectElement.className = "status-bar-item";
- this.sortingSelectElement.addEventListener("change", this._changeSortingFunction.bind(this), false);
+ isCategoryVisible: function(categoryName)
+ {
+ return (this.resourcesGraphsElement.hasStyleClass("filter-all") || this.resourcesGraphsElement.hasStyleClass("filter-" + categoryName.toLowerCase()));
+ },
- function createFilterElement(category)
+ populateSidebar: function()
{
- if (category === "all")
- var label = WebInspector.UIString("All");
- else if (WebInspector.resourceCategories[category])
- var label = WebInspector.resourceCategories[category].title;
+ var timeGraphItem = new WebInspector.SidebarTreeElement("resources-time-graph-sidebar-item", WebInspector.UIString("Time"));
+ timeGraphItem.onselect = this._graphSelected.bind(this);
- var categoryElement = document.createElement("li");
- categoryElement.category = category;
- categoryElement.addStyleClass(category);
- categoryElement.appendChild(document.createTextNode(label));
- categoryElement.addEventListener("click", this._updateFilter.bind(this), false);
- this.filterBarElement.appendChild(categoryElement);
+ var transferTimeCalculator = new WebInspector.ResourceTransferTimeCalculator();
+ var transferDurationCalculator = new WebInspector.ResourceTransferDurationCalculator();
- return categoryElement;
- }
+ timeGraphItem.sortingOptions = [
+ { name: WebInspector.UIString("Sort by Start Time"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByAscendingStartTime, calculator: transferTimeCalculator },
+ { name: WebInspector.UIString("Sort by Response Time"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByAscendingResponseReceivedTime, calculator: transferTimeCalculator },
+ { name: WebInspector.UIString("Sort by End Time"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByAscendingEndTime, calculator: transferTimeCalculator },
+ { name: WebInspector.UIString("Sort by Duration"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByDescendingDuration, calculator: transferDurationCalculator },
+ { name: WebInspector.UIString("Sort by Latency"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByDescendingLatency, calculator: transferDurationCalculator },
+ ];
- this.allElement = createFilterElement.call(this, "all");
+ timeGraphItem.selectedSortingOptionIndex = 1;
- // Add a divider
- var dividerElement = document.createElement("div");
- dividerElement.addStyleClass("divider");
- this.filterBarElement.appendChild(dividerElement);
+ var sizeGraphItem = new WebInspector.SidebarTreeElement("resources-size-graph-sidebar-item", WebInspector.UIString("Size"));
+ sizeGraphItem.onselect = this._graphSelected.bind(this);
- for (var category in this.categories)
- createFilterElement.call(this, category);
+ var transferSizeCalculator = new WebInspector.ResourceTransferSizeCalculator();
+ sizeGraphItem.sortingOptions = [
+ { name: WebInspector.UIString("Sort by Size"), sortingFunction: WebInspector.ResourceSidebarTreeElement.CompareByDescendingSize, calculator: transferSizeCalculator },
+ ];
- this.filter(this.allElement, false);
+ sizeGraphItem.selectedSortingOptionIndex = 0;
- this.reset();
+ this.graphsTreeElement = new WebInspector.SidebarSectionTreeElement(WebInspector.UIString("GRAPHS"), {}, true);
+ this.sidebarTree.appendChild(this.graphsTreeElement);
- timeGraphItem.select();
-}
+ this.graphsTreeElement.appendChild(timeGraphItem);
+ this.graphsTreeElement.appendChild(sizeGraphItem);
+ this.graphsTreeElement.expand();
-WebInspector.ResourcesPanel.prototype = {
- toolbarItemClass: "resources",
+ this.resourcesTreeElement = new WebInspector.SidebarSectionTreeElement(WebInspector.UIString("RESOURCES"), {}, true);
+ this.sidebarTree.appendChild(this.resourcesTreeElement);
- get categories()
- {
- if (!this._categories) {
- this._categories = {documents: {color: {r: 47, g: 102, b: 236}}, stylesheets: {color: {r: 157, g: 231, b: 119}}, images: {color: {r: 164, g: 60, b: 255}}, scripts: {color: {r: 255, g: 121, b: 0}}, xhr: {color: {r: 231, g: 231, b: 10}}, fonts: {color: {r: 255, g: 82, b: 62}}, other: {color: {r: 186, g: 186, b: 186}}};
- for (var category in this._categories)
- this._categories[category].title = WebInspector.resourceCategories[category].title;
- }
-
- return this._categories;
+ this.resourcesTreeElement.expand();
},
- filter: function(target, selectMultiple)
+ _createPanelEnabler: function()
{
- function unselectAll()
- {
- for (var i = 0; i < this.filterBarElement.childNodes.length; ++i) {
- var child = this.filterBarElement.childNodes[i];
- if (!child.category)
- continue;
-
- child.removeStyleClass("selected");
-
- var filterClass = "filter-" + child.category.toLowerCase();
- this.resourcesGraphsElement.removeStyleClass(filterClass);
- this.resourcesTreeElement.childrenListElement.removeStyleClass(filterClass);
- }
- }
-
- var targetFilterClass = "filter-" + target.category.toLowerCase();
-
- if (target === this.allElement) {
- if (target.hasStyleClass("selected")) {
- // We can't unselect All, so we break early here
- return;
- }
-
- // If All wasn't selected, and now is, unselect everything else.
- unselectAll.call(this);
- } else {
- // Something other than All is being selected, so we want to unselect All.
- if (this.allElement.hasStyleClass("selected")) {
- this.allElement.removeStyleClass("selected");
- this.resourcesGraphsElement.removeStyleClass("filter-all");
- this.resourcesTreeElement.childrenListElement.removeStyleClass("filter-all");
- }
- }
-
- if (!selectMultiple) {
- // If multiple selection is off, we want to unselect everything else
- // and just select ourselves.
- unselectAll.call(this);
-
- target.addStyleClass("selected");
- this.resourcesGraphsElement.addStyleClass(targetFilterClass);
- this.resourcesTreeElement.childrenListElement.addStyleClass(targetFilterClass);
-
- return;
- }
+ var panelEnablerHeading = WebInspector.UIString("You need to enable resource tracking to use this panel.");
+ var panelEnablerDisclaimer = WebInspector.UIString("Enabling resource tracking will reload the page and make page loading slower.");
+ var panelEnablerButton = WebInspector.UIString("Enable resource tracking");
- if (target.hasStyleClass("selected")) {
- // If selectMultiple is turned on, and we were selected, we just
- // want to unselect ourselves.
- target.removeStyleClass("selected");
+ this.panelEnablerView = new WebInspector.PanelEnablerView("resources", panelEnablerHeading, panelEnablerDisclaimer, panelEnablerButton);
+ this.panelEnablerView.addEventListener("enable clicked", this._enableResourceTracking, this);
- this.resourcesGraphsElement.removeStyleClass(targetFilterClass);
- this.resourcesTreeElement.childrenListElement.removeStyleClass(targetFilterClass);
- } else {
- // If selectMultiple is turned on, and we weren't selected, we just
- // want to select ourselves.
- target.addStyleClass("selected");
+ this.element.appendChild(this.panelEnablerView.element);
- this.resourcesGraphsElement.addStyleClass(targetFilterClass);
- this.resourcesTreeElement.childrenListElement.addStyleClass(targetFilterClass);
- }
+ this.enableToggleButton = new WebInspector.StatusBarButton("", "enable-toggle-status-bar-item");
+ this.enableToggleButton.addEventListener("click", this._toggleResourceTracking.bind(this), false);
},
- isCategoryVisible: function(categoryName)
+ _createStatusbarButtons: function()
{
- return (this.resourcesGraphsElement.hasStyleClass("filter-all") || this.resourcesGraphsElement.hasStyleClass("filter-" + categoryName.toLowerCase()));
- },
+ this.largerResourcesButton = new WebInspector.StatusBarButton(WebInspector.UIString("Use small resource rows."), "resources-larger-resources-status-bar-item");
+ this.largerResourcesButton.toggled = Preferences.resourcesLargeRows;
+ this.largerResourcesButton.addEventListener("click", this._toggleLargerResources.bind(this), false);
+ if (!Preferences.resourcesLargeRows) {
+ Preferences.resourcesLargeRows = !Preferences.resourcesLargeRows;
+ this._toggleLargerResources(); // this will toggle the preference back to the original
+ }
- _updateFilter: function(e)
- {
- var isMac = InspectorController.platform().indexOf("mac-") === 0;
- var selectMultiple = false;
- if (isMac && e.metaKey && !e.ctrlKey && !e.altKey && !e.shiftKey)
- selectMultiple = true;
- if (!isMac && e.ctrlKey && !e.metaKey && !e.altKey && !e.shiftKey)
- selectMultiple = true;
-
- this.filter(e.target, selectMultiple);
+ this.sortingSelectElement = document.createElement("select");
+ this.sortingSelectElement.className = "status-bar-item";
+ this.sortingSelectElement.addEventListener("change", this._changeSortingFunction.bind(this), false);
},
- get toolbarItemLabel()
- {
- return WebInspector.UIString("Resources");
- },
-
get mainResourceLoadTime()
{
return this._mainResourceLoadTime || -1;
@@ -285,7 +168,7 @@ WebInspector.ResourcesPanel.prototype = {
this._mainResourceLoadTime = x;
// Update the dividers to draw the new line
- this._updateGraphDividersIfNeeded(true);
+ this.updateGraphDividersIfNeeded(true);
},
get mainResourceDOMContentTime()
@@ -300,20 +183,12 @@ WebInspector.ResourcesPanel.prototype = {
this._mainResourceDOMContentTime = x;
- this._updateGraphDividersIfNeeded(true);
- },
-
- get statusBarItems()
- {
- return [this.enableToggleButton.element, this.largerResourcesButton.element, this.sortingSelectElement];
+ this.updateGraphDividersIfNeeded(true);
},
show: function()
{
- WebInspector.Panel.prototype.show.call(this);
-
- this._updateDividersLabelBarPosition();
- this.refreshIfNeeded();
+ WebInspector.AbstractTimelinePanel.prototype.show.call(this);
var visibleView = this.visibleView;
if (visibleView) {
@@ -336,7 +211,7 @@ WebInspector.ResourcesPanel.prototype = {
resize: function()
{
- this._updateGraphDividersIfNeeded();
+ WebInspector.AbstractTimelinePanel.prototype.resize.call(this);
var visibleView = this.visibleView;
if (visibleView && "resize" in visibleView)
@@ -442,35 +317,6 @@ WebInspector.ResourcesPanel.prototype = {
this._sortResourcesIfNeeded();
},
- get needsRefresh()
- {
- return this._needsRefresh;
- },
-
- set needsRefresh(x)
- {
- if (this._needsRefresh === x)
- return;
-
- this._needsRefresh = x;
-
- if (x) {
- if (this.visible && !("_refreshTimeout" in this))
- this._refreshTimeout = setTimeout(this.refresh.bind(this), 500);
- } else {
- if ("_refreshTimeout" in this) {
- clearTimeout(this._refreshTimeout);
- delete this._refreshTimeout;
- }
- }
- },
-
- refreshIfNeeded: function()
- {
- if (this.needsRefresh)
- this.refresh();
- },
-
refresh: function()
{
this.needsRefresh = false;
@@ -506,11 +352,16 @@ WebInspector.ResourcesPanel.prototype = {
this._staleResources = [];
- this._updateGraphDividersIfNeeded();
+ this.updateGraphDividersIfNeeded();
this._sortResourcesIfNeeded();
this._updateSummaryGraph();
},
+ _updateSummaryGraph: function()
+ {
+ this.summaryBar.update(this._resources);
+ },
+
resourceTrackingWasEnabled: function()
{
this.reset();
@@ -557,7 +408,7 @@ WebInspector.ResourcesPanel.prototype = {
this.resourcesGraphsElement.removeChildren();
this.summaryBar.reset();
- this._updateGraphDividersIfNeeded(true);
+ this.updateGraphDividersIfNeeded(true);
if (InspectorController.resourceTrackingEnabled()) {
this.enableToggleButton.title = WebInspector.UIString("Resource tracking enabled. Click to disable.");
@@ -776,48 +627,13 @@ WebInspector.ResourcesPanel.prototype = {
}
},
- _updateGraphDividersIfNeeded: function(force)
+ updateGraphDividersIfNeeded: function(force)
{
- if (!this.visible) {
- this.needsRefresh = true;
- return;
- }
-
- if (document.body.offsetWidth <= 0) {
- // The stylesheet hasn't loaded yet or the window is closed,
- // so we can't calculate what is need. Return early.
- return;
- }
-
- var dividerCount = Math.round(this.dividersElement.offsetWidth / 64);
- var slice = this.calculator.boundarySpan / dividerCount;
- if (!force && this._currentDividerSlice === slice)
+ var proceed = WebInspector.AbstractTimelinePanel.prototype.updateGraphDividersIfNeeded.call(this, force);
+
+ if (!proceed)
return;
- this._currentDividerSlice = slice;
-
- this.dividersElement.removeChildren();
- this.eventDividersElement.removeChildren();
- this.dividersLabelBarElement.removeChildren();
-
- for (var i = 1; i <= dividerCount; ++i) {
- var divider = document.createElement("div");
- divider.className = "resources-divider";
- if (i === dividerCount)
- divider.addStyleClass("last");
- divider.style.left = ((i / dividerCount) * 100) + "%";
-
- this.dividersElement.appendChild(divider.cloneNode());
-
- var label = document.createElement("div");
- label.className = "resources-divider-label";
- if (!isNaN(slice))
- label.textContent = this.calculator.formatValue(slice * i);
- divider.appendChild(label);
-
- this.dividersLabelBarElement.appendChild(divider);
- }
-
if (this.calculator.startAtZero || !this.calculator.computePercentageFromEventTime) {
// If our current sorting method starts at zero, that means it shows all
// resources starting at the same point, and so onLoad event and DOMContent
@@ -859,20 +675,6 @@ WebInspector.ResourcesPanel.prototype = {
}
},
- _updateSummaryGraph: function()
- {
- this.summaryBar.update(this._resources);
- },
-
- _updateDividersLabelBarPosition: function()
- {
- var scrollTop = this.containerElement.scrollTop;
- var dividersTop = (scrollTop < this.summaryBar.element.offsetHeight ? this.summaryBar.element.offsetHeight : scrollTop);
- this.dividersElement.style.top = scrollTop + "px";
- this.eventDividersElement.style.top = scrollTop + "px";
- this.dividersLabelBarElement.style.top = dividersTop + "px";
- },
-
_graphSelected: function(treeElement)
{
if (this._lastSelectedGraphTreeElement)
@@ -964,10 +766,8 @@ WebInspector.ResourcesPanel.prototype = {
updateMainViewWidth: function(width)
{
- this.containerContentElement.style.left = width + "px";
+ WebInspector.AbstractTimelinePanel.prototype.updateMainViewWidth.call(this, width);
this.viewsContainerElement.style.left = width + "px";
-
- this._updateGraphDividersIfNeeded();
},
_enableResourceTracking: function()
@@ -991,85 +791,11 @@ WebInspector.ResourcesPanel.prototype = {
}
}
-WebInspector.ResourcesPanel.prototype.__proto__ = WebInspector.Panel.prototype;
-
-WebInspector.ResourceCalculator = function()
-{
-}
-
-WebInspector.ResourceCalculator.prototype = {
- computeSummaryValues: function(resources)
- {
- var total = 0;
- var categoryValues = {};
-
- var resourcesLength = resources.length;
- for (var i = 0; i < resourcesLength; ++i) {
- var resource = resources[i];
- var value = this._value(resource);
- if (typeof value === "undefined")
- continue;
- if (!(resource.category.name in categoryValues))
- categoryValues[resource.category.name] = 0;
- categoryValues[resource.category.name] += value;
- total += value;
- }
-
- return {categoryValues: categoryValues, total: total};
- },
-
- computeBarGraphPercentages: function(resource)
- {
- return {start: 0, middle: 0, end: (this._value(resource) / this.boundarySpan) * 100};
- },
-
- computeBarGraphLabels: function(resource)
- {
- const label = this.formatValue(this._value(resource));
- var tooltip = label;
- if (resource.cached)
- tooltip = WebInspector.UIString("%s (from cache)", tooltip);
- return {left: label, right: label, tooltip: tooltip};
- },
-
- get boundarySpan()
- {
- return this.maximumBoundary - this.minimumBoundary;
- },
-
- updateBoundaries: function(resource)
- {
- this.minimumBoundary = 0;
-
- var value = this._value(resource);
- if (typeof this.maximumBoundary === "undefined" || value > this.maximumBoundary) {
- this.maximumBoundary = value;
- return true;
- }
-
- return false;
- },
-
- reset: function()
- {
- delete this.minimumBoundary;
- delete this.maximumBoundary;
- },
-
- _value: function(resource)
- {
- return 0;
- },
-
- formatValue: function(value)
- {
- return value.toString();
- }
-}
+WebInspector.ResourcesPanel.prototype.__proto__ = WebInspector.AbstractTimelinePanel.prototype;
WebInspector.ResourceTimeCalculator = function(startAtZero)
{
- WebInspector.ResourceCalculator.call(this);
+ WebInspector.TimelineCalculator.call(this);
this.startAtZero = startAtZero;
}
@@ -1230,7 +956,7 @@ WebInspector.ResourceTimeCalculator.prototype = {
},
}
-WebInspector.ResourceTimeCalculator.prototype.__proto__ = WebInspector.ResourceCalculator.prototype;
+WebInspector.ResourceTimeCalculator.prototype.__proto__ = WebInspector.TimelineCalculator.prototype;
WebInspector.ResourceTransferTimeCalculator = function()
{
@@ -1277,10 +1003,19 @@ WebInspector.ResourceTransferDurationCalculator.prototype.__proto__ = WebInspect
WebInspector.ResourceTransferSizeCalculator = function()
{
- WebInspector.ResourceCalculator.call(this);
+ WebInspector.TimelineCalculator.call(this);
}
WebInspector.ResourceTransferSizeCalculator.prototype = {
+ computeBarGraphLabels: function(resource)
+ {
+ const label = this.formatValue(this._value(resource));
+ var tooltip = label;
+ if (resource.cached)
+ tooltip = WebInspector.UIString("%s (from cache)", tooltip);
+ return {left: label, right: label, tooltip: tooltip};
+ },
+
_value: function(resource)
{
return resource.contentLength;
@@ -1292,7 +1027,7 @@ WebInspector.ResourceTransferSizeCalculator.prototype = {
}
}
-WebInspector.ResourceTransferSizeCalculator.prototype.__proto__ = WebInspector.ResourceCalculator.prototype;
+WebInspector.ResourceTransferSizeCalculator.prototype.__proto__ = WebInspector.TimelineCalculator.prototype;
WebInspector.ResourceSidebarTreeElement = function(resource)
{
diff --git a/WebCore/inspector/front-end/SummaryBar.js b/WebCore/inspector/front-end/SummaryBar.js
index bbf2b1a..1c31449 100644
--- a/WebCore/inspector/front-end/SummaryBar.js
+++ b/WebCore/inspector/front-end/SummaryBar.js
@@ -74,8 +74,7 @@ WebInspector.SummaryBar.prototype = {
if (!size)
continue;
- var color = this.categories[category].color;
- var colorString = "rgb(" + color.r + ", " + color.g + ", " + color.b + ")";
+ var colorString = this.categories[category].color;
var fillSegment = {color: colorString, value: size};
fillSegments.push(fillSegment);
diff --git a/WebCore/inspector/front-end/WebKit.qrc b/WebCore/inspector/front-end/WebKit.qrc
index 898bd4c..a1d671e 100644
--- a/WebCore/inspector/front-end/WebKit.qrc
+++ b/WebCore/inspector/front-end/WebKit.qrc
@@ -1,6 +1,7 @@
<!DOCTYPE RCC><RCC version="1.0">
<qresource prefix="/webkit/inspector">
<file>inspector.html</file>
+ <file>AbstractTimelinePanel.js</file>
<file>BottomUpProfileDataGridTree.js</file>
<file>Breakpoint.js</file>
<file>BreakpointsSidebarPane.js</file>
diff --git a/WebCore/inspector/front-end/inspector.html b/WebCore/inspector/front-end/inspector.html
index 36351b7..dee03ef 100644
--- a/WebCore/inspector/front-end/inspector.html
+++ b/WebCore/inspector/front-end/inspector.html
@@ -74,6 +74,7 @@ THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
<script type="text/javascript" src="StatusBarButton.js"></script>
<script type="text/javascript" src="SummaryBar.js"></script>
<script type="text/javascript" src="ElementsPanel.js"></script>
+ <script type="text/javascript" src="AbstractTimelinePanel.js"></script>
<script type="text/javascript" src="ResourcesPanel.js"></script>
<script type="text/javascript" src="ScriptsPanel.js"></script>
<script type="text/javascript" src="StoragePanel.js"></script>
diff --git a/WebCore/inspector/front-end/inspector.js b/WebCore/inspector/front-end/inspector.js
index 161fd3e..5691aa8 100644
--- a/WebCore/inspector/front-end/inspector.js
+++ b/WebCore/inspector/front-end/inspector.js
@@ -384,13 +384,13 @@ WebInspector.loaded = function()
this.domAgent = new WebInspector.DOMAgent();
this.resourceCategories = {
- documents: new WebInspector.ResourceCategory(WebInspector.UIString("Documents"), "documents"),
- stylesheets: new WebInspector.ResourceCategory(WebInspector.UIString("Stylesheets"), "stylesheets"),
- images: new WebInspector.ResourceCategory(WebInspector.UIString("Images"), "images"),
- scripts: new WebInspector.ResourceCategory(WebInspector.UIString("Scripts"), "scripts"),
- xhr: new WebInspector.ResourceCategory(WebInspector.UIString("XHR"), "xhr"),
- fonts: new WebInspector.ResourceCategory(WebInspector.UIString("Fonts"), "fonts"),
- other: new WebInspector.ResourceCategory(WebInspector.UIString("Other"), "other")
+ documents: new WebInspector.ResourceCategory("documents", WebInspector.UIString("Documents"), "rgb(47,102,236)"),
+ stylesheets: new WebInspector.ResourceCategory("stylesheets", WebInspector.UIString("Stylesheets"), "rgb(157,231,119)"),
+ images: new WebInspector.ResourceCategory("images", WebInspector.UIString("Images"), "rgb(164,60,255)"),
+ scripts: new WebInspector.ResourceCategory("scripts", WebInspector.UIString("Scripts"), "rgb(255,121,0)"),
+ xhr: new WebInspector.ResourceCategory("xhr", WebInspector.UIString("XHR"), "rgb(231,231,10)"),
+ fonts: new WebInspector.ResourceCategory("fonts", WebInspector.UIString("Fonts"), "rgb(255,82,62)"),
+ other: new WebInspector.ResourceCategory("other", WebInspector.UIString("Other"), "rgb(186,186,186)")
};
this.panels = {};
--
WebKit Debian packaging
More information about the Pkg-webkit-commits
mailing list