Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
Binary file not shown.
2 changes: 1 addition & 1 deletion Source/WebInspectorUI/UserInterface/DataGrid.js
Original file line number Diff line number Diff line change
Expand Up @@ -1303,7 +1303,7 @@ WebInspector.DataGridNode = function(data, hasChildren)
this._data = data || {};
this.hasChildren = hasChildren || false;
this.children = [];
this.dataGrid = this.dataGrid || null;
this.dataGrid = null;
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I reset this to remove the whitespace changes, so I'm not sure if my version was just out of date or not….

this.parent = null;
this.previousSibling = null;
this.nextSibling = null;
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions Source/WebInspectorUI/UserInterface/InstrumentIcons.css
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,10 @@
content: -webkit-image-set(url(Images/Colors.png) 1x, url(Images/Colors@2x.png) 2x);
}

.screenshot-icon .icon {
content: -webkit-image-set(url(Images/Log.png) 1x, url(Images/Log@2x.png) 2x);
}

.script-icon .icon {
content: -webkit-image-set(url(Images/Script.png) 1x, url(Images/Script@2x.png) 2x);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@
outline: none;
color: transparent;
overflow: hidden;

-webkit-appearance: none;

background-color: transparent;
Expand Down Expand Up @@ -98,7 +98,7 @@
top: 22px;
left: 0;
right: 0;
height: 78px;
height: 104px;
}

.sidebar > .panel.instrument > .navigation-sidebar-panel-content-tree-outline.timelines .item:not(:first-child):not(.selected) {
Expand All @@ -110,7 +110,7 @@
}

.sidebar > .panel.instrument > .title-bar.profiles {
top: 100px;
top: 126px;
border-top: 1px solid rgb(179, 179, 179);
height: 23px;
}
Expand Down
18 changes: 16 additions & 2 deletions Source/WebInspectorUI/UserInterface/InstrumentSidebarPanel.js
Original file line number Diff line number Diff line change
Expand Up @@ -75,10 +75,16 @@ WebInspector.InstrumentSidebarPanel = function()
scriptTimelineTreeElement.twoLine = true;
this._timelinesTreeOutline.appendChild(scriptTimelineTreeElement);

var screenshotTimelineTreeElement = new WebInspector.GeneralTreeElement(WebInspector.InstrumentSidebarPanel.ScreenshotIconStyleClass, WebInspector.UIString("Screenshots"), null, WebInspector.TimelineRecord.Type.Screenshot);
screenshotTimelineTreeElement.small = true;
screenshotTimelineTreeElement.twoLine = true;
this._timelinesTreeOutline.appendChild(screenshotTimelineTreeElement);

this._timelineTreeElementMap = {};
this._timelineTreeElementMap[WebInspector.TimelineRecord.Type.Network] = networkTimelineTreeElement;
this._timelineTreeElementMap[WebInspector.TimelineRecord.Type.Layout] = layoutTimelineTreeElement;
this._timelineTreeElementMap[WebInspector.TimelineRecord.Type.Script] = scriptTimelineTreeElement;
this._timelineTreeElementMap[WebInspector.TimelineRecord.Type.Screenshot] = screenshotTimelineTreeElement;

var profilesTitleBarElement = document.createElement("div");
profilesTitleBarElement.textContent = WebInspector.UIString("Profiles");
Expand Down Expand Up @@ -132,6 +138,8 @@ WebInspector.InstrumentSidebarPanel = function()
WebInspector.profileManager.addEventListener(WebInspector.ProfileManager.Event.ProfilingEnded, this._profilingEnded, this);
WebInspector.profileManager.addEventListener(WebInspector.ProfileManager.Event.ProfilingInterrupted, this._profilingInterrupted, this);

this._isCapturingScreenshots = true;

this.emptyContentPlaceholder = WebInspector.UIString("No Recorded Profiles");

// Maps from profile titles -> tree elements.
Expand All @@ -154,6 +162,7 @@ WebInspector.InstrumentSidebarPanel.NetworkIconStyleClass = "network-icon";
WebInspector.InstrumentSidebarPanel.ColorsIconStyleClass = "colors-icon";
WebInspector.InstrumentSidebarPanel.ScriptIconStyleClass = "script-icon";
WebInspector.InstrumentSidebarPanel.ProfileIconStyleClass = "profile-icon";
WebInspector.InstrumentSidebarPanel.ScreenshotIconStyleClass = "screenshot-icon";
WebInspector.InstrumentSidebarPanel.StartJavaScriptProfileValue = "start-javascript-profile";
WebInspector.InstrumentSidebarPanel.StartCSSSelectorProfileValue = "start-css-selector-profile";
WebInspector.InstrumentSidebarPanel.StartCanvasProfileValue = "start-canvas-profile";
Expand Down Expand Up @@ -411,10 +420,15 @@ WebInspector.InstrumentSidebarPanel.prototype = {
// Add forced class to prevent the glyph from showing a confusing status after click.
this._recordGlyphElement.classList.add(WebInspector.InstrumentSidebarPanel.RecordGlyphRecordingForcedStyleClass);

if (WebInspector.timelineManager.recording)
if (WebInspector.timelineManager.recording) {
WebInspector.timelineManager.stopRecording();
else
if (this._isCapturingScreenshots)
WebInspector.timelineManager.clearScreenshotInterval();
} else {
WebInspector.timelineManager.startRecording();
if (this._isCapturingScreenshots)
WebInspector.timelineManager.setScreenshotInterval();
}
},

_titleForProfile: function(profile)
Expand Down
3 changes: 3 additions & 0 deletions Source/WebInspectorUI/UserInterface/Main.html
Original file line number Diff line number Diff line change
Expand Up @@ -351,13 +351,16 @@
<script src="NetworkDataGrid.js"></script>
<script src="LayoutTimelineDataGrid.js"></script>
<script src="ScriptTimelineDataGrid.js"></script>
<script src="ScreenshotTimelineDataGrid.js"></script>
<script src="TimelinesContentView.js"></script>
<script src="ResourceTimelineDataGridNode.js"></script>
<script src="ResourceTimelineDataGridNodePathComponent.js"></script>
<script src="LayoutTimelineRecord.js"></script>
<script src="LayoutTimelineDataGridNode.js"></script>
<script src="ScriptTimelineRecord.js"></script>
<script src="ScriptTimelineDataGridNode.js"></script>
<script src="ScreenshotTimelineRecord.js"></script>
<script src="ScreenshotTimelineDataGridNode.js"></script>
<script src="TimelineOverview.js"></script>
<script src="ProfileManager.js"></script>
<script src="ProfileType.js"></script>
Expand Down
45 changes: 45 additions & 0 deletions Source/WebInspectorUI/UserInterface/ScreenshotTimelineDataGrid.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
/*
* Copyright (C) 2013 University of Washington. 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 THE COPYRIGHT HOLDERS AND 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 THE COPYRIGHT
* HOLDER 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.ScreenshotTimelineDataGrid = function(columns)
{
WebInspector.TimelineDataGrid.call(this, columns);

this.element.classList.add(WebInspector.ScreenshotTimelineDataGrid.ScreenshotDataGridStyleClassName);
}

WebInspector.ScreenshotTimelineDataGrid.ScreenshotDataGridStyleClassName = "screenshot-data-grid";

WebInspector.ScreenshotTimelineDataGrid.prototype = {
constructor: WebInspector.ScreenshotTimelineDataGrid,
__proto__: WebInspector.TimelineDataGrid.prototype,

// Protected

callFramePopoverAnchorElement: function()
{
return this.selectedNode.elementWithColumnIdentifier("image");
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,99 @@
/*
* Copyright (C) 2013 University of Washington. 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 THE COPYRIGHT HOLDERS AND 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 THE COPYRIGHT
* HOLDER 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.ScreenshotTimelineDataGridNode = function(screenshotTimelineRecord, baseStartTime)
{
WebInspector.DataGridNode.call(this, {});

this._record = screenshotTimelineRecord;
this._baseStartTime = baseStartTime || 0;
};

WebInspector.Object.addConstructorFunctions(WebInspector.ScreenshotTimelineDataGridNode);

WebInspector.ScreenshotTimelineDataGridNode.IconStyleClassName = "icon";
WebInspector.ScreenshotTimelineDataGridNode.SubtitleStyleClassName = "subtitle";
WebInspector.ScreenshotTimelineDataGridNode.EmptyImagePlaceholder = "Images/DocumentImage.png";
WebInspector.ScreenshotTimelineDataGridNode.EmptyStringPlaceholder = "\u2014";
WebInspector.ScreenshotTimelineDataGridNode.ScreenshotStyleClassName = "screenshot";
WebInspector.ScreenshotTimelineDataGridNode.EmptyScreenshotStyleClassName = "empty";

WebInspector.ScreenshotTimelineDataGridNode.prototype = {
constructor: WebInspector.ScreenshotTimelineDataGridNode,
__proto__: WebInspector.DataGridNode.prototype,

// Public

get record()
{
return this._record;
},

get data()
{
return this._record;
},

createCellContent: function(columnIdentifier, cell)
{
var emptyString = WebInspector.ScreenshotTimelineDataGridNode.EmptyStringPlaceholder;
var value = this.data[columnIdentifier];

switch (columnIdentifier) {
case "eventType":
return WebInspector.ScreenshotTimelineRecord.EventType.displayName(value);

case "image":
var source = value;
var image = document.createElement("img");
image.classList.add(WebInspector.ScreenshotTimelineDataGridNode.ScreenshotStyleClassName);

if (!source) {
image.src = WebInspector.ScreenshotTimelineDataGridNode.EmptyImagePlaceholder;
image.classList.add(WebInspector.ScreenshotTimelineDataGridNode.EmptyScreenshotStyleClassName);
} else {
image.src = source;
}

return image;

case "x":
case "y":
return isNaN(value) ? emptyString : WebInspector.UIString("%d").format(value);

case "width":
case "height":
return isNaN(value) ? emptyString : WebInspector.UIString("%fpx").format(value);

case "area":
return isNaN(value) ? emptyString : WebInspector.UIString("%fpx²").format(value);

case "startTime":
return isNaN(value) ? emptyString : Number.secondsToString(value - this._baseStartTime);
}

return WebInspector.DataGridNode.prototype.createCellContent.call(this, columnIdentifier);
}
}
94 changes: 94 additions & 0 deletions Source/WebInspectorUI/UserInterface/ScreenshotTimelineRecord.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@

/*
* Copyright (C) 2013 University of Washington. 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 THE COPYRIGHT HOLDERS AND 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 THE COPYRIGHT
* HOLDER 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.ScreenshotTimelineRecord = function(startTime, image, x, y, width, height)
{
WebInspector.TimelineRecord.call(this, WebInspector.TimelineRecord.Type.Screenshot, startTime, startTime);

this._startTime = startTime || NaN;
this._x = x || NaN;
this._y = y || NaN;
this._width = width || NaN;
this._height = height || NaN;
this._image = image;
};

WebInspector.ScreenshotTimelineRecord.EventType = {
ImageCaptured: "screenshot-image-captured"
};

WebInspector.ScreenshotTimelineRecord.EventType.displayName = function(eventType)
{
return WebInspector.UIString("Image Captured");
};

WebInspector.ScreenshotTimelineRecord.prototype = {
constructor: WebInspector.ScreenshotTimelineRecord,

// Public

get eventType()
{
return WebInspector.ScreenshotTimelineRecord.EventType.ImageCaptured;
},

get startTime()
{
return this._startTime;
},

get x()
{
return this._x;
},

get y()
{
return this._y;
},

get width()
{
return this._width;
},

get height()
{
return this._height;
},

get area()
{
return this._width * this._height;
},

get image()
{
return this._image;
}
};

WebInspector.ScreenshotTimelineRecord.prototype.__proto__ = WebInspector.TimelineRecord.prototype;
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
.timeline-decorations > .header {
border-top: 1px solid rgb(200, 200, 200);

height: 22px;
height: 23px;

position: relative;
}
Expand Down
Loading