Commit 0b5c08ff authored by kmccullough@apple.com's avatar kmccullough@apple.com

2008-05-05 Kevin McCullough <kmccullough@apple.com>

        Reviewed by Tim.

        -<rdar://problem/5770054> JavaScript profiler (10928)
        -Begininings of a UI for the Profiler in the WebInspector.

        * English.lproj/InspectorLocalizedStrings.js: Add new strings to be
        localized.
        * page/inspector/DatabasesPanel.js: Changed the name of the Databae's
        results table to be more generic as it is now also used by the profiler.
        * page/inspector/Images/glossySelected.png: Added.
        * page/inspector/Images/profilesIcon.png: Added.
        * page/inspector/Images/treeUpTriangleBlack.png: Added.
        * page/inspector/Images/treeUpTriangleWhite.png: Added.
        * page/inspector/ProfileView.js: Added. Sets up the header of the table.
        * page/inspector/ProfilesPanel.js: Added.
        * page/inspector/ProfilesPanel.js: Added. Sets up the containers of the
        profiler's content.
        * page/inspector/inspector.css: Change database-result-table to be more
        generic as well as add the styles needed by the profiler.
        * page/inspector/inspector.html: Add profiler support.



git-svn-id: http://svn.webkit.org/repository/webkit/trunk@32890 268f45cc-cd09-0410-ab3c-d52691b4dbfc
parent 489c4171
2008-05-05 Kevin McCullough <kmccullough@apple.com>
Reviewed by Tim.
-<rdar://problem/5770054> JavaScript profiler (10928)
-Begininings of a UI for the Profiler in the WebInspector.
* English.lproj/InspectorLocalizedStrings.js: Add new strings to be
localized.
* page/inspector/DatabasesPanel.js: Changed the name of the Databae's
results table to be more generic as it is now also used by the profiler.
* page/inspector/Images/glossySelected.png: Added.
* page/inspector/Images/profilesIcon.png: Added.
* page/inspector/Images/treeUpTriangleBlack.png: Added.
* page/inspector/Images/treeUpTriangleWhite.png: Added.
* page/inspector/ProfileView.js: Added. Sets up the header of the table.
* page/inspector/ProfilesPanel.js: Added.
* page/inspector/ProfilesPanel.js: Added. Sets up the containers of the
profiler's content.
* page/inspector/inspector.css: Change database-result-table to be more
generic as well as add the styles needed by the profiler.
* page/inspector/inspector.html: Add profiler support.
2008-05-05 Brady Eidson <beidson@apple.com>
Change by Darin, reviewed by Brady
......@@ -172,7 +172,7 @@ WebInspector.DatabasesPanel.prototype = {
var columnWidths = [];
var table = document.createElement("table");
table.className = "database-result-table";
table.className = "data-grid";
var headerRow = document.createElement("tr");
table.appendChild(headerRow);
......
/*
* Copyright (C) 2008 Apple 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.
*
* THIS SOFTWARE IS PROVIDED BY APPLE INC. ``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 INC. OR
* 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.ProfileView = function(profile)
{
WebInspector.View.call(this);
this.element.addStyleClass("profile-view");
this.profile = profile;
// Create the header
var headerTable = document.createElement("table");
headerTable.className = "data-grid";
this.element.appendChild(headerTable);
var headerTableTR = document.createElement("tr");
headerTable.appendChild(headerTableTR);
var headerTableSelf = document.createElement("th");
headerTableSelf.className = "narrow sort-descending selected";
headerTableSelf.addEventListener("click", this._toggleSortOrder.bind(this), false);
headerTableSelf.textContent = WebInspector.UIString("Self");
headerTableTR.appendChild(headerTableSelf);
this.selectedHeaderColumn = headerTableSelf;
var headerTableTotal = document.createElement("th");
headerTableTotal.classname = "narrow";
headerTableTotal.addEventListener("click", this._toggleSortOrder.bind(this), false);
headerTableTotal.textContent = WebInspector.UIString("Total");
headerTableTR.appendChild(headerTableTotal);
var headerTableCalls = document.createElement("th");
headerTableCalls.classname = "narrow";
headerTableCalls.addEventListener("click", this._toggleSortOrder.bind(this), false);
headerTableCalls.textContent = WebInspector.UIString("Calls");
headerTableTR.appendChild(headerTableCalls);
var headerTableSymbol = document.createElement("th");
headerTableSymbol.addEventListener("click", this._toggleSortOrder.bind(this), false);
headerTableSymbol.textContent = WebInspector.UIString("Function");
headerTableTR.appendChild(headerTableSymbol);
}
WebInspector.ProfileView.prototype = {
_toggleSortOrder: function(event)
{
var headerElement = event.target;
if (headerElement.hasStyleClass("sort-descending")) {
headerElement.removeStyleClass("sort-descending");
headerElement.addStyleClass("sort-ascending");
} else if (headerElement.hasStyleClass("sort-ascending")) {
headerElement.removeStyleClass("sort-ascending");
headerElement.addStyleClass("sort-descending");
} else {
this.selectedHeaderColumn.removeStyleClass("sort-ascending");
this.selectedHeaderColumn.removeStyleClass("sort-descending");
this.selectedHeaderColumn.removeStyleClass("selected");
headerElement.addStyleClass("sort-descending");
headerElement.addStyleClass("selected");
this.selectedHeaderColumn = headerElement;
}
},
}
WebInspector.ProfileView.prototype.__proto__ = WebInspector.View.prototype;
/*
* Copyright (C) 2008 Apple 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.
*
* THIS SOFTWARE IS PROVIDED BY APPLE INC. ``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 INC. OR
* 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.ProfilesPanel = function()
{
WebInspector.Panel.call(this);
this.element.addStyleClass("profiles");
this.sidebarElement = document.createElement("div");
this.sidebarElement.id = "profiles-sidebar";
this.sidebarElement.className = "sidebar";
this.element.appendChild(this.sidebarElement);
this.profileViews = document.createElement("div");
this.profileViews.id = "profile-views";
this.element.appendChild(this.profileViews);
}
WebInspector.ProfilesPanel.prototype = {
toolbarItemClass: "profiles",
get toolbarItemLabel()
{
return WebInspector.UIString("Profiles");
},
}
WebInspector.ProfilesPanel.prototype.__proto__ = WebInspector.Panel.prototype;
......@@ -132,6 +132,10 @@ body.detached.platform-mac-leopard #toolbar {
content: url(Images/databasesIcon.png);
}
.toolbar-item.profiles .toolbar-icon {
content: url(Images/profilesIcon.png);
}
#searchResults {
position: absolute;
top: -100px;
......@@ -1188,7 +1192,7 @@ body.inactive .sidebar {
overflow-x: hidden;
}
.database-view.table .database-result-table {
.database-view.table .data-grid {
border: none;
height: 100%;
}
......@@ -1215,11 +1219,11 @@ body.inactive .sidebar {
color: rgb(66%, 33%, 33%);
}
.database-result-table .database-result-filler-row {
.data-grid .database-result-filler-row {
height: auto;
}
.database-result-table .database-result-filler-row.alternate td {
.data-grid .database-result-filler-row.alternate td {
background-position-y: 16px;
}
......@@ -1230,7 +1234,7 @@ body.inactive .sidebar {
-webkit-background-clip: padding;
}
.database-result-table {
.data-grid {
border: 1px solid #aaa;
table-layout: fixed;
border-spacing: 0;
......@@ -1238,7 +1242,7 @@ body.inactive .sidebar {
width: 100%;
}
.database-result-table th {
.data-grid th {
text-align: left;
background: url(Images/glossyHeader.png) repeat-x;
border-right: 1px solid #aaa;
......@@ -1250,15 +1254,15 @@ body.inactive .sidebar {
white-space: nowrap;
}
.database-result-table tr {
.data-grid tr {
height: 16px;
}
.database-result-table tr.alternate {
.data-grid tr.alternate {
background-color: rgb(236, 243, 254);
}
.database-result-table td {
.data-grid td {
vertical-align: top;
padding: 2px 4px;
white-space: nowrap;
......@@ -1266,12 +1270,48 @@ body.inactive .sidebar {
-webkit-user-select: text;
}
.database-result-table td > div, .database-result-table th > div {
.data-grid td > div, .data-grid th > div {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.data-grid th.narrow {
width: 75px;
}
.data-grid th.selected {
border-top: 1px solid rgb(156, 168, 207);
border-bottom: 1px solid rgb(107, 139, 195);
border-left: url(Images/glossySelected.png);
border-right: url(Images/glossySelected.png);
background: url(Images/glossySelected.png) repeat-x;
}
.data-grid th.sort-ascending::before {
float: right;
display: inline-block;
margin-bottom: 2px;
margin-right: 3px;
width: 8px;
height: 8px;
content: url(Images/treeUpTriangleBlack.png);
}
.data-grid th.sort-descending::before {
float: right;
display: inline-block;
margin-top: 2px;
margin-right: 3px;
width: 8px;
height: 8px;
content: url(Images/treeDownTriangleBlack.png);
}
body.inactive .data-grid th.sort-ascending, body.inactive .data-grid th.sort-descending {
background: url(Images/glossyHeader.png) repeat-x;
}
.database-view.query {
font-size: 10px;
font-family: Monaco, Lucida Console, monospace;
......@@ -2055,3 +2095,31 @@ body.inactive .sidebar-tree-item.selected {
.resource-sidebar-tree-item .bubble.error {
background-color: rgb(216, 35, 35);
}
/* Profiler Style */
#profile-views {
position: absolute;
top: 0;
right: 0;
left: 200px;
bottom: 0;
}
.profile-view {
display: none;
overflow: hidden;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.profile-view.visible {
display: block;
}
.profile-view .data-grid {
border: none;
}
......@@ -52,12 +52,14 @@ THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
<script type="text/javascript" src="ResourcesPanel.js"></script>
<script type="text/javascript" src="ScriptsPanel.js"></script>
<script type="text/javascript" src="DatabasesPanel.js"></script>
<script type="text/javascript" src="ProfilesPanel.js"></script>
<script type="text/javascript" src="ResourceView.js"></script>
<script type="text/javascript" src="SourceView.js"></script>
<script type="text/javascript" src="FontView.js"></script>
<script type="text/javascript" src="ImageView.js"></script>
<script type="text/javascript" src="DatabaseTableView.js"></script>
<script type="text/javascript" src="DatabaseQueryView.js"></script>
<script type="text/javascript" src="ProfileView.js"></script>
</head>
<body class="detached">
<div id="toolbar">
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment