<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[182040] trunk/Source/WebInspectorUI</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/182040">182040</a></dd>
<dt>Author</dt> <dd>timothy@apple.com</dd>
<dt>Date</dt> <dd>2015-03-26 16:37:45 -0700 (Thu, 26 Mar 2015)</dd>
</dl>
<h3>Log Message</h3>
<pre>Web Inspector: Convert some View classes to ES6 classes
https://bugs.webkit.org/show_bug.cgi?id=143107
Reviewed by Joseph Pecoraro.
* UserInterface/Protocol/InspectorBackend.js:
* UserInterface/Protocol/InspectorFrontendAPI.js:
(InspectorFrontendAPI.contextMenuItemSelected): Updated to the right function path.
* UserInterface/Views/BoxModelDetailsSectionRow.js:
* UserInterface/Views/BreakpointActionView.js:
* UserInterface/Views/CodeMirrorAdditions.js:
* UserInterface/Views/ColorPicker.js:
* UserInterface/Views/ColorWheel.js:
* UserInterface/Views/ContextMenu.js:
* UserInterface/Views/DOMTreeElementPathComponent.js:
* UserInterface/Views/DetailsSection.js:
* UserInterface/Views/DetailsSectionDataGridRow.js:
* UserInterface/Views/DetailsSectionGroup.js:
* UserInterface/Views/DetailsSectionPropertiesRow.js:
* UserInterface/Views/DetailsSectionRow.js:
* UserInterface/Views/DetailsSectionSimpleRow.js:
* UserInterface/Views/DetailsSectionTextRow.js:
* UserInterface/Views/EditingSupport.js:
* UserInterface/Views/EventListenerSection.js:
* UserInterface/Views/EventListenerSectionGroup.js:
* UserInterface/Views/FilterBar.js:
* UserInterface/Views/FindBanner.js:
* UserInterface/Views/GeneralTreeElementPathComponent.js:
* UserInterface/Views/GoToLineDialog.js:
* UserInterface/Views/GradientSlider.js:
* UserInterface/Views/HierarchicalPathComponent.js:
* UserInterface/Views/HierarchicalPathNavigationItem.js:
* UserInterface/Views/HoverMenu.js:
* UserInterface/Views/Popover.js:
* UserInterface/Views/ProbeSetDetailsSection.js:
* UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js:
* UserInterface/Views/SearchBar.js:
* UserInterface/Views/Slider.js:
Converted to ES6 ckasses.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceProtocolInspectorBackendjs">trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorBackend.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceProtocolInspectorFrontendAPIjs">trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorFrontendAPI.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsBoxModelDetailsSectionRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsBreakpointActionViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsCodeMirrorAdditionsjs">trunk/Source/WebInspectorUI/UserInterface/Views/CodeMirrorAdditions.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsColorPickerjs">trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsColorWheeljs">trunk/Source/WebInspectorUI/UserInterface/Views/ColorWheel.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsContextMenujs">trunk/Source/WebInspectorUI/UserInterface/Views/ContextMenu.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDOMTreeElementPathComponentjs">trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElementPathComponent.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionjs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionDataGridRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionDataGridRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionGroupjs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionGroup.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionPropertiesRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionPropertiesRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionSimpleRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionSimpleRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionTextRowjs">trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionTextRow.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsEditingSupportjs">trunk/Source/WebInspectorUI/UserInterface/Views/EditingSupport.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsEventListenerSectionjs">trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSection.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsEventListenerSectionGroupjs">trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSectionGroup.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsFilterBarjs">trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsFindBannerjs">trunk/Source/WebInspectorUI/UserInterface/Views/FindBanner.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsGeneralTreeElementPathComponentjs">trunk/Source/WebInspectorUI/UserInterface/Views/GeneralTreeElementPathComponent.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsGoToLineDialogjs">trunk/Source/WebInspectorUI/UserInterface/Views/GoToLineDialog.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsGradientSliderjs">trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsHierarchicalPathComponentjs">trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathComponent.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsHierarchicalPathNavigationItemjs">trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathNavigationItem.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsHoverMenujs">trunk/Source/WebInspectorUI/UserInterface/Views/HoverMenu.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsPopoverjs">trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsProbeSetDetailsSectionjs">trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsResizerjs">trunk/Source/WebInspectorUI/UserInterface/Views/Resizer.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsResourceTimelineDataGridNodePathComponentjs">trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsScopeBarjs">trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsScopeBarItemjs">trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBarItem.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsSearchBarjs">trunk/Source/WebInspectorUI/UserInterface/Views/SearchBar.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsSliderjs">trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTypeTokenViewjs">trunk/Source/WebInspectorUI/UserInterface/Views/TypeTokenView.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/ChangeLog 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,47 @@
</span><span class="cx"> 2015-03-26 Timothy Hatcher <timothy@apple.com>
</span><span class="cx">
</span><ins>+ Web Inspector: Convert some View classes to ES6 classes
+ https://bugs.webkit.org/show_bug.cgi?id=143107
+
+ Reviewed by Joseph Pecoraro.
+
+ * UserInterface/Protocol/InspectorBackend.js:
+ * UserInterface/Protocol/InspectorFrontendAPI.js:
+ (InspectorFrontendAPI.contextMenuItemSelected): Updated to the right function path.
+ * UserInterface/Views/BoxModelDetailsSectionRow.js:
+ * UserInterface/Views/BreakpointActionView.js:
+ * UserInterface/Views/CodeMirrorAdditions.js:
+ * UserInterface/Views/ColorPicker.js:
+ * UserInterface/Views/ColorWheel.js:
+ * UserInterface/Views/ContextMenu.js:
+ * UserInterface/Views/DOMTreeElementPathComponent.js:
+ * UserInterface/Views/DetailsSection.js:
+ * UserInterface/Views/DetailsSectionDataGridRow.js:
+ * UserInterface/Views/DetailsSectionGroup.js:
+ * UserInterface/Views/DetailsSectionPropertiesRow.js:
+ * UserInterface/Views/DetailsSectionRow.js:
+ * UserInterface/Views/DetailsSectionSimpleRow.js:
+ * UserInterface/Views/DetailsSectionTextRow.js:
+ * UserInterface/Views/EditingSupport.js:
+ * UserInterface/Views/EventListenerSection.js:
+ * UserInterface/Views/EventListenerSectionGroup.js:
+ * UserInterface/Views/FilterBar.js:
+ * UserInterface/Views/FindBanner.js:
+ * UserInterface/Views/GeneralTreeElementPathComponent.js:
+ * UserInterface/Views/GoToLineDialog.js:
+ * UserInterface/Views/GradientSlider.js:
+ * UserInterface/Views/HierarchicalPathComponent.js:
+ * UserInterface/Views/HierarchicalPathNavigationItem.js:
+ * UserInterface/Views/HoverMenu.js:
+ * UserInterface/Views/Popover.js:
+ * UserInterface/Views/ProbeSetDetailsSection.js:
+ * UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js:
+ * UserInterface/Views/SearchBar.js:
+ * UserInterface/Views/Slider.js:
+ Converted to ES6 classes.
+
+2015-03-26 Timothy Hatcher <timothy@apple.com>
+
</ins><span class="cx"> Web Inspector: Convert Base and Protocol files to ES6 classes
</span><span class="cx"> https://bugs.webkit.org/show_bug.cgi?id=143106
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceProtocolInspectorBackendjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorBackend.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorBackend.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorBackend.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,6 +1,6 @@
</span><span class="cx"> /*
</span><span class="cx"> * Copyright (C) 2011 Google Inc. All rights reserved.
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> * Copyright (C) 2014 University of Washington.
</span><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="lines">@@ -180,7 +180,7 @@
</span><span class="cx"> try {
</span><span class="cx"> callback.apply(null, callbackArguments);
</span><span class="cx"> } catch (e) {
</span><del>- console.error("Uncaught exception in inspector page while dispatching callback for command " + command.qualifiedName + ": ", e);
</del><ins>+ console.error("Uncaught exception in inspector page while dispatching callback for command " + command.qualifiedName + ": ", e, e.stack);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> var processingDuration = Date.now() - processingStartTime;
</span><span class="lines">@@ -232,7 +232,7 @@
</span><span class="cx"> try {
</span><span class="cx"> agent.dispatchEvent(eventName, eventArguments);
</span><span class="cx"> } catch (e) {
</span><del>- console.error("Uncaught exception in inspector page while handling event " + qualifiedName + ": ", e);
</del><ins>+ console.error("Uncaught exception in inspector page while handling event " + qualifiedName + ": ", e, e.stack);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> var processingDuration = Date.now() - processingStartTime;
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceProtocolInspectorFrontendAPIjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorFrontendAPI.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorFrontendAPI.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Protocol/InspectorFrontendAPI.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -98,7 +98,7 @@
</span><span class="cx">
</span><span class="cx"> contextMenuItemSelected: function(id)
</span><span class="cx"> {
</span><del>- WebInspector.contextMenuItemSelected(id);
</del><ins>+ WebInspector.ContextMenu.contextMenuItemSelected(id);
</ins><span class="cx"> },
</span><span class="cx">
</span><span class="cx"> contextMenuCleared: function()
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsBoxModelDetailsSectionRowjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,38 +23,34 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.BoxModelDetailsSectionRow = function() {
- WebInspector.DetailsSectionRow.call(this, WebInspector.UIString("No Box Model Information"));
</del><ins>+WebInspector.BoxModelDetailsSectionRow = class BoxModelDetailsSectionRow extends WebInspector.DetailsSectionRow
+{
+ constructor()
+ {
+ super(WebInspector.UIString("No Box Model Information"));
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.BoxModelDetailsSectionRow.StyleClassName);
</del><ins>+ this.element.classList.add(WebInspector.BoxModelDetailsSectionRow.StyleClassName);
</ins><span class="cx">
</span><del>- this._nodeStyles = null;
-};
</del><ins>+ this._nodeStyles = null;
+ }
</ins><span class="cx">
</span><del>-WebInspector.BoxModelDetailsSectionRow.StyleClassName = "box-model";
-WebInspector.BoxModelDetailsSectionRow.StyleValueDelimiters = " \xA0\t\n\"':;,/()";
-WebInspector.BoxModelDetailsSectionRow.CSSNumberRegex = /^(-?(?:\d+(?:\.\d+)?|\.\d+))$/;
-
-WebInspector.BoxModelDetailsSectionRow.prototype = {
- constructor: WebInspector.BoxModelDetailsSectionRow,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get nodeStyles()
</span><span class="cx"> {
</span><span class="cx"> return this._nodeStyles;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set nodeStyles(nodeStyles)
</span><span class="cx"> {
</span><span class="cx"> this._nodeStyles = nodeStyles;
</span><span class="cx">
</span><span class="cx"> this._refresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _refresh: function()
</del><ins>+ _refresh()
</ins><span class="cx"> {
</span><span class="cx"> if (this._ignoreNextRefresh) {
</span><span class="cx"> delete this._ignoreNextRefresh;
</span><span class="lines">@@ -62,14 +58,14 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._updateMetrics();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _getPropertyValueAsPx: function(style, propertyName)
</del><ins>+ _getPropertyValueAsPx(style, propertyName)
</ins><span class="cx"> {
</span><span class="cx"> return Number(style.propertyForName(propertyName).value.replace(/px$/, "") || 0);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _getBox: function(computedStyle, componentName)
</del><ins>+ _getBox(computedStyle, componentName)
</ins><span class="cx"> {
</span><span class="cx"> var suffix = componentName === "border" ? "-width" : "";
</span><span class="cx"> var left = this._getPropertyValueAsPx(computedStyle, componentName + "-left" + suffix);
</span><span class="lines">@@ -77,9 +73,9 @@
</span><span class="cx"> var right = this._getPropertyValueAsPx(computedStyle, componentName + "-right" + suffix);
</span><span class="cx"> var bottom = this._getPropertyValueAsPx(computedStyle, componentName + "-bottom" + suffix);
</span><span class="cx"> return {left, top, right, bottom};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _highlightDOMNode: function(showHighlight, mode, event)
</del><ins>+ _highlightDOMNode(showHighlight, mode, event)
</ins><span class="cx"> {
</span><span class="cx"> event.stopPropagation();
</span><span class="cx">
</span><span class="lines">@@ -101,9 +97,9 @@
</span><span class="cx"> else
</span><span class="cx"> element.classList.remove("active");
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateMetrics: function()
</del><ins>+ _updateMetrics()
</ins><span class="cx"> {
</span><span class="cx"> // Updating with computed style.
</span><span class="cx"> var metricsElement = document.createElement("div");
</span><span class="lines">@@ -252,9 +248,9 @@
</span><span class="cx">
</span><span class="cx"> this.hideEmptyMessage();
</span><span class="cx"> this.element.appendChild(metricsElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _startEditing: function(targetElement, box, styleProperty, computedStyle)
</del><ins>+ _startEditing(targetElement, box, styleProperty, computedStyle)
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.isBeingEdited(targetElement))
</span><span class="cx"> return;
</span><span class="lines">@@ -275,9 +271,9 @@
</span><span class="cx"> WebInspector.startEditing(targetElement, config);
</span><span class="cx">
</span><span class="cx"> window.getSelection().setBaseAndExtent(targetElement, 0, targetElement, 1);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _alteredFloatNumber: function(number, event)
</del><ins>+ _alteredFloatNumber(number, event)
</ins><span class="cx"> {
</span><span class="cx"> var arrowKeyPressed = (event.keyIdentifier === "Up" || event.keyIdentifier === "Down");
</span><span class="cx">
</span><span class="lines">@@ -301,9 +297,9 @@
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> return result;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleKeyDown: function(context, styleProperty, event)
</del><ins>+ _handleKeyDown(context, styleProperty, event)
</ins><span class="cx"> {
</span><span class="cx"> if (!/^(?:Page)?(?:Up|Down)$/.test(event.keyIdentifier))
</span><span class="cx"> return;
</span><span class="lines">@@ -360,23 +356,23 @@
</span><span class="cx"> this._ignoreNextRefresh = true;
</span><span class="cx">
</span><span class="cx"> this._applyUserInput(element, replacementString, originalValue, context, false);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _editingEnded: function(element, context)
</del><ins>+ _editingEnded(element, context)
</ins><span class="cx"> {
</span><span class="cx"> delete this.originalPropertyData;
</span><span class="cx"> delete this.previousPropertyDataCandidate;
</span><span class="cx"> element.removeEventListener("keydown", context.keyDownHandler, false);
</span><span class="cx"> delete this._isEditingMetrics;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _editingCancelled: function(element, context)
</del><ins>+ _editingCancelled(element, context)
</ins><span class="cx"> {
</span><span class="cx"> this._editingEnded(element, context);
</span><span class="cx"> this._refresh();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _applyUserInput: function(element, userInput, previousContent, context, commitEditor)
</del><ins>+ _applyUserInput(element, userInput, previousContent, context, commitEditor)
</ins><span class="cx"> {
</span><span class="cx"> if (commitEditor && userInput === previousContent) {
</span><span class="cx"> // Nothing changed, so cancel.
</span><span class="lines">@@ -419,13 +415,15 @@
</span><span class="cx"> var property = this._nodeStyles.inlineStyle.propertyForName(context.styleProperty);
</span><span class="cx"> property.value = userInput;
</span><span class="cx"> property.add();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _editingCommitted: function(element, userInput, previousContent, context)
</del><ins>+ _editingCommitted(element, userInput, previousContent, context)
</ins><span class="cx"> {
</span><span class="cx"> this._editingEnded(element, context);
</span><span class="cx"> this._applyUserInput(element, userInput, previousContent, context, true);
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.BoxModelDetailsSectionRow.prototype.__proto__ = WebInspector.DetailsSectionRow.prototype;
</del><ins>+WebInspector.BoxModelDetailsSectionRow.StyleClassName = "box-model";
+WebInspector.BoxModelDetailsSectionRow.StyleValueDelimiters = " \xA0\t\n\"':;,/()";
+WebInspector.BoxModelDetailsSectionRow.CSSNumberRegex = /^(-?(?:\d+(?:\.\d+)?|\.\d+))$/;
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsBreakpointActionViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,107 +23,107 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.BreakpointActionView = function(action, delegate, omitFocus)
</del><ins>+WebInspector.BreakpointActionView = class BreakpointActionView extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ constructor(action, delegate, omitFocus)
+ {
+ super();
</ins><span class="cx">
</span><del>- console.assert(action);
- console.assert(delegate);
- console.assert(DebuggerAgent.BreakpointActionType);
</del><ins>+ console.assert(action);
+ console.assert(delegate);
+ console.assert(DebuggerAgent.BreakpointActionType);
</ins><span class="cx">
</span><del>- this._action = action;
- this._delegate = delegate;
</del><ins>+ this._action = action;
+ this._delegate = delegate;
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = "breakpoint-action-block";
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "breakpoint-action-block";
</ins><span class="cx">
</span><del>- var header = this._element.appendChild(document.createElement("div"));
- header.className = "breakpoint-action-block-header";
</del><ins>+ var header = this._element.appendChild(document.createElement("div"));
+ header.className = "breakpoint-action-block-header";
</ins><span class="cx">
</span><del>- var picker = header.appendChild(document.createElement("select"));
- picker.addEventListener("change", this._pickerChanged.bind(this));
</del><ins>+ var picker = header.appendChild(document.createElement("select"));
+ picker.addEventListener("change", this._pickerChanged.bind(this));
</ins><span class="cx">
</span><del>- for (var key in WebInspector.BreakpointAction.Type) {
- var type = WebInspector.BreakpointAction.Type[key];
- var option = document.createElement("option");
- option.textContent = WebInspector.BreakpointActionView.displayStringForType(type);
- option.selected = this._action.type === type;
- option.value = type;
- picker.add(option);
- }
</del><ins>+ for (var key in WebInspector.BreakpointAction.Type) {
+ var type = WebInspector.BreakpointAction.Type[key];
+ var option = document.createElement("option");
+ option.textContent = WebInspector.BreakpointActionView.displayStringForType(type);
+ option.selected = this._action.type === type;
+ option.value = type;
+ picker.add(option);
+ }
</ins><span class="cx">
</span><del>- var appendActionButton = header.appendChild(document.createElement("button"));
- appendActionButton.className = "breakpoint-action-append-button";
- appendActionButton.addEventListener("click", this._appendActionButtonClicked.bind(this));
- appendActionButton.title = WebInspector.UIString("Add new breakpoint action after this action");
</del><ins>+ var appendActionButton = header.appendChild(document.createElement("button"));
+ appendActionButton.className = "breakpoint-action-append-button";
+ appendActionButton.addEventListener("click", this._appendActionButtonClicked.bind(this));
+ appendActionButton.title = WebInspector.UIString("Add new breakpoint action after this action");
</ins><span class="cx">
</span><del>- var removeActionButton = header.appendChild(document.createElement("button"));
- removeActionButton.className = "breakpoint-action-remove-button";
- removeActionButton.addEventListener("click", this._removeAction.bind(this));
- removeActionButton.title = WebInspector.UIString("Remove this breakpoint action");
</del><ins>+ var removeActionButton = header.appendChild(document.createElement("button"));
+ removeActionButton.className = "breakpoint-action-remove-button";
+ removeActionButton.addEventListener("click", this._removeAction.bind(this));
+ removeActionButton.title = WebInspector.UIString("Remove this breakpoint action");
</ins><span class="cx">
</span><del>- this._bodyElement = this._element.appendChild(document.createElement("div"));
- this._bodyElement.className = "breakpoint-action-block-body";
</del><ins>+ this._bodyElement = this._element.appendChild(document.createElement("div"));
+ this._bodyElement.className = "breakpoint-action-block-body";
</ins><span class="cx">
</span><del>- this._updateBody(omitFocus);
-};
-
-WebInspector.BreakpointActionView.displayStringForType = function(type)
-{
- switch (type) {
- case WebInspector.BreakpointAction.Type.Log:
- return WebInspector.UIString("Log Message");
- case WebInspector.BreakpointAction.Type.Evaluate:
- return WebInspector.UIString("Evaluate JavaScript");
- case WebInspector.BreakpointAction.Type.Sound:
- return WebInspector.UIString("Play Sound");
- case WebInspector.BreakpointAction.Type.Probe:
- return WebInspector.UIString("Probe Expression");
- default:
- console.assert(false);
- return "";
</del><ins>+ this._updateBody(omitFocus);
</ins><span class="cx"> }
</span><del>-};
</del><span class="cx">
</span><del>-WebInspector.BreakpointActionView.prototype = {
- constructor: WebInspector.BreakpointActionView,
</del><ins>+ // Static
</ins><span class="cx">
</span><ins>+ static displayStringForType(type)
+ {
+ switch (type) {
+ case WebInspector.BreakpointAction.Type.Log:
+ return WebInspector.UIString("Log Message");
+ case WebInspector.BreakpointAction.Type.Evaluate:
+ return WebInspector.UIString("Evaluate JavaScript");
+ case WebInspector.BreakpointAction.Type.Sound:
+ return WebInspector.UIString("Play Sound");
+ case WebInspector.BreakpointAction.Type.Probe:
+ return WebInspector.UIString("Probe Expression");
+ default:
+ console.assert(false);
+ return "";
+ }
+ }
+
</ins><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get action()
</span><span class="cx"> {
</span><span class="cx"> return this._action;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _pickerChanged: function(event)
</del><ins>+ _pickerChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> var newType = event.target.value;
</span><span class="cx"> this._action = this._action.breakpoint.recreateAction(newType, this._action);
</span><span class="cx"> this._updateBody();
</span><span class="cx"> this._delegate.breakpointActionViewResized(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _appendActionButtonClicked: function(event)
</del><ins>+ _appendActionButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> var newAction = this._action.breakpoint.createAction(WebInspector.Breakpoint.DefaultBreakpointActionType, this._action);
</span><span class="cx"> this._delegate.breakpointActionViewAppendActionView(this, newAction);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _removeAction: function()
</del><ins>+ _removeAction()
</ins><span class="cx"> {
</span><span class="cx"> this._action.breakpoint.removeAction(this._action);
</span><span class="cx"> this._delegate.breakpointActionViewRemoveActionView(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateBody: function(omitFocus)
</del><ins>+ _updateBody(omitFocus)
</ins><span class="cx"> {
</span><span class="cx"> this._bodyElement.removeChildren();
</span><span class="cx">
</span><span class="lines">@@ -182,14 +182,14 @@
</span><span class="cx"> this._bodyElement.hidden = true;
</span><span class="cx"> break;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _logInputChanged: function(event)
</del><ins>+ _logInputChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> this._action.data = event.target.value;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _codeMirrorBlurred: function(event)
</del><ins>+ _codeMirrorBlurred(event)
</ins><span class="cx"> {
</span><span class="cx"> // Throw away the expression if it's just whitespace.
</span><span class="cx"> var data = (this._codeMirror.getValue() || "").trim();
</span><span class="lines">@@ -198,12 +198,10 @@
</span><span class="cx"> this._removeAction();
</span><span class="cx"> else
</span><span class="cx"> this._action.data = data;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _codeMirrorViewportChanged: function(event)
</del><ins>+ _codeMirrorViewportChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> this._delegate.breakpointActionViewResized(this);
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.BreakpointActionView.prototype.__proto__ = WebInspector.Object.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsCodeMirrorAdditionsjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CodeMirrorAdditions.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/CodeMirrorAdditions.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CodeMirrorAdditions.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -182,7 +182,7 @@
</span><span class="cx">
</span><span class="cx"> function extendedCSSToken(stream, state)
</span><span class="cx"> {
</span><del>- const hexColorRegex = /#(?:[0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/g;
</del><ins>+ var hexColorRegex = /#(?:[0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/g;
</ins><span class="cx">
</span><span class="cx"> if (state._urlTokenize) {
</span><span class="cx"> // Call the link tokenizer instead.
</span><span class="lines">@@ -503,7 +503,7 @@
</span><span class="cx"> var end = range instanceof WebInspector.TextRange ? range.endLine + 1 : this.lineCount();
</span><span class="cx">
</span><span class="cx"> // Matches rgba(0, 0, 0, 0.5), rgb(0, 0, 0), hsl(), hsla(), #fff, #ffffff, white
</span><del>- const colorRegex = /((?:rgb|hsl)a?\([^)]+\)|#[0-9a-fA-F]{6}|#[0-9a-fA-F]{3}|\b\w+\b(?![-.]))/g;
</del><ins>+ var colorRegex = /((?:rgb|hsl)a?\([^)]+\)|#[0-9a-fA-F]{6}|#[0-9a-fA-F]{3}|\b\w+\b(?![-.]))/g;
</ins><span class="cx">
</span><span class="cx"> for (var lineNumber = start; lineNumber < end; ++lineNumber) {
</span><span class="cx"> var lineContent = this.getLine(lineNumber);
</span><span class="lines">@@ -568,7 +568,7 @@
</span><span class="cx"> var start = range instanceof WebInspector.TextRange ? range.startLine : 0;
</span><span class="cx"> var end = range instanceof WebInspector.TextRange ? range.endLine + 1 : this.lineCount();
</span><span class="cx">
</span><del>- const gradientRegex = /(repeating-)?(linear|radial)-gradient\s*\(\s*/g;
</del><ins>+ var gradientRegex = /(repeating-)?(linear|radial)-gradient\s*\(\s*/g;
</ins><span class="cx">
</span><span class="cx"> for (var lineNumber = start; lineNumber < end; ++lineNumber) {
</span><span class="cx"> var lineContent = this.getLine(lineNumber);
</span><span class="lines">@@ -653,23 +653,23 @@
</span><span class="cx">
</span><span class="cx"> // Register some extra MIME-types for CodeMirror. These are in addition to the
</span><span class="cx"> // ones CodeMirror already registers, like text/html, text/javascript, etc.
</span><del>- const extraXMLTypes = ["text/xml", "text/xsl"];
</del><ins>+ var extraXMLTypes = ["text/xml", "text/xsl"];
</ins><span class="cx"> extraXMLTypes.forEach(function(type) {
</span><span class="cx"> CodeMirror.defineMIME(type, "xml");
</span><span class="cx"> });
</span><span class="cx">
</span><del>- const extraHTMLTypes = ["application/xhtml+xml", "image/svg+xml"];
</del><ins>+ var extraHTMLTypes = ["application/xhtml+xml", "image/svg+xml"];
</ins><span class="cx"> extraHTMLTypes.forEach(function(type) {
</span><span class="cx"> CodeMirror.defineMIME(type, "htmlmixed");
</span><span class="cx"> });
</span><span class="cx">
</span><del>- const extraJavaScriptTypes = ["text/ecmascript", "application/javascript", "application/ecmascript", "application/x-javascript",
</del><ins>+ var extraJavaScriptTypes = ["text/ecmascript", "application/javascript", "application/ecmascript", "application/x-javascript",
</ins><span class="cx"> "text/x-javascript", "text/javascript1.1", "text/javascript1.2", "text/javascript1.3", "text/jscript", "text/livescript"];
</span><span class="cx"> extraJavaScriptTypes.forEach(function(type) {
</span><span class="cx"> CodeMirror.defineMIME(type, "javascript");
</span><span class="cx"> });
</span><span class="cx">
</span><del>- const extraJSONTypes = ["application/x-json", "text/x-json"];
</del><ins>+ var extraJSONTypes = ["application/x-json", "text/x-json"];
</ins><span class="cx"> extraJSONTypes.forEach(function(type) {
</span><span class="cx"> CodeMirror.defineMIME(type, {name: "javascript", json: true});
</span><span class="cx"> });
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsColorPickerjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,50 +23,43 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ColorPicker = function()
</del><ins>+WebInspector.ColorPicker = class ColorPicker extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ constructor()
+ {
+ super();
</ins><span class="cx">
</span><del>- this._colorWheel = new WebInspector.ColorWheel();
- this._colorWheel.delegate = this;
- this._colorWheel.dimension = 200;
</del><ins>+ this._colorWheel = new WebInspector.ColorWheel();
+ this._colorWheel.delegate = this;
+ this._colorWheel.dimension = 200;
</ins><span class="cx">
</span><del>- this._brightnessSlider = new WebInspector.Slider();
- this._brightnessSlider.delegate = this;
- this._brightnessSlider.element.classList.add("brightness");
</del><ins>+ this._brightnessSlider = new WebInspector.Slider();
+ this._brightnessSlider.delegate = this;
+ this._brightnessSlider.element.classList.add("brightness");
</ins><span class="cx">
</span><del>- this._opacitySlider = new WebInspector.Slider();
- this._opacitySlider.delegate = this;
- this._opacitySlider.element.classList.add("opacity");
</del><ins>+ this._opacitySlider = new WebInspector.Slider();
+ this._opacitySlider.delegate = this;
+ this._opacitySlider.element.classList.add("opacity");
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = "color-picker";
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "color-picker";
</ins><span class="cx">
</span><del>- this._element.appendChild(this._colorWheel.element);
- this._element.appendChild(this._brightnessSlider.element);
- this._element.appendChild(this._opacitySlider.element);
</del><ins>+ this._element.appendChild(this._colorWheel.element);
+ this._element.appendChild(this._brightnessSlider.element);
+ this._element.appendChild(this._opacitySlider.element);
</ins><span class="cx">
</span><del>- this._opacity = 0;
- this._opacityPattern = "url(Images/Checkers.svg)";
</del><ins>+ this._opacity = 0;
+ this._opacityPattern = "url(Images/Checkers.svg)";
</ins><span class="cx">
</span><del>- this._color = "white";
-};
</del><ins>+ this._color = "white";
+ }
</ins><span class="cx">
</span><del>-WebInspector.ColorPicker.Event = {
- ColorChanged: "css-color-picker-color-changed"
-};
-
-WebInspector.ColorPicker.prototype = {
- contructor: WebInspector.ColorPicker,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set brightness(brightness)
</span><span class="cx"> {
</span><span class="lines">@@ -77,7 +70,7 @@
</span><span class="cx">
</span><span class="cx"> this._updateColor();
</span><span class="cx"> this._updateSliders(this._colorWheel.rawColor, this._colorWheel.tintedColor);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set opacity(opacity)
</span><span class="cx"> {
</span><span class="lines">@@ -86,17 +79,17 @@
</span><span class="cx">
</span><span class="cx"> this._opacity = opacity;
</span><span class="cx"> this._updateColor();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get colorWheel()
</span><span class="cx"> {
</span><span class="cx"> return this._colorWheel;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get color()
</span><span class="cx"> {
</span><span class="cx"> return this._color;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set color(color)
</span><span class="cx"> {
</span><span class="lines">@@ -111,25 +104,25 @@
</span><span class="cx"> this._updateSliders(this._colorWheel.rawColor, color);
</span><span class="cx">
</span><span class="cx"> delete this._dontUpdateColor;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- colorWheelColorDidChange: function(colorWheel)
</del><ins>+ colorWheelColorDidChange(colorWheel)
</ins><span class="cx"> {
</span><span class="cx"> this._updateColor();
</span><span class="cx"> this._updateSliders(this._colorWheel.rawColor, this._colorWheel.tintedColor);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- sliderValueDidChange: function(slider, value)
</del><ins>+ sliderValueDidChange(slider, value)
</ins><span class="cx"> {
</span><span class="cx"> if (slider === this._opacitySlider)
</span><span class="cx"> this.opacity = value;
</span><span class="cx"> else if (slider === this._brightnessSlider)
</span><span class="cx"> this.brightness = value;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _updateColor: function()
</del><ins>+ _updateColor()
</ins><span class="cx"> {
</span><span class="cx"> if (this._dontUpdateColor)
</span><span class="cx"> return;
</span><span class="lines">@@ -144,9 +137,9 @@
</span><span class="cx">
</span><span class="cx"> this._color = new WebInspector.Color(this._colorFormat, components);
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.ColorPicker.Event.ColorChanged, {color: this._color});
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateSliders: function(rawColor, tintedColor)
</del><ins>+ _updateSliders(rawColor, tintedColor)
</ins><span class="cx"> {
</span><span class="cx"> var rgb = this._colorWheel.tintedColor.rgb;
</span><span class="cx"> var opaque = new WebInspector.Color(WebInspector.Color.Format.RGBA, rgb.concat(1)).toString();
</span><span class="lines">@@ -156,3 +149,7 @@
</span><span class="cx"> this._brightnessSlider.element.style.backgroundImage = "linear-gradient(90deg, black, " + rawColor + ")";
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.ColorPicker.Event = {
+ ColorChanged: "css-color-picker-color-changed"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsColorWheeljs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorWheel.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorWheel.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorWheel.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,31 +23,28 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ColorWheel = function()
</del><ins>+WebInspector.ColorWheel = class ColorWheel extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ constructor()
+ {
+ super();
</ins><span class="cx">
</span><del>- this._rawCanvas = document.createElement("canvas");
- this._tintedCanvas = document.createElement("canvas");
- this._finalCanvas = document.createElement("canvas");
</del><ins>+ this._rawCanvas = document.createElement("canvas");
+ this._tintedCanvas = document.createElement("canvas");
+ this._finalCanvas = document.createElement("canvas");
</ins><span class="cx">
</span><del>- this._crosshair = document.createElement("div");
- this._crosshair.className = "crosshair";
</del><ins>+ this._crosshair = document.createElement("div");
+ this._crosshair.className = "crosshair";
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = "color-wheel";
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "color-wheel";
</ins><span class="cx">
</span><del>- this._element.appendChild(this._finalCanvas);
- this._element.appendChild(this._crosshair);
</del><ins>+ this._element.appendChild(this._finalCanvas);
+ this._element.appendChild(this._crosshair);
</ins><span class="cx">
</span><del>- this._finalCanvas.addEventListener("mousedown", this);
-};
</del><ins>+ this._finalCanvas.addEventListener("mousedown", this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ColorWheel.prototype = {
- contructor: WebInspector.ColorWheel,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> set dimension(dimension)
</span><span class="lines">@@ -65,23 +62,23 @@
</span><span class="cx">
</span><span class="cx"> this._drawRawCanvas();
</span><span class="cx"> this._draw();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get brightness()
</span><span class="cx"> {
</span><span class="cx"> return this._brightness;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set brightness(brightness)
</span><span class="cx"> {
</span><span class="cx"> this._brightness = brightness;
</span><span class="cx"> this._draw();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get tintedColor()
</span><span class="cx"> {
</span><span class="lines">@@ -89,14 +86,14 @@
</span><span class="cx"> return this._colorAtPointWithBrightness(this._crosshairPosition.x * window.devicePixelRatio, this._crosshairPosition.y * window.devicePixelRatio, this._brightness);
</span><span class="cx">
</span><span class="cx"> return new WebInspector.Color(WebInspector.Color.Format.RGBA, [0, 0, 0, 0]);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set tintedColor(tintedColor)
</span><span class="cx"> {
</span><span class="cx"> var data = this._tintedColorToPointAndBrightness(tintedColor);
</span><span class="cx"> this._setCrosshairPosition(data.point);
</span><span class="cx"> this.brightness = data.brightness;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get rawColor()
</span><span class="cx"> {
</span><span class="lines">@@ -104,11 +101,11 @@
</span><span class="cx"> return this._colorAtPointWithBrightness(this._crosshairPosition.x * window.devicePixelRatio, this._crosshairPosition.y * window.devicePixelRatio, 1);
</span><span class="cx">
</span><span class="cx"> return new WebInspector.Color(WebInspector.Color.Format.RGBA, [0, 0, 0, 0]);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> switch (event.type) {
</span><span class="cx"> case "mousedown":
</span><span class="lines">@@ -121,30 +118,30 @@
</span><span class="cx"> this._handleMouseup(event);
</span><span class="cx"> break;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _handleMousedown: function(event)
</del><ins>+ _handleMousedown(event)
</ins><span class="cx"> {
</span><span class="cx"> window.addEventListener("mousemove", this, true);
</span><span class="cx"> window.addEventListener("mouseup", this, true);
</span><span class="cx">
</span><span class="cx"> this._updateColorForMouseEvent(event);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMousemove: function(event)
</del><ins>+ _handleMousemove(event)
</ins><span class="cx"> {
</span><span class="cx"> this._updateColorForMouseEvent(event);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMouseup: function(event)
</del><ins>+ _handleMouseup(event)
</ins><span class="cx"> {
</span><span class="cx"> window.removeEventListener("mousemove", this, true);
</span><span class="cx"> window.removeEventListener("mouseup", this, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _pointInCircleForEvent: function(event)
</del><ins>+ _pointInCircleForEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> function distance(a, b)
</span><span class="cx"> {
</span><span class="lines">@@ -169,9 +166,9 @@
</span><span class="cx"> point = pointOnCircumference(center, this._radius, angle);
</span><span class="cx"> }
</span><span class="cx"> return point;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateColorForMouseEvent: function(event)
</del><ins>+ _updateColorForMouseEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> var point = this._pointInCircleForEvent(event);
</span><span class="cx">
</span><span class="lines">@@ -179,15 +176,15 @@
</span><span class="cx">
</span><span class="cx"> if (this.delegate && typeof this.delegate.colorWheelColorDidChange === "function")
</span><span class="cx"> this.delegate.colorWheelColorDidChange(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _setCrosshairPosition: function(point)
</del><ins>+ _setCrosshairPosition(point)
</ins><span class="cx"> {
</span><span class="cx"> this._crosshairPosition = point;
</span><span class="cx"> this._crosshair.style.webkitTransform = "translate(" + Math.round(point.x) + "px, " + Math.round(point.y) + "px)";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _tintedColorToPointAndBrightness: function(color)
</del><ins>+ _tintedColorToPointAndBrightness(color)
</ins><span class="cx"> {
</span><span class="cx"> var rgb = color.rgb;
</span><span class="cx"> var hsv = WebInspector.Color.rgb2hsv(rgb[0], rgb[1], rgb[2]);
</span><span class="lines">@@ -200,9 +197,9 @@
</span><span class="cx"> point: new WebInspector.Point(x, y),
</span><span class="cx"> brightness: hsv[2]
</span><span class="cx"> };
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawRawCanvas: function() {
</del><ins>+ _drawRawCanvas() {
</ins><span class="cx"> var ctx = this._rawCanvas.getContext("2d");
</span><span class="cx">
</span><span class="cx"> var dimension = this._dimension * window.devicePixelRatio;
</span><span class="lines">@@ -225,9 +222,9 @@
</span><span class="cx"> }
</span><span class="cx"> }
</span><span class="cx"> ctx.putImageData(imageData, 0, 0);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _colorAtPointWithBrightness: function(x, y, brightness)
</del><ins>+ _colorAtPointWithBrightness(x, y, brightness)
</ins><span class="cx"> {
</span><span class="cx"> var center = this._dimension / 2 * window.devicePixelRatio;
</span><span class="cx"> var xDis = x - center;
</span><span class="lines">@@ -249,9 +246,9 @@
</span><span class="cx"> Math.round(rgb[2] * 255),
</span><span class="cx"> 1
</span><span class="cx"> ]);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawTintedCanvas: function()
</del><ins>+ _drawTintedCanvas()
</ins><span class="cx"> {
</span><span class="cx"> var ctx = this._tintedCanvas.getContext("2d");
</span><span class="cx"> var dimension = this._dimension * window.devicePixelRatio;
</span><span class="lines">@@ -264,9 +261,9 @@
</span><span class="cx"> ctx.fillRect(0, 0, dimension, dimension);
</span><span class="cx"> }
</span><span class="cx"> ctx.restore();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _draw: function()
</del><ins>+ _draw()
</ins><span class="cx"> {
</span><span class="cx"> this._drawTintedCanvas();
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsContextMenujs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ContextMenu.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ContextMenu.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ContextMenu.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,6 +1,6 @@
</span><span class="cx"> /*
</span><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> * Copyright (C) 2009 Google Inc. All rights reserved.
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions are
</span><span class="lines">@@ -29,39 +29,47 @@
</span><span class="cx"> * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ContextMenuItem = function(topLevelMenu, type, label, disabled, checked)
</del><ins>+WebInspector.ContextMenuItem = class ContextMenuItem extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- this._type = type;
- this._label = label;
- this._disabled = disabled;
- this._checked = checked;
- this._contextMenu = topLevelMenu;
- if (type === "item" || type === "checkbox")
- this._id = topLevelMenu.nextId();
-};
</del><ins>+ constructor(topLevelMenu, type, label, disabled, checked)
+ {
+ super();
</ins><span class="cx">
</span><del>-WebInspector.ContextMenuItem.prototype = {
- id: function()
</del><ins>+ this._type = type;
+ this._label = label;
+ this._disabled = disabled;
+ this._checked = checked;
+ this._contextMenu = topLevelMenu || this;
+
+ if (type === "item" || type === "checkbox")
+ this._id = topLevelMenu.nextId();
+ }
+
+ // Public
+
+ id()
</ins><span class="cx"> {
</span><span class="cx"> return this._id;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- type: function()
</del><ins>+ type()
</ins><span class="cx"> {
</span><span class="cx"> return this._type;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- isEnabled: function()
</del><ins>+ isEnabled()
</ins><span class="cx"> {
</span><span class="cx"> return !this._disabled;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- setEnabled: function(enabled)
</del><ins>+ setEnabled(enabled)
</ins><span class="cx"> {
</span><span class="cx"> this._disabled = !enabled;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _buildDescriptor: function()
</del><ins>+ // Private
+
+ _buildDescriptor()
</ins><span class="cx"> {
</span><span class="cx"> switch (this._type) {
</span><span class="cx"> case "item":
</span><span class="lines">@@ -74,91 +82,110 @@
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.ContextSubMenuItem = function(topLevelMenu, label, disabled)
</del><ins>+WebInspector.ContextSubMenuItem = class ContextSubMenuItem extends WebInspector.ContextMenuItem
</ins><span class="cx"> {
</span><del>- WebInspector.ContextMenuItem.call(this, topLevelMenu, "subMenu", label, disabled);
- this._items = [];
-};
</del><ins>+ constructor(topLevelMenu, label, disabled)
+ {
+ super(topLevelMenu, "subMenu", label, disabled);
</ins><span class="cx">
</span><del>-WebInspector.ContextSubMenuItem.prototype = {
- appendItem: function(label, handler, disabled)
</del><ins>+ this._items = [];
+ }
+
+ // Public
+
+ appendItem(label, handler, disabled)
</ins><span class="cx"> {
</span><span class="cx"> var item = new WebInspector.ContextMenuItem(this._contextMenu, "item", label, disabled);
</span><span class="cx"> this._pushItem(item);
</span><span class="cx"> this._contextMenu._setHandler(item.id(), handler);
</span><span class="cx"> return item;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- appendSubMenuItem: function(label, disabled)
</del><ins>+ appendSubMenuItem(label, disabled)
</ins><span class="cx"> {
</span><span class="cx"> var item = new WebInspector.ContextSubMenuItem(this._contextMenu, label, disabled);
</span><span class="cx"> this._pushItem(item);
</span><span class="cx"> return item;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- appendCheckboxItem: function(label, handler, checked, disabled)
</del><ins>+ appendCheckboxItem(label, handler, checked, disabled)
</ins><span class="cx"> {
</span><span class="cx"> var item = new WebInspector.ContextMenuItem(this._contextMenu, "checkbox", label, disabled, checked);
</span><span class="cx"> this._pushItem(item);
</span><span class="cx"> this._contextMenu._setHandler(item.id(), handler);
</span><span class="cx"> return item;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- appendSeparator: function()
</del><ins>+ appendSeparator()
</ins><span class="cx"> {
</span><span class="cx"> if (this._items.length)
</span><span class="cx"> this._pendingSeparator = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _pushItem: function(item)
</del><ins>+ _pushItem(item)
</ins><span class="cx"> {
</span><span class="cx"> if (this._pendingSeparator) {
</span><span class="cx"> this._items.push(new WebInspector.ContextMenuItem(this._contextMenu, "separator"));
</span><span class="cx"> delete this._pendingSeparator;
</span><span class="cx"> }
</span><span class="cx"> this._items.push(item);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- isEmpty: function()
</del><ins>+ isEmpty()
</ins><span class="cx"> {
</span><span class="cx"> return !this._items.length;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _buildDescriptor: function()
</del><ins>+ _buildDescriptor()
</ins><span class="cx"> {
</span><span class="cx"> var result = { type: "subMenu", label: this._label, enabled: !this._disabled, subItems: [] };
</span><span class="cx"> for (var i = 0; i < this._items.length; ++i)
</span><span class="cx"> result.subItems.push(this._items[i]._buildDescriptor());
</span><span class="cx"> return result;
</span><del>- },
-
- __proto__: WebInspector.ContextMenuItem.prototype
</del><ins>+ }
</ins><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.ContextMenu = function(event) {
- WebInspector.ContextSubMenuItem.call(this, this, "");
- this._event = event;
- this._handlers = {};
- this._id = 0;
-};
</del><ins>+WebInspector.ContextMenu = class ContextMenu extends WebInspector.ContextSubMenuItem
+{
+ constructor(event)
+ {
+ super(null, "");
</ins><span class="cx">
</span><del>-WebInspector.ContextMenu.prototype = {
</del><ins>+ this._event = event;
+ this._handlers = {};
+ this._id = 0;
+ }
</ins><span class="cx">
</span><ins>+ // Static
+
+ static contextMenuItemSelected(id)
+ {
+ if (WebInspector.ContextMenu._lastContextMenu)
+ WebInspector.ContextMenu._lastContextMenu._itemSelected(id);
+ }
+
+ static contextMenuCleared()
+ {
+ // FIXME: Unfortunately, contextMenuCleared is invoked between show and item selected
+ // so we can't delete last menu object from WebInspector. Fix the contract.
+ }
+
</ins><span class="cx"> // Public
</span><span class="cx">
</span><del>- nextId: function()
</del><ins>+ nextId()
</ins><span class="cx"> {
</span><span class="cx"> return this._id++;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- show: function()
</del><ins>+ show()
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this._event instanceof MouseEvent);
</span><span class="cx">
</span><span class="cx"> var menuObject = this._buildDescriptor();
</span><span class="cx">
</span><span class="cx"> if (menuObject.length) {
</span><del>- WebInspector._contextMenu = this;
</del><ins>+ WebInspector.ContextMenu._lastContextMenu = this;
+
</ins><span class="cx"> if (this._event.type !== "contextmenu" && typeof InspectorFrontendHost.dispatchEventAsContextMenuEvent === "function") {
</span><span class="cx"> this._menuObject = menuObject;
</span><span class="cx"> this._event.target.addEventListener("contextmenu", this, true);
</span><span class="lines">@@ -166,79 +193,41 @@
</span><span class="cx"> } else
</span><span class="cx"> InspectorFrontendHost.showContextMenu(this._event, menuObject);
</span><span class="cx"> }
</span><ins>+
</ins><span class="cx"> if (this._event)
</span><span class="cx"> this._event.stopImmediatePropagation();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> this._event.target.removeEventListener("contextmenu", this, true);
</span><span class="cx"> InspectorFrontendHost.showContextMenu(event, this._menuObject);
</span><span class="cx"> delete this._menuObject;
</span><span class="cx">
</span><span class="cx"> event.stopImmediatePropagation();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _setHandler: function(id, handler)
</del><ins>+ _setHandler(id, handler)
</ins><span class="cx"> {
</span><span class="cx"> if (handler)
</span><span class="cx"> this._handlers[id] = handler;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _buildDescriptor: function()
</del><ins>+ _buildDescriptor()
</ins><span class="cx"> {
</span><span class="cx"> var result = [];
</span><span class="cx"> for (var i = 0; i < this._items.length; ++i)
</span><span class="cx"> result.push(this._items[i]._buildDescriptor());
</span><span class="cx"> return result;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _itemSelected: function(id)
</del><ins>+ _itemSelected(id)
</ins><span class="cx"> {
</span><span class="cx"> if (this._handlers[id])
</span><span class="cx"> this._handlers[id].call(this);
</span><del>- },
-
- appendApplicableItems: function(target)
- {
- for (var i = 0; i < WebInspector.ContextMenu._providers.length; ++i) {
- var provider = WebInspector.ContextMenu._providers[i];
- this.appendSeparator();
- provider.appendApplicableItems(this._event, this, target);
- this.appendSeparator();
- }
- },
-
- __proto__: WebInspector.ContextSubMenuItem.prototype
</del><ins>+ }
</ins><span class="cx"> };
</span><del>-
-WebInspector.ContextMenu.Provider = function()
-{
-};
-
-WebInspector.ContextMenu.Provider.prototype = {
- appendApplicableItems: function(event, contextMenu, target) { }
-};
-
-WebInspector.ContextMenu.registerProvider = function(provider)
-{
- WebInspector.ContextMenu._providers.push(provider);
-};
-
-WebInspector.ContextMenu._providers = [];
-
-WebInspector.contextMenuItemSelected = function(id)
-{
- if (WebInspector._contextMenu)
- WebInspector._contextMenu._itemSelected(id);
-};
-
-WebInspector.contextMenuCleared = function()
-{
- // FIXME: Unfortunately, contextMenuCleared is invoked between show and item selected
- // so we can't delete last menu object from WebInspector. Fix the contract.
-};
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDOMTreeElementPathComponentjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElementPathComponent.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElementPathComponent.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElementPathComponent.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,95 +23,87 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DOMTreeElementPathComponent = function(domTreeElement, representedObject) {
- var node = domTreeElement.representedObject;
</del><ins>+WebInspector.DOMTreeElementPathComponent = class DOMTreeElementPathComponent extends WebInspector.HierarchicalPathComponent
+{
+ constructor(domTreeElement, representedObject)
+ {
+ var node = domTreeElement.representedObject;
</ins><span class="cx">
</span><del>- var title = null;
- var className = null;
</del><ins>+ var title = null;
+ var className = null;
</ins><span class="cx">
</span><del>- switch (node.nodeType()) {
- case Node.ELEMENT_NODE:
- className = WebInspector.DOMTreeElementPathComponent.DOMElementIconStyleClassName;
- title = WebInspector.displayNameForNode(node);
- break;
</del><ins>+ switch (node.nodeType()) {
+ case Node.ELEMENT_NODE:
+ className = WebInspector.DOMTreeElementPathComponent.DOMElementIconStyleClassName;
+ title = WebInspector.displayNameForNode(node);
+ break;
</ins><span class="cx">
</span><del>- case Node.TEXT_NODE:
- className = WebInspector.DOMTreeElementPathComponent.DOMTextNodeIconStyleClassName;
- title = "\"" + node.nodeValue().trimEnd(32) + "\"";
- break;
</del><ins>+ case Node.TEXT_NODE:
+ className = WebInspector.DOMTreeElementPathComponent.DOMTextNodeIconStyleClassName;
+ title = "\"" + node.nodeValue().trimEnd(32) + "\"";
+ break;
</ins><span class="cx">
</span><del>- case Node.COMMENT_NODE:
- className = WebInspector.DOMTreeElementPathComponent.DOMCommentIconStyleClassName;
- title = "<!--" + node.nodeValue().trimEnd(32) + "-->";
- break;
</del><ins>+ case Node.COMMENT_NODE:
+ className = WebInspector.DOMTreeElementPathComponent.DOMCommentIconStyleClassName;
+ title = "<!--" + node.nodeValue().trimEnd(32) + "-->";
+ break;
</ins><span class="cx">
</span><del>- case Node.DOCUMENT_TYPE_NODE:
- className = WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName;
- title = "<!DOCTYPE>";
- break;
</del><ins>+ case Node.DOCUMENT_TYPE_NODE:
+ className = WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName;
+ title = "<!DOCTYPE>";
+ break;
</ins><span class="cx">
</span><del>- case Node.DOCUMENT_NODE:
- className = WebInspector.DOMTreeElementPathComponent.DOMDocumentIconStyleClassName;
- title = node.nodeNameInCorrectCase();
- break;
</del><ins>+ case Node.DOCUMENT_NODE:
+ className = WebInspector.DOMTreeElementPathComponent.DOMDocumentIconStyleClassName;
+ title = node.nodeNameInCorrectCase();
+ break;
</ins><span class="cx">
</span><del>- case Node.CDATA_SECTION_NODE:
- className = WebInspector.DOMTreeElementPathComponent.DOMCharacterDataIconStyleClassName;
- title = "<![CDATA[" + node.trimEnd(32) + "]]>";
- break;
</del><ins>+ case Node.CDATA_SECTION_NODE:
+ className = WebInspector.DOMTreeElementPathComponent.DOMCharacterDataIconStyleClassName;
+ title = "<![CDATA[" + node.trimEnd(32) + "]]>";
+ break;
</ins><span class="cx">
</span><del>- case Node.DOCUMENT_FRAGMENT_NODE:
- // FIXME: At some point we might want a different icon for this.
- // <rdar://problem/12800950> Need icon for DOCUMENT_FRAGMENT_NODE and PROCESSING_INSTRUCTION_NODE
- className = WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName;
- if (node.isInShadowTree())
- title = WebInspector.UIString("Shadow Content");
- else
- title = WebInspector.displayNameForNode(node);
- break;
</del><ins>+ case Node.DOCUMENT_FRAGMENT_NODE:
+ // FIXME: At some point we might want a different icon for this.
+ // <rdar://problem/12800950> Need icon for DOCUMENT_FRAGMENT_NODE and PROCESSING_INSTRUCTION_NODE
+ className = WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName;
+ if (node.isInShadowTree())
+ title = WebInspector.UIString("Shadow Content");
+ else
+ title = WebInspector.displayNameForNode(node);
+ break;
</ins><span class="cx">
</span><del>- case Node.PROCESSING_INSTRUCTION_NODE:
- // FIXME: At some point we might want a different icon for this.
- // <rdar://problem/12800950> Need icon for DOCUMENT_FRAGMENT_NODE and PROCESSING_INSTRUCTION_NODE.
- className = WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName;
- title = node.nodeNameInCorrectCase();
- break;
</del><ins>+ case Node.PROCESSING_INSTRUCTION_NODE:
+ // FIXME: At some point we might want a different icon for this.
+ // <rdar://problem/12800950> Need icon for DOCUMENT_FRAGMENT_NODE and PROCESSING_INSTRUCTION_NODE.
+ className = WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName;
+ title = node.nodeNameInCorrectCase();
+ break;
</ins><span class="cx">
</span><del>- default:
- console.error("Unknown DOM node type: ", node.nodeType());
- className = WebInspector.DOMTreeElementPathComponent.DOMNodeIconStyleClassName;
- title = node.nodeNameInCorrectCase();
- }
</del><ins>+ default:
+ console.error("Unknown DOM node type: ", node.nodeType());
+ className = WebInspector.DOMTreeElementPathComponent.DOMNodeIconStyleClassName;
+ title = node.nodeNameInCorrectCase();
+ }
</ins><span class="cx">
</span><del>- WebInspector.HierarchicalPathComponent.call(this, title, className, representedObject || domTreeElement.representedObject);
</del><ins>+ super(title, className, representedObject || domTreeElement.representedObject);
</ins><span class="cx">
</span><del>- this._domTreeElement = domTreeElement;
-};
</del><ins>+ this._domTreeElement = domTreeElement;
+ }
</ins><span class="cx">
</span><del>-WebInspector.DOMTreeElementPathComponent.DOMElementIconStyleClassName = "dom-element-icon";
-WebInspector.DOMTreeElementPathComponent.DOMTextNodeIconStyleClassName = "dom-text-node-icon";
-WebInspector.DOMTreeElementPathComponent.DOMCommentIconStyleClassName = "dom-comment-icon";
-WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName = "dom-document-type-icon";
-WebInspector.DOMTreeElementPathComponent.DOMDocumentIconStyleClassName = "dom-document-icon";
-WebInspector.DOMTreeElementPathComponent.DOMCharacterDataIconStyleClassName = "dom-character-data-icon";
-WebInspector.DOMTreeElementPathComponent.DOMNodeIconStyleClassName = "dom-node-icon";
-
-WebInspector.DOMTreeElementPathComponent.prototype = {
- constructor: WebInspector.DOMTreeElementPathComponent,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get domTreeElement()
</span><span class="cx"> {
</span><span class="cx"> return this._domTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get previousSibling()
</span><span class="cx"> {
</span><span class="cx"> if (!this._domTreeElement.previousSibling)
</span><span class="cx"> return null;
</span><span class="cx"> return new WebInspector.DOMTreeElementPathComponent(this._domTreeElement.previousSibling);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get nextSibling()
</span><span class="cx"> {
</span><span class="lines">@@ -120,20 +112,26 @@
</span><span class="cx"> if (this._domTreeElement.nextSibling.isCloseTag())
</span><span class="cx"> return null;
</span><span class="cx"> return new WebInspector.DOMTreeElementPathComponent(this._domTreeElement.nextSibling);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- mouseOver: function()
</del><ins>+ mouseOver()
</ins><span class="cx"> {
</span><span class="cx"> var nodeId = this._domTreeElement.representedObject.id;
</span><span class="cx"> WebInspector.domTreeManager.highlightDOMNode(nodeId);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- mouseOut: function()
</del><ins>+ mouseOut()
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.domTreeManager.hideDOMNodeHighlight();
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.DOMTreeElementPathComponent.prototype.__proto__ = WebInspector.HierarchicalPathComponent.prototype;
</del><ins>+WebInspector.DOMTreeElementPathComponent.DOMElementIconStyleClassName = "dom-element-icon";
+WebInspector.DOMTreeElementPathComponent.DOMTextNodeIconStyleClassName = "dom-text-node-icon";
+WebInspector.DOMTreeElementPathComponent.DOMCommentIconStyleClassName = "dom-comment-icon";
+WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName = "dom-document-type-icon";
+WebInspector.DOMTreeElementPathComponent.DOMDocumentIconStyleClassName = "dom-document-icon";
+WebInspector.DOMTreeElementPathComponent.DOMCharacterDataIconStyleClassName = "dom-character-data-icon";
+WebInspector.DOMTreeElementPathComponent.DOMNodeIconStyleClassName = "dom-node-icon";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,85 +23,73 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSection = function(identifier, title, groups, optionsElement, defaultCollapsedSettingValue) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.DetailsSection = class DetailsSection extends WebInspector.Object
+{
+ constructor(identifier, title, groups, optionsElement, defaultCollapsedSettingValue)
+ {
+ super();
</ins><span class="cx">
</span><del>- console.assert(identifier);
</del><ins>+ console.assert(identifier);
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = WebInspector.DetailsSection.StyleClassName;
- this._element.classList.add(identifier);
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = WebInspector.DetailsSection.StyleClassName;
+ this._element.classList.add(identifier);
</ins><span class="cx">
</span><del>- this._headerElement = document.createElement("div");
- this._headerElement.addEventListener("click", this._headerElementClicked.bind(this));
- this._headerElement.className = WebInspector.DetailsSection.HeaderElementStyleClassName;
- this._element.appendChild(this._headerElement);
</del><ins>+ this._headerElement = document.createElement("div");
+ this._headerElement.addEventListener("click", this._headerElementClicked.bind(this));
+ this._headerElement.className = WebInspector.DetailsSection.HeaderElementStyleClassName;
+ this._element.appendChild(this._headerElement);
</ins><span class="cx">
</span><del>- if (optionsElement instanceof HTMLElement) {
- this._optionsElement = optionsElement;
- this._optionsElement.addEventListener("mousedown", this._optionsElementMouseDown.bind(this));
- this._optionsElement.addEventListener("mouseup", this._optionsElementMouseUp.bind(this));
- this._headerElement.appendChild(this._optionsElement);
- }
</del><ins>+ if (optionsElement instanceof HTMLElement) {
+ this._optionsElement = optionsElement;
+ this._optionsElement.addEventListener("mousedown", this._optionsElementMouseDown.bind(this));
+ this._optionsElement.addEventListener("mouseup", this._optionsElementMouseUp.bind(this));
+ this._headerElement.appendChild(this._optionsElement);
+ }
</ins><span class="cx">
</span><del>- this._titleElement = document.createElement("span");
- this._headerElement.appendChild(this._titleElement);
</del><ins>+ this._titleElement = document.createElement("span");
+ this._headerElement.appendChild(this._titleElement);
</ins><span class="cx">
</span><del>- this._contentElement = document.createElement("div");
- this._contentElement.className = WebInspector.DetailsSection.ContentElementStyleClassName;
- this._element.appendChild(this._contentElement);
</del><ins>+ this._contentElement = document.createElement("div");
+ this._contentElement.className = WebInspector.DetailsSection.ContentElementStyleClassName;
+ this._element.appendChild(this._contentElement);
</ins><span class="cx">
</span><del>- this._generateDisclosureTrianglesIfNeeded();
</del><ins>+ this._generateDisclosureTrianglesIfNeeded();
</ins><span class="cx">
</span><del>- this._identifier = identifier;
- this.title = title;
- this.groups = groups || [new WebInspector.DetailsSectionGroup];
</del><ins>+ this._identifier = identifier;
+ this.title = title;
+ this.groups = groups || [new WebInspector.DetailsSectionGroup];
</ins><span class="cx">
</span><del>- this._collapsedSetting = new WebInspector.Setting(identifier + "-details-section-collapsed", !!defaultCollapsedSettingValue);
- this.collapsed = this._collapsedSetting.value;
-};
</del><ins>+ this._collapsedSetting = new WebInspector.Setting(identifier + "-details-section-collapsed", !!defaultCollapsedSettingValue);
+ this.collapsed = this._collapsedSetting.value;
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSection.StyleClassName = "details-section";
-WebInspector.DetailsSection.HeaderElementStyleClassName = "header";
-WebInspector.DetailsSection.TitleElementStyleClassName = "title";
-WebInspector.DetailsSection.ContentElementStyleClassName = "content";
-WebInspector.DetailsSection.CollapsedStyleClassName = "collapsed";
-WebInspector.DetailsSection.MouseOverOptionsElementStyleClassName = "mouse-over-options-element";
-WebInspector.DetailsSection.DisclosureTriangleOpenCanvasIdentifier = "details-section-disclosure-triangle-open";
-WebInspector.DetailsSection.DisclosureTriangleClosedCanvasIdentifier = "details-section-disclosure-triangle-closed";
-WebInspector.DetailsSection.DisclosureTriangleNormalCanvasIdentifierSuffix = "-normal";
-WebInspector.DetailsSection.DisclosureTriangleActiveCanvasIdentifierSuffix = "-active";
-
-WebInspector.DetailsSection.prototype = {
- constructor: WebInspector.DetailsSection,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get identifier()
</span><span class="cx"> {
</span><span class="cx"> return this._identifier;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get title()
</span><span class="cx"> {
</span><span class="cx"> return this._titleElement.textContent;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set title(title)
</span><span class="cx"> {
</span><span class="cx"> this._titleElement.textContent = title;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get collapsed()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.DetailsSection.CollapsedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set collapsed(flag)
</span><span class="cx"> {
</span><span class="lines">@@ -111,12 +99,12 @@
</span><span class="cx"> this._element.classList.remove(WebInspector.DetailsSection.CollapsedStyleClassName);
</span><span class="cx">
</span><span class="cx"> this._collapsedSetting.value = flag || false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get groups()
</span><span class="cx"> {
</span><span class="cx"> return this._groups;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set groups(groups)
</span><span class="cx"> {
</span><span class="lines">@@ -126,11 +114,11 @@
</span><span class="cx">
</span><span class="cx"> for (var i = 0; i < this._groups.length; ++i)
</span><span class="cx"> this._contentElement.appendChild(this._groups[i].element);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _headerElementClicked: function(event)
</del><ins>+ _headerElementClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.target.isSelfOrDescendant(this._optionsElement))
</span><span class="cx"> return;
</span><span class="lines">@@ -138,19 +126,19 @@
</span><span class="cx"> this.collapsed = !this.collapsed;
</span><span class="cx">
</span><span class="cx"> this._element.scrollIntoViewIfNeeded(false);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _optionsElementMouseDown: function(event)
</del><ins>+ _optionsElementMouseDown(event)
</ins><span class="cx"> {
</span><span class="cx"> this._headerElement.classList.add(WebInspector.DetailsSection.MouseOverOptionsElementStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _optionsElementMouseUp: function(event)
</del><ins>+ _optionsElementMouseUp(event)
</ins><span class="cx"> {
</span><span class="cx"> this._headerElement.classList.remove(WebInspector.DetailsSection.MouseOverOptionsElementStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _generateDisclosureTrianglesIfNeeded: function()
</del><ins>+ _generateDisclosureTrianglesIfNeeded()
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.DetailsSection._generatedDisclosureTriangles)
</span><span class="cx"> return;
</span><span class="lines">@@ -173,4 +161,13 @@
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.DetailsSection.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.DetailsSection.StyleClassName = "details-section";
+WebInspector.DetailsSection.HeaderElementStyleClassName = "header";
+WebInspector.DetailsSection.TitleElementStyleClassName = "title";
+WebInspector.DetailsSection.ContentElementStyleClassName = "content";
+WebInspector.DetailsSection.CollapsedStyleClassName = "collapsed";
+WebInspector.DetailsSection.MouseOverOptionsElementStyleClassName = "mouse-over-options-element";
+WebInspector.DetailsSection.DisclosureTriangleOpenCanvasIdentifier = "details-section-disclosure-triangle-open";
+WebInspector.DetailsSection.DisclosureTriangleClosedCanvasIdentifier = "details-section-disclosure-triangle-closed";
+WebInspector.DetailsSection.DisclosureTriangleNormalCanvasIdentifierSuffix = "-normal";
+WebInspector.DetailsSection.DisclosureTriangleActiveCanvasIdentifierSuffix = "-active";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionDataGridRowjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionDataGridRow.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionDataGridRow.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionDataGridRow.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,25 +23,23 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionDataGridRow = function(dataGrid, emptyMessage) {
- WebInspector.DetailsSectionRow.call(this, emptyMessage);
</del><ins>+WebInspector.DetailsSectionDataGridRow = class DetailsSectionDataGridRow extends WebInspector.DetailsSectionRow
+{
+ constructor(dataGrid, emptyMessage)
+ {
+ super(emptyMessage);
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.DetailsSectionDataGridRow.StyleClassName);
</del><ins>+ this.element.classList.add("data-grid");
</ins><span class="cx">
</span><del>- this.dataGrid = dataGrid;
-};
</del><ins>+ this.dataGrid = dataGrid;
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSectionDataGridRow.StyleClassName = "data-grid";
-
-WebInspector.DetailsSectionDataGridRow.prototype = {
- constructor: WebInspector.DetailsSectionDataGridRow,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get dataGrid()
</span><span class="cx"> {
</span><span class="cx"> return this._dataGrid;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set dataGrid(dataGrid)
</span><span class="cx"> {
</span><span class="lines">@@ -59,5 +57,3 @@
</span><span class="cx"> this.showEmptyMessage();
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.DetailsSectionDataGridRow.prototype.__proto__ = WebInspector.DetailsSectionRow.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionGroupjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionGroup.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionGroup.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionGroup.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,32 +23,29 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionGroup = function(rows) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.DetailsSectionGroup = class DetailsSectionGroup extends WebInspector.Object
+{
+ constructor(rows)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = WebInspector.DetailsSectionGroup.StyleClassName;
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "group";
</ins><span class="cx">
</span><del>- this.rows = rows;
-};
</del><ins>+ this.rows = rows || [];
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSectionGroup.StyleClassName = "group";
-
-WebInspector.DetailsSectionGroup.prototype = {
- constructor: WebInspector.DetailsSectionGroup,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get rows()
</span><span class="cx"> {
</span><span class="cx"> return this._rows;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set rows(rows)
</span><span class="cx"> {
</span><span class="lines">@@ -60,5 +57,3 @@
</span><span class="cx"> this._element.appendChild(this._rows[i].element);
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.DetailsSectionGroup.prototype.__proto__ = WebInspector.Object.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionPropertiesRowjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionPropertiesRow.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionPropertiesRow.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionPropertiesRow.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,26 +23,24 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionPropertiesRow = function(propertiesSection, emptyMessage) {
- WebInspector.DetailsSectionRow.call(this, emptyMessage);
</del><ins>+WebInspector.DetailsSectionPropertiesRow = class DetailsSectionPropertiesRow extends WebInspector.DetailsSectionRow
+{
+ constructor(propertiesSection, emptyMessage)
+ {
+ super(emptyMessage);
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.DetailsSectionPropertiesRow.StyleClassName);
- this.element.classList.add(WebInspector.SyntaxHighlightedStyleClassName);
</del><ins>+ this.element.classList.add("properties");
+ this.element.classList.add(WebInspector.SyntaxHighlightedStyleClassName);
</ins><span class="cx">
</span><del>- this.propertiesSection = propertiesSection;
-};
</del><ins>+ this.propertiesSection = propertiesSection;
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSectionPropertiesRow.StyleClassName = "properties";
-
-WebInspector.DetailsSectionPropertiesRow.prototype = {
- constructor: WebInspector.DetailsSectionPropertiesRow,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get propertiesSection()
</span><span class="cx"> {
</span><span class="cx"> return this._propertiesSection;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set propertiesSection(propertiesSection)
</span><span class="cx"> {
</span><span class="lines">@@ -58,5 +56,3 @@
</span><span class="cx"> this.showEmptyMessage();
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.DetailsSectionPropertiesRow.prototype.__proto__ = WebInspector.DetailsSectionRow.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionRowjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionRow.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionRow.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionRow.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -23,33 +23,29 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionRow = function(emptyMessage) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.DetailsSectionRow = class DetailsSectionRow extends WebInspector.Object
+{
+ constructor(emptyMessage)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = WebInspector.DetailsSectionRow.StyleClassName;
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "row";
</ins><span class="cx">
</span><del>- this._emptyMessage = emptyMessage || "";
-};
</del><ins>+ this._emptyMessage = emptyMessage || "";
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSectionRow.StyleClassName = "row";
-WebInspector.DetailsSectionRow.EmptyStyleClassName = "empty";
-
-WebInspector.DetailsSectionRow.prototype = {
- constructor: WebInspector.DetailsSectionRow,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get emptyMessage()
</span><span class="cx"> {
</span><span class="cx"> return this._emptyMessage;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set emptyMessage(emptyMessage)
</span><span class="cx"> {
</span><span class="lines">@@ -57,9 +53,9 @@
</span><span class="cx">
</span><span class="cx"> if (!this._element.childNodes.length)
</span><span class="cx"> this.showEmptyMessage();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- showEmptyMessage: function()
</del><ins>+ showEmptyMessage()
</ins><span class="cx"> {
</span><span class="cx"> this.element.classList.add(WebInspector.DetailsSectionRow.EmptyStyleClassName);
</span><span class="cx">
</span><span class="lines">@@ -68,13 +64,13 @@
</span><span class="cx"> this.element.appendChild(this._emptyMessage);
</span><span class="cx"> } else
</span><span class="cx"> this.element.textContent = this._emptyMessage;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hideEmptyMessage: function()
</del><ins>+ hideEmptyMessage()
</ins><span class="cx"> {
</span><span class="cx"> this.element.classList.remove(WebInspector.DetailsSectionRow.EmptyStyleClassName);
</span><span class="cx"> this.element.removeChildren();
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionRow.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.DetailsSectionRow.EmptyStyleClassName = "empty";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionSimpleRowjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionSimpleRow.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionSimpleRow.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionSimpleRow.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,74 +23,68 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionSimpleRow = function(label, value) {
- WebInspector.DetailsSectionRow.call(this);
</del><ins>+WebInspector.DetailsSectionSimpleRow = class DetailsSectionSimpleRow extends WebInspector.DetailsSectionRow
+{
+ constructor(label, value)
+ {
+ super();
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.DetailsSectionSimpleRow.StyleClassName);
</del><ins>+ this.element.classList.add("simple");
</ins><span class="cx">
</span><del>- this._labelElement = document.createElement("div");
- this._labelElement.className = WebInspector.DetailsSectionSimpleRow.LabelElementStyleClassName;
- this.element.appendChild(this._labelElement);
</del><ins>+ this._labelElement = document.createElement("div");
+ this._labelElement.className = WebInspector.DetailsSectionSimpleRow.LabelElementStyleClassName;
+ this.element.appendChild(this._labelElement);
</ins><span class="cx">
</span><del>- this._valueElement = document.createElement("div");
- this._valueElement.className = WebInspector.DetailsSectionSimpleRow.ValueElementStyleClassName;
- this.element.appendChild(this._valueElement);
</del><ins>+ this._valueElement = document.createElement("div");
+ this._valueElement.className = WebInspector.DetailsSectionSimpleRow.ValueElementStyleClassName;
+ this.element.appendChild(this._valueElement);
</ins><span class="cx">
</span><del>- // Workaround for <rdar://problem/12668870> Triple-clicking text within a
- // <div> set to "display: table-cell" selects text outside the cell.
- //
- // On triple-click, adjust the selection range to include only the value
- // element if the selection extends beyond it.
- var valueElementClicked = function(event) {
- event.stopPropagation();
</del><ins>+ // Workaround for <rdar://problem/12668870> Triple-clicking text within a
+ // <div> set to "display: table-cell" selects text outside the cell.
+ //
+ // On triple-click, adjust the selection range to include only the value
+ // element if the selection extends WebInspector.beyond it.
+ var valueElementClicked = function(event) {
+ event.stopPropagation();
</ins><span class="cx">
</span><del>- if (event.detail < 3)
- return;
</del><ins>+ if (event.detail < 3)
+ return;
</ins><span class="cx">
</span><del>- var currentSelection = window.getSelection();
- if (!currentSelection)
- return;
</del><ins>+ var currentSelection = window.getSelection();
+ if (!currentSelection)
+ return;
</ins><span class="cx">
</span><del>- var currentRange = currentSelection.getRangeAt(0);
- if (!currentRange || currentRange.startContainer === currentRange.endContainer)
- return;
</del><ins>+ var currentRange = currentSelection.getRangeAt(0);
+ if (!currentRange || currentRange.startContainer === currentRange.endContainer)
+ return;
</ins><span class="cx">
</span><del>- var correctedRange = document.createRange();
- correctedRange.selectNodeContents(event.currentTarget);
- currentSelection.removeAllRanges();
- currentSelection.addRange(correctedRange);
- };
- this._valueElement.addEventListener("click", valueElementClicked);
</del><ins>+ var correctedRange = document.createRange();
+ correctedRange.selectNodeContents(event.currentTarget);
+ currentSelection.removeAllRanges();
+ currentSelection.addRange(correctedRange);
+ };
+ this._valueElement.addEventListener("click", valueElementClicked);
</ins><span class="cx">
</span><del>- this.label = label;
- this.value = value;
-};
</del><ins>+ this.label = label;
+ this.value = value;
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSectionSimpleRow.StyleClassName = "simple";
-WebInspector.DetailsSectionSimpleRow.DataStyleClassName = "data";
-WebInspector.DetailsSectionSimpleRow.EmptyStyleClassName = "empty";
-WebInspector.DetailsSectionSimpleRow.LabelElementStyleClassName = "label";
-WebInspector.DetailsSectionSimpleRow.ValueElementStyleClassName = "value";
-
-WebInspector.DetailsSectionSimpleRow.prototype = {
- constructor: WebInspector.DetailsSectionSimpleRow,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get label()
</span><span class="cx"> {
</span><span class="cx"> return this._labelElement.textContent;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set label(label)
</span><span class="cx"> {
</span><span class="cx"> this._labelElement.textContent = label;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get value()
</span><span class="cx"> {
</span><span class="cx"> return this._value;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set value(value)
</span><span class="cx"> {
</span><span class="lines">@@ -117,4 +111,7 @@
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionSimpleRow.prototype.__proto__ = WebInspector.DetailsSectionRow.prototype;
</del><ins>+WebInspector.DetailsSectionSimpleRow.DataStyleClassName = "data";
+WebInspector.DetailsSectionSimpleRow.EmptyStyleClassName = "empty";
+WebInspector.DetailsSectionSimpleRow.LabelElementStyleClassName = "label";
+WebInspector.DetailsSectionSimpleRow.ValueElementStyleClassName = "value";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsDetailsSectionTextRowjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionTextRow.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionTextRow.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSectionTextRow.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,27 +23,23 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.DetailsSectionTextRow = function(text)
</del><ins>+WebInspector.DetailsSectionTextRow = class DetailsSectionTextRow extends WebInspector.DetailsSectionRow
</ins><span class="cx"> {
</span><del>- WebInspector.DetailsSectionRow.call(this);
</del><ins>+ constructor(text)
+ {
+ super();
</ins><span class="cx">
</span><del>- this.element.classList.add(WebInspector.DetailsSectionTextRow.StyleClassName);
</del><ins>+ this.element.classList.add("text");
</ins><span class="cx">
</span><del>- this.element.textContent = text;
-};
</del><ins>+ this.element.textContent = text;
+ }
</ins><span class="cx">
</span><del>-WebInspector.DetailsSectionTextRow.StyleClassName = "text";
-
-WebInspector.DetailsSectionTextRow.prototype = {
- constructor: WebInspector.DetailsSectionTextRow,
- __proto__: WebInspector.DetailsSectionRow.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get text()
</span><span class="cx"> {
</span><span class="cx"> return this.element.textContent;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set text(text)
</span><span class="cx"> {
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsEditingSupportjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/EditingSupport.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/EditingSupport.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/EditingSupport.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -57,7 +57,7 @@
</span><span class="cx">
</span><span class="cx"> WebInspector.isEventTargetAnEditableField = function(event)
</span><span class="cx"> {
</span><del>- const textInputTypes = {"text": true, "search": true, "tel": true, "url": true, "email": true, "password": true};
</del><ins>+ var textInputTypes = {"text": true, "search": true, "tel": true, "url": true, "email": true, "password": true};
</ins><span class="cx"> if (event.target instanceof HTMLInputElement)
</span><span class="cx"> return event.target.type in textInputTypes;
</span><span class="cx">
</span><span class="lines">@@ -74,26 +74,27 @@
</span><span class="cx"> return false;
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.EditingConfig = function(commitHandler, cancelHandler, context)
</del><ins>+WebInspector.EditingConfig = class EditingConfig
</ins><span class="cx"> {
</span><del>- this.commitHandler = commitHandler;
- this.cancelHandler = cancelHandler;
- this.context = context;
- this.spellcheck = false;
-};
</del><ins>+ constructor(commitHandler, cancelHandler, context)
+ {
+ this.commitHandler = commitHandler;
+ this.cancelHandler = cancelHandler;
+ this.context = context;
+ this.spellcheck = false;
+ }
</ins><span class="cx">
</span><del>-WebInspector.EditingConfig.prototype = {
- setPasteHandler: function(pasteHandler)
</del><ins>+ setPasteHandler(pasteHandler)
</ins><span class="cx"> {
</span><span class="cx"> this.pasteHandler = pasteHandler;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- setMultiline: function(multiline)
</del><ins>+ setMultiline(multiline)
</ins><span class="cx"> {
</span><span class="cx"> this.multiline = multiline;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- setCustomFinishHandler: function(customFinishHandler)
</del><ins>+ setCustomFinishHandler(customFinishHandler)
</ins><span class="cx"> {
</span><span class="cx"> this.customFinishHandler = customFinishHandler;
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsEventListenerSectionjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSection.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSection.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSection.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,24 +23,23 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.EventListenerSection = function(type, nodeId)
</del><ins>+WebInspector.EventListenerSection = class EventListenerSection extends WebInspector.DetailsSection
</ins><span class="cx"> {
</span><del>- WebInspector.DetailsSection.call(this, type + "-event-listener-section", type, [], null, true);
</del><ins>+ constructor(type, nodeId)
+ {
+ super(type + "-event-listener-section", type, [], null, true);
</ins><span class="cx">
</span><del>- this.element.classList.add("event-listener-section");
</del><ins>+ this.element.classList.add("event-listener-section");
</ins><span class="cx">
</span><del>- this._nodeId = nodeId;
-};
</del><ins>+ this._nodeId = nodeId;
+ }
</ins><span class="cx">
</span><del>-WebInspector.EventListenerSection.prototype = {
- constructor: WebInspector.EventListenerSection,
</del><ins>+ // Public
</ins><span class="cx">
</span><del>- addListener: function(eventListener)
</del><ins>+ addListener(eventListener)
</ins><span class="cx"> {
</span><span class="cx"> var groups = this.groups;
</span><span class="cx"> groups.push(new WebInspector.EventListenerSectionGroup(eventListener, this._nodeId));
</span><span class="cx"> this.groups = groups;
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.EventListenerSection.prototype.__proto__ = WebInspector.DetailsSection.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsEventListenerSectionGroupjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSectionGroup.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSectionGroup.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/EventListenerSectionGroup.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,23 +23,25 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.EventListenerSectionGroup = function(eventListener, nodeId)
</del><ins>+WebInspector.EventListenerSectionGroup = class EventListenerSectionGroup extends WebInspector.DetailsSectionGroup
</ins><span class="cx"> {
</span><del>- this._eventListener = eventListener;
- this._nodeId = nodeId;
</del><ins>+ constructor(eventListener, nodeId)
+ {
+ super();
</ins><span class="cx">
</span><del>- var rows = [];
- rows.push(new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Node"), this._nodeTextOrLink()));
- rows.push(new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Function"), this._functionTextOrLink()));
- rows.push(new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Type"), this._type()));
</del><ins>+ this._eventListener = eventListener;
+ this._nodeId = nodeId;
</ins><span class="cx">
</span><del>- WebInspector.DetailsSectionGroup.call(this, rows);
-};
</del><ins>+ var rows = [];
+ rows.push(new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Node"), this._nodeTextOrLink()));
+ rows.push(new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Function"), this._functionTextOrLink()));
+ rows.push(new WebInspector.DetailsSectionSimpleRow(WebInspector.UIString("Type"), this._type()));
+ this.rows = rows;
+ }
</ins><span class="cx">
</span><del>-WebInspector.EventListenerSectionGroup.prototype = {
- constructor: WebInspector.EventListenerSectionGroup,
</del><ins>+ // Private
</ins><span class="cx">
</span><del>- _nodeTextOrLink: function()
</del><ins>+ _nodeTextOrLink()
</ins><span class="cx"> {
</span><span class="cx"> var node = this._eventListener.node;
</span><span class="cx"> console.assert(node);
</span><span class="lines">@@ -50,9 +52,9 @@
</span><span class="cx"> return "document";
</span><span class="cx">
</span><span class="cx"> return WebInspector.linkifyNodeReference(node);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _type: function()
</del><ins>+ _type()
</ins><span class="cx"> {
</span><span class="cx"> if (this._eventListener.useCapture)
</span><span class="cx"> return WebInspector.UIString("Capturing");
</span><span class="lines">@@ -61,9 +63,9 @@
</span><span class="cx"> return WebInspector.UIString("Attribute");
</span><span class="cx">
</span><span class="cx"> return WebInspector.UIString("Bubbling");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _functionTextOrLink: function()
</del><ins>+ _functionTextOrLink()
</ins><span class="cx"> {
</span><span class="cx"> var match = this._eventListener.handlerBody.match(/function ([^\(]+?)\(/);
</span><span class="cx"> if (match) {
</span><span class="lines">@@ -98,5 +100,3 @@
</span><span class="cx"> return fragment;
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.EventListenerSectionGroup.prototype.__proto__ = WebInspector.DetailsSectionGroup.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsFilterBarjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,65 +23,54 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.FilterBar = function(element) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.FilterBar = class FilterBar extends WebInspector.Object
+{
+ constructor(element)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._element = element || document.createElement("div");
- this._element.classList.add(WebInspector.FilterBar.StyleClassName);
</del><ins>+ this._element = element || document.createElement("div");
+ this._element.classList.add("filter-bar");
</ins><span class="cx">
</span><del>- this._filtersNavigationBar = new WebInspector.NavigationBar;
- this._element.appendChild(this._filtersNavigationBar.element);
</del><ins>+ this._filtersNavigationBar = new WebInspector.NavigationBar;
+ this._element.appendChild(this._filtersNavigationBar.element);
</ins><span class="cx">
</span><del>- this._filterFunctionsMap = new Map;
</del><ins>+ this._filterFunctionsMap = new Map;
</ins><span class="cx">
</span><del>- this._inputField = document.createElement("input");
- this._inputField.type = "search";
- this._inputField.spellcheck = false;
- this._inputField.incremental = true;
- this._inputField.addEventListener("search", this._handleFilterChanged.bind(this), false);
- this._element.appendChild(this._inputField);
-};
</del><ins>+ this._inputField = document.createElement("input");
+ this._inputField.type = "search";
+ this._inputField.spellcheck = false;
+ this._inputField.incremental = true;
+ this._inputField.addEventListener("search", this._handleFilterChanged.bind(this), false);
+ this._element.appendChild(this._inputField);
+ }
</ins><span class="cx">
</span><del>-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.FilterBar);
-
-WebInspector.FilterBar.StyleClassName = "filter-bar";
-
-WebInspector.FilterBar.Event = {
- FilterDidChange: "filter-bar-text-filter-did-change"
-};
-
-WebInspector.FilterBar.prototype = {
- constructor: WebInspector.FilterBar,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get placeholder()
</span><span class="cx"> {
</span><span class="cx"> return this._inputField.getAttribute("placeholder");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set placeholder(text)
</span><span class="cx"> {
</span><span class="cx"> this._inputField.setAttribute("placeholder", text);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get inputField()
</span><span class="cx"> {
</span><span class="cx"> return this._inputField;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get filters()
</span><span class="cx"> {
</span><span class="cx"> return {text: this._inputField.value, functions: [...this._filterFunctionsMap.values()]};
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set filters(filters)
</span><span class="cx"> {
</span><span class="lines">@@ -91,9 +80,9 @@
</span><span class="cx"> this._inputField.value = filters.text || "";
</span><span class="cx"> if (oldTextValue !== this._inputField.value)
</span><span class="cx"> this._handleFilterChanged();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- addFilterBarButton: function(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss)
</del><ins>+ addFilterBarButton(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss)
</ins><span class="cx"> {
</span><span class="cx"> var filterBarButton = new WebInspector.FilterBarButton(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss);
</span><span class="cx"> filterBarButton.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._handleFilterBarButtonClicked, this);
</span><span class="lines">@@ -103,12 +92,12 @@
</span><span class="cx"> this._filterFunctionsMap.set(filterBarButton.identifier, filterBarButton.filterFunction);
</span><span class="cx"> this._handleFilterChanged();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hasActiveFilters: function()
</del><ins>+ hasActiveFilters()
</ins><span class="cx"> {
</span><span class="cx"> return !!this._inputField.value || !!this._filterFunctionsMap.size;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><span class="lines">@@ -116,9 +105,9 @@
</span><span class="cx"> {
</span><span class="cx"> var filterBarButton = event.target;
</span><span class="cx"> filterBarButton.toggle();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleFilterButtonToggled: function(event)
</del><ins>+ _handleFilterButtonToggled(event)
</ins><span class="cx"> {
</span><span class="cx"> var filterBarButton = event.target;
</span><span class="cx"> if (filterBarButton.activated)
</span><span class="lines">@@ -126,10 +115,14 @@
</span><span class="cx"> else
</span><span class="cx"> this._filterFunctionsMap.delete(filterBarButton.identifier);
</span><span class="cx"> this._handleFilterChanged();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleFilterChanged: function()
</del><ins>+ _handleFilterChanged()
</ins><span class="cx"> {
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.FilterBar.Event.FilterDidChange);
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.FilterBar.Event = {
+ FilterDidChange: "filter-bar-text-filter-did-change"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsFindBannerjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FindBanner.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/FindBanner.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FindBanner.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,127 +23,108 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.FindBanner = function(delegate, element) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.FindBanner = class FindBanner extends WebInspector.Object
+{
+ constructor(delegate, element)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._delegate = delegate || null;
</del><ins>+ this._delegate = delegate || null;
</ins><span class="cx">
</span><del>- this._element = element || document.createElement("div");
- this._element.classList.add(WebInspector.FindBanner.StyleClassName);
</del><ins>+ this._element = element || document.createElement("div");
+ this._element.classList.add("find-banner");
</ins><span class="cx">
</span><del>- this._resultCountLabel = document.createElement("label");
- this._element.appendChild(this._resultCountLabel);
</del><ins>+ this._resultCountLabel = document.createElement("label");
+ this._element.appendChild(this._resultCountLabel);
</ins><span class="cx">
</span><del>- this._previousResultButton = document.createElement("button");
- this._previousResultButton.classList.add(WebInspector.FindBanner.SegmentedButtonStyleClassName);
- this._previousResultButton.classList.add(WebInspector.FindBanner.LeftSegmentButtonStyleClassName);
- this._previousResultButton.disabled = true;
- this._previousResultButton.addEventListener("click", this._previousResultButtonClicked.bind(this));
- this._element.appendChild(this._previousResultButton);
</del><ins>+ this._previousResultButton = document.createElement("button");
+ this._previousResultButton.classList.add(WebInspector.FindBanner.SegmentedButtonStyleClassName);
+ this._previousResultButton.classList.add(WebInspector.FindBanner.LeftSegmentButtonStyleClassName);
+ this._previousResultButton.disabled = true;
+ this._previousResultButton.addEventListener("click", this._previousResultButtonClicked.bind(this));
+ this._element.appendChild(this._previousResultButton);
</ins><span class="cx">
</span><del>- var previousResultButtonGlyphElement = document.createElement("div");
- previousResultButtonGlyphElement.classList.add(WebInspector.FindBanner.SegmentGlyphStyleClassName);
- this._previousResultButton.appendChild(previousResultButtonGlyphElement);
</del><ins>+ var previousResultButtonGlyphElement = document.createElement("div");
+ previousResultButtonGlyphElement.classList.add(WebInspector.FindBanner.SegmentGlyphStyleClassName);
+ this._previousResultButton.appendChild(previousResultButtonGlyphElement);
</ins><span class="cx">
</span><del>- this._nextResultButton = document.createElement("button");
- this._nextResultButton.classList.add(WebInspector.FindBanner.SegmentedButtonStyleClassName);
- this._nextResultButton.classList.add(WebInspector.FindBanner.RightSegmentButtonStyleClassName);
- this._nextResultButton.disabled = true;
- this._nextResultButton.addEventListener("click", this._nextResultButtonClicked.bind(this));
- this._element.appendChild(this._nextResultButton);
</del><ins>+ this._nextResultButton = document.createElement("button");
+ this._nextResultButton.classList.add(WebInspector.FindBanner.SegmentedButtonStyleClassName);
+ this._nextResultButton.classList.add(WebInspector.FindBanner.RightSegmentButtonStyleClassName);
+ this._nextResultButton.disabled = true;
+ this._nextResultButton.addEventListener("click", this._nextResultButtonClicked.bind(this));
+ this._element.appendChild(this._nextResultButton);
</ins><span class="cx">
</span><del>- var nextResultButtonGlyphElement = document.createElement("div");
- nextResultButtonGlyphElement.classList.add(WebInspector.FindBanner.SegmentGlyphStyleClassName);
- this._nextResultButton.appendChild(nextResultButtonGlyphElement);
</del><ins>+ var nextResultButtonGlyphElement = document.createElement("div");
+ nextResultButtonGlyphElement.classList.add(WebInspector.FindBanner.SegmentGlyphStyleClassName);
+ this._nextResultButton.appendChild(nextResultButtonGlyphElement);
</ins><span class="cx">
</span><del>- this._inputField = document.createElement("input");
- this._inputField.type = "search";
- this._inputField.spellcheck = false;
- this._inputField.incremental = true;
- this._inputField.setAttribute("results", 5);
- this._inputField.setAttribute("autosave", "inspector-search");
- this._inputField.addEventListener("keydown", this._inputFieldKeyDown.bind(this), false);
- this._inputField.addEventListener("keyup", this._inputFieldKeyUp.bind(this), false);
- this._inputField.addEventListener("search", this._inputFieldSearch.bind(this), false);
- this._element.appendChild(this._inputField);
</del><ins>+ this._inputField = document.createElement("input");
+ this._inputField.type = "search";
+ this._inputField.spellcheck = false;
+ this._inputField.incremental = true;
+ this._inputField.setAttribute("results", 5);
+ this._inputField.setAttribute("autosave", "inspector-search");
+ this._inputField.addEventListener("keydown", this._inputFieldKeyDown.bind(this), false);
+ this._inputField.addEventListener("keyup", this._inputFieldKeyUp.bind(this), false);
+ this._inputField.addEventListener("search", this._inputFieldSearch.bind(this), false);
+ this._element.appendChild(this._inputField);
</ins><span class="cx">
</span><del>- this._doneButton = document.createElement("button");
- this._doneButton.textContent = WebInspector.UIString("Done");
- this._doneButton.addEventListener("click", this._doneButtonClicked.bind(this));
- this._element.appendChild(this._doneButton);
</del><ins>+ this._doneButton = document.createElement("button");
+ this._doneButton.textContent = WebInspector.UIString("Done");
+ this._doneButton.addEventListener("click", this._doneButtonClicked.bind(this));
+ this._element.appendChild(this._doneButton);
</ins><span class="cx">
</span><del>- this._numberOfResults = null;
- this._searchBackwards = false;
- this._searchKeyPressed = false;
- this._previousSearchValue = "";
</del><ins>+ this._numberOfResults = null;
+ this._searchBackwards = false;
+ this._searchKeyPressed = false;
+ this._previousSearchValue = "";
</ins><span class="cx">
</span><del>- this._hideKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Escape, this.hide.bind(this), this._element);
- this._populateFindKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "E", this._populateSearchQueryFromSelection.bind(this));
- this._populateFindKeyboardShortcut.implicitlyPreventsDefault = false;
- this._findNextKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "G", this._nextResultButtonClicked.bind(this));
- this._findPreviousKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Shift | WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "G", this._previousResultButtonClicked.bind(this));
</del><ins>+ this._hideKeyboardShortcut = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Escape, this.hide.bind(this), this._element);
+ this._populateFindKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "E", this._populateSearchQueryFromSelection.bind(this));
+ this._populateFindKeyboardShortcut.implicitlyPreventsDefault = false;
+ this._findNextKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "G", this._nextResultButtonClicked.bind(this));
+ this._findPreviousKeyboardShortcut = new WebInspector.KeyboardShortcut(WebInspector.KeyboardShortcut.Modifier.Shift | WebInspector.KeyboardShortcut.Modifier.CommandOrControl, "G", this._previousResultButtonClicked.bind(this));
</ins><span class="cx">
</span><del>- this._generateButtonsGlyphsIfNeeded();
-};
</del><ins>+ this._generateButtonsGlyphsIfNeeded();
+ }
</ins><span class="cx">
</span><del>-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.FindBanner);
-
-WebInspector.FindBanner.StyleClassName = "find-banner";
-WebInspector.FindBanner.SupportsFindBannerStyleClassName = "supports-find-banner";
-WebInspector.FindBanner.ShowingFindBannerStyleClassName = "showing-find-banner";
-WebInspector.FindBanner.NoTransitionStyleClassName = "no-find-banner-transition";
-WebInspector.FindBanner.ShowingStyleClassName = "showing";
-WebInspector.FindBanner.SegmentedButtonStyleClassName = "segmented";
-WebInspector.FindBanner.LeftSegmentButtonStyleClassName = "left";
-WebInspector.FindBanner.RightSegmentButtonStyleClassName = "right";
-WebInspector.FindBanner.SegmentGlyphStyleClassName = "glyph";
-
-WebInspector.FindBanner.Event = {
- DidShow: "find-banner-did-show",
- DidHide: "find-banner-did-hide"
-};
-
-WebInspector.FindBanner.prototype = {
- constructor: WebInspector.FindBanner,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get delegate()
</span><span class="cx"> {
</span><span class="cx"> return this._delegate;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set delegate(newDelegate)
</span><span class="cx"> {
</span><span class="cx"> this._delegate = newDelegate || null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get inputField()
</span><span class="cx"> {
</span><span class="cx"> return this._inputField;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get searchQuery()
</span><span class="cx"> {
</span><span class="cx"> return this._inputField.value || "";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set searchQuery(query)
</span><span class="cx"> {
</span><span class="cx"> this._inputField.value = query || "";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get numberOfResults()
</span><span class="cx"> {
</span><span class="cx"> return this._numberOfResults;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set numberOfResults(numberOfResults)
</span><span class="cx"> {
</span><span class="lines">@@ -162,15 +143,21 @@
</span><span class="cx"> this._resultCountLabel.textContent = WebInspector.UIString("1 match");
</span><span class="cx"> else if (numberOfResults > 1)
</span><span class="cx"> this._resultCountLabel.textContent = WebInspector.UIString("%d matches").format(numberOfResults);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get targetElement()
</span><span class="cx"> {
</span><span class="cx"> return this._targetElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set targetElement(element)
</span><span class="cx"> {
</span><ins>+ function delayedWork()
+ {
+ oldTargetElement.classList.remove(WebInspector.FindBanner.NoTransitionStyleClassName);
+ this._element.classList.remove(WebInspector.FindBanner.NoTransitionStyleClassName);
+ }
+
</ins><span class="cx"> if (this._targetElement) {
</span><span class="cx"> var oldTargetElement = this._targetElement;
</span><span class="cx">
</span><span class="lines">@@ -181,12 +168,6 @@
</span><span class="cx"> this._element.classList.add(WebInspector.FindBanner.NoTransitionStyleClassName);
</span><span class="cx"> this._element.classList.remove(WebInspector.FindBanner.ShowingStyleClassName);
</span><span class="cx">
</span><del>- function delayedWork()
- {
- oldTargetElement.classList.remove(WebInspector.FindBanner.NoTransitionStyleClassName);
- this._element.classList.remove(WebInspector.FindBanner.NoTransitionStyleClassName);
- }
-
</del><span class="cx"> // Delay so we can remove the no transition style class after the other style changes are committed.
</span><span class="cx"> setTimeout(delayedWork.bind(this), 0);
</span><span class="cx"> }
</span><span class="lines">@@ -195,14 +176,14 @@
</span><span class="cx">
</span><span class="cx"> if (this._targetElement)
</span><span class="cx"> this._targetElement.classList.add(WebInspector.FindBanner.SupportsFindBannerStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get showing()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.FindBanner.ShowingStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- show: function()
</del><ins>+ show()
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this._targetElement);
</span><span class="cx"> if (!this._targetElement)
</span><span class="lines">@@ -228,9 +209,9 @@
</span><span class="cx"> setTimeout(delayedWork.bind(this), 0);
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.FindBanner.Event.DidShow);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hide: function()
</del><ins>+ hide()
</ins><span class="cx"> {
</span><span class="cx"> console.assert(this._targetElement);
</span><span class="cx"> if (!this._targetElement)
</span><span class="lines">@@ -242,27 +223,27 @@
</span><span class="cx"> this._element.classList.remove(WebInspector.FindBanner.ShowingStyleClassName);
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.FindBanner.Event.DidHide);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _inputFieldKeyDown: function(event)
</del><ins>+ _inputFieldKeyDown(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.keyIdentifier === "Shift")
</span><span class="cx"> this._searchBackwards = true;
</span><span class="cx"> else if (event.keyIdentifier === "Enter")
</span><span class="cx"> this._searchKeyPressed = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _inputFieldKeyUp: function(event)
</del><ins>+ _inputFieldKeyUp(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.keyIdentifier === "Shift")
</span><span class="cx"> this._searchBackwards = false;
</span><span class="cx"> else if (event.keyIdentifier === "Enter")
</span><span class="cx"> this._searchKeyPressed = false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _inputFieldSearch: function(event)
</del><ins>+ _inputFieldSearch(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._inputField.value) {
</span><span class="cx"> if (this._previousSearchValue !== this.searchQuery) {
</span><span class="lines">@@ -285,9 +266,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._previousSearchValue = this.searchQuery;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _populateSearchQueryFromSelection: function(event)
</del><ins>+ _populateSearchQueryFromSelection(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._delegate && typeof this._delegate.findBannerSearchQueryForSelection === "function") {
</span><span class="cx"> var query = this._delegate.findBannerSearchQueryForSelection(this);
</span><span class="lines">@@ -298,26 +279,26 @@
</span><span class="cx"> this._delegate.findBannerPerformSearch(this, this.searchQuery);
</span><span class="cx"> }
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _previousResultButtonClicked: function(event)
</del><ins>+ _previousResultButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._delegate && typeof this._delegate.findBannerRevealPreviousResult === "function")
</span><span class="cx"> this._delegate.findBannerRevealPreviousResult(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _nextResultButtonClicked: function(event)
</del><ins>+ _nextResultButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._delegate && typeof this._delegate.findBannerRevealNextResult === "function")
</span><span class="cx"> this._delegate.findBannerRevealNextResult(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _doneButtonClicked: function(event)
</del><ins>+ _doneButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> this.hide();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _generateButtonsGlyphsIfNeeded: function()
</del><ins>+ _generateButtonsGlyphsIfNeeded()
</ins><span class="cx"> {
</span><span class="cx"> if (WebInspector.FindBanner._generatedButtonsGlyphs)
</span><span class="cx"> return;
</span><span class="lines">@@ -342,4 +323,16 @@
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.FindBanner.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.FindBanner.SupportsFindBannerStyleClassName = "supports-find-banner";
+WebInspector.FindBanner.ShowingFindBannerStyleClassName = "showing-find-banner";
+WebInspector.FindBanner.NoTransitionStyleClassName = "no-find-banner-transition";
+WebInspector.FindBanner.ShowingStyleClassName = "showing";
+WebInspector.FindBanner.SegmentedButtonStyleClassName = "segmented";
+WebInspector.FindBanner.LeftSegmentButtonStyleClassName = "left";
+WebInspector.FindBanner.RightSegmentButtonStyleClassName = "right";
+WebInspector.FindBanner.SegmentGlyphStyleClassName = "glyph";
+
+WebInspector.FindBanner.Event = {
+ DidShow: "find-banner-did-show",
+ DidHide: "find-banner-did-hide"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsGeneralTreeElementPathComponentjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/GeneralTreeElementPathComponent.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/GeneralTreeElementPathComponent.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GeneralTreeElementPathComponent.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,22 +23,22 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.GeneralTreeElementPathComponent = function(generalTreeElement, representedObject) {
- WebInspector.HierarchicalPathComponent.call(this, generalTreeElement.mainTitle, generalTreeElement.classNames, representedObject || generalTreeElement.representedObject);
</del><ins>+WebInspector.GeneralTreeElementPathComponent = class GeneralTreeElementPathComponent extends WebInspector.HierarchicalPathComponent
+{
+ constructor(generalTreeElement, representedObject)
+ {
+ super(generalTreeElement.mainTitle, generalTreeElement.classNames, representedObject || generalTreeElement.representedObject);
</ins><span class="cx">
</span><del>- this._generalTreeElement = generalTreeElement;
- generalTreeElement.addEventListener(WebInspector.GeneralTreeElement.Event.MainTitleDidChange, this._mainTitleDidChange, this);
-};
</del><ins>+ this._generalTreeElement = generalTreeElement;
+ generalTreeElement.addEventListener(WebInspector.GeneralTreeElement.Event.MainTitleDidChange, this._mainTitleDidChange, this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.GeneralTreeElementPathComponent.prototype = {
- constructor: WebInspector.GeneralTreeElementPathComponent,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get generalTreeElement()
</span><span class="cx"> {
</span><span class="cx"> return this._generalTreeElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get previousSibling()
</span><span class="cx"> {
</span><span class="lines">@@ -50,7 +50,7 @@
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> return new WebInspector.GeneralTreeElementPathComponent(previousSibling);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get nextSibling()
</span><span class="cx"> {
</span><span class="lines">@@ -62,14 +62,12 @@
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="cx"> return new WebInspector.GeneralTreeElementPathComponent(nextSibling);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _mainTitleDidChange: function(event)
</del><ins>+ _mainTitleDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> this.displayName = this._generalTreeElement.mainTitle;
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.GeneralTreeElementPathComponent.prototype.__proto__ = WebInspector.HierarchicalPathComponent.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsGoToLineDialogjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/GoToLineDialog.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/GoToLineDialog.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GoToLineDialog.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,50 +23,43 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.GoToLineDialog = function()
</del><ins>+WebInspector.GoToLineDialog = class GoToLineDialog extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ constructor()
+ {
+ super();
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = WebInspector.GoToLineDialog.StyleClassName;
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "go-to-line-dialog";
</ins><span class="cx">
</span><del>- var field = this._element.appendChild(document.createElement("div"));
</del><ins>+ var field = this._element.appendChild(document.createElement("div"));
</ins><span class="cx">
</span><del>- this._input = field.appendChild(document.createElement("input"));
- this._input.type = "text";
- this._input.placeholder = WebInspector.UIString("Line Number");
- this._input.spellcheck = false;
</del><ins>+ this._input = field.appendChild(document.createElement("input"));
+ this._input.type = "text";
+ this._input.placeholder = WebInspector.UIString("Line Number");
+ this._input.spellcheck = false;
</ins><span class="cx">
</span><del>- this._clearIcon = field.appendChild(document.createElement("img"));
</del><ins>+ this._clearIcon = field.appendChild(document.createElement("img"));
</ins><span class="cx">
</span><del>- this._input.addEventListener("input", this);
- this._input.addEventListener("keydown", this);
- this._input.addEventListener("blur", this);
- this._clearIcon.addEventListener("mousedown", this);
- this._clearIcon.addEventListener("click", this);
</del><ins>+ this._input.addEventListener("input", this);
+ this._input.addEventListener("keydown", this);
+ this._input.addEventListener("blur", this);
+ this._clearIcon.addEventListener("mousedown", this);
+ this._clearIcon.addEventListener("click", this);
</ins><span class="cx">
</span><del>- this._dismissing = false;
-};
</del><ins>+ this._dismissing = false;
+ }
</ins><span class="cx">
</span><del>-WebInspector.GoToLineDialog.StyleClassName = "go-to-line-dialog";
-WebInspector.GoToLineDialog.NonEmptyClassName = "non-empty";
-
-WebInspector.GoToLineDialog.prototype = {
- constructor: WebInspector.GoToLineDialog,
-
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- present: function(parent)
</del><ins>+ present(parent)
</ins><span class="cx"> {
</span><span class="cx"> parent.appendChild(this._element);
</span><span class="cx"> this._input.focus();
</span><span class="cx"> this._clear();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- dismiss: function()
</del><ins>+ dismiss()
</ins><span class="cx"> {
</span><span class="cx"> if (this._dismissing)
</span><span class="cx"> return;
</span><span class="lines">@@ -83,11 +76,11 @@
</span><span class="cx"> this.delegate.goToLineDialogWasDismissed(this);
</span><span class="cx">
</span><span class="cx"> this._dismissing = false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> switch (event.type) {
</span><span class="cx"> case "input":
</span><span class="lines">@@ -106,25 +99,27 @@
</span><span class="cx"> this._handleClickEvent(event);
</span><span class="cx"> break;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _handleInputEvent: function(event)
</del><ins>+ _handleInputEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._input.value === "")
</span><span class="cx"> this._element.classList.remove(WebInspector.GoToLineDialog.NonEmptyClassName);
</span><span class="cx"> else
</span><span class="cx"> this._element.classList.add(WebInspector.GoToLineDialog.NonEmptyClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleKeydownEvent: function(event)
</del><ins>+ _handleKeydownEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.keyCode === WebInspector.KeyboardShortcut.Key.Escape.keyCode) {
</span><span class="cx"> if (this._input.value === "")
</span><span class="cx"> this.dismiss();
</span><span class="cx"> else
</span><span class="cx"> this._clear();
</span><ins>+
+ event.preventDefault();
</ins><span class="cx"> } else if (event.keyCode === WebInspector.KeyboardShortcut.Key.Enter.keyCode) {
</span><span class="cx"> var value = parseInt(this._input.value, 10);
</span><span class="cx">
</span><span class="lines">@@ -139,31 +134,34 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._input.select();
</span><ins>+
</ins><span class="cx"> InspectorFrontendHost.beep();
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleBlurEvent: function(event)
</del><ins>+ _handleBlurEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> this.dismiss();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMousedownEvent: function(event)
</del><ins>+ _handleMousedownEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> this._input.select();
</span><span class="cx"> // This ensures we don't get a "blur" event triggered for the text field
</span><span class="cx"> // which would end up dimissing the dialog, which is not the intent.
</span><span class="cx"> event.preventDefault();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleClickEvent: function(event)
</del><ins>+ _handleClickEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> this._clear();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _clear: function()
</del><ins>+ _clear()
</ins><span class="cx"> {
</span><span class="cx"> this._input.value = "";
</span><span class="cx"> this._element.classList.remove(WebInspector.GoToLineDialog.NonEmptyClassName);
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.GoToLineDialog.NonEmptyClassName = "non-empty";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsGradientSliderjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -26,30 +26,23 @@
</span><span class="cx"> * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.GradientSlider = function(delegate)
</del><ins>+WebInspector.GradientSlider = class GradientSlider extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- this.delegate = delegate;
-
- this._element = null;
- this._stops = [];
- this._knobs = [];
-
- this._selectedKnob = null;
- this._canvas = document.createElement("canvas");
</del><ins>+ constructor(delegate)
+ {
+ super();
</ins><span class="cx">
</span><del>- this._keyboardShortcutEsc = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Escape);
-}
</del><ins>+ this.delegate = delegate;
</ins><span class="cx">
</span><del>-WebInspector.GradientSlider.Width = 238;
-WebInspector.GradientSlider.Height = 19;
</del><ins>+ this._element = null;
+ this._stops = [];
+ this._knobs = [];
</ins><span class="cx">
</span><del>-WebInspector.GradientSlider.StyleClassName = "gradient-slider";
-WebInspector.GradientSlider.AddAreaClassName = "add-area";
-WebInspector.GradientSlider.DetachingClassName = "detaching";
-WebInspector.GradientSlider.ShadowClassName = "shadow";
</del><ins>+ this._selectedKnob = null;
+ this._canvas = document.createElement("canvas");
</ins><span class="cx">
</span><del>-WebInspector.GradientSlider.prototype = {
- constructor: WebInspector.GradientSlider,
</del><ins>+ this._keyboardShortcutEsc = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Escape);
+ }
</ins><span class="cx">
</span><span class="cx"> // Public
</span><span class="cx">
</span><span class="lines">@@ -57,9 +50,9 @@
</span><span class="cx"> {
</span><span class="cx"> if (!this._element) {
</span><span class="cx"> this._element = document.createElement("div");
</span><del>- this._element.className = WebInspector.GradientSlider.StyleClassName;
</del><ins>+ this._element.className = "gradient-slider";
</ins><span class="cx"> this._element.appendChild(this._canvas);
</span><del>-
</del><ins>+
</ins><span class="cx"> this._addArea = this._element.appendChild(document.createElement("div"));
</span><span class="cx"> this._addArea.addEventListener("mouseover", this);
</span><span class="cx"> this._addArea.addEventListener("mousemove", this);
</span><span class="lines">@@ -68,28 +61,28 @@
</span><span class="cx"> this._addArea.className = WebInspector.GradientSlider.AddAreaClassName;
</span><span class="cx"> }
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get stops()
</span><span class="cx"> {
</span><span class="cx"> return this._stops;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set stops(stops)
</span><span class="cx"> {
</span><span class="cx"> this._stops = stops;
</span><span class="cx">
</span><span class="cx"> this._updateStops();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selectedStop()
</span><span class="cx"> {
</span><span class="cx"> return this._selectedKnob ? this._selectedKnob.stop : null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> switch (event.type) {
</span><span class="cx"> case "mouseover":
</span><span class="lines">@@ -105,9 +98,9 @@
</span><span class="cx"> this._handleClick(event);
</span><span class="cx"> break;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- handleKeydownEvent: function(event)
</del><ins>+ handleKeydownEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._keyboardShortcutEsc.matchesEvent(event) || !this._selectedKnob || !this._selectedKnob.selected)
</span><span class="cx"> return false;
</span><span class="lines">@@ -115,21 +108,21 @@
</span><span class="cx"> this._selectedKnob.selected = false;
</span><span class="cx">
</span><span class="cx"> return true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- knobXDidChange: function(knob)
</del><ins>+ knobXDidChange(knob)
</ins><span class="cx"> {
</span><span class="cx"> knob.stop.offset = knob.x / WebInspector.GradientSlider.Width;
</span><span class="cx"> this._sortStops();
</span><span class="cx"> this._updateCanvas();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- knobCanDetach: function(knob)
</del><ins>+ knobCanDetach(knob)
</ins><span class="cx"> {
</span><span class="cx"> return this._knobs.length > 2;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- knobWillDetach: function(knob)
</del><ins>+ knobWillDetach(knob)
</ins><span class="cx"> {
</span><span class="cx"> knob.element.classList.add(WebInspector.GradientSlider.DetachingClassName);
</span><span class="cx">
</span><span class="lines">@@ -137,9 +130,9 @@
</span><span class="cx"> this._knobs.remove(knob);
</span><span class="cx"> this._sortStops();
</span><span class="cx"> this._updateCanvas();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- knobSelectionChanged: function(knob)
</del><ins>+ knobSelectionChanged(knob)
</ins><span class="cx"> {
</span><span class="cx"> if (this._selectedKnob && this._selectedKnob !== knob && knob.selected)
</span><span class="cx"> this._selectedKnob.selected = false;
</span><span class="lines">@@ -153,30 +146,30 @@
</span><span class="cx"> WebInspector.addWindowKeydownListener(this);
</span><span class="cx"> else
</span><span class="cx"> WebInspector.removeWindowKeydownListener(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _handleMouseover: function(event)
</del><ins>+ _handleMouseover(event)
</ins><span class="cx"> {
</span><span class="cx"> this._updateShadowKnob(event);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMousemove: function(event)
</del><ins>+ _handleMousemove(event)
</ins><span class="cx"> {
</span><span class="cx"> this._updateShadowKnob(event);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMouseout: function(event)
</del><ins>+ _handleMouseout(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._shadowKnob)
</span><span class="cx"> return;
</span><span class="cx">
</span><span class="cx"> this._shadowKnob.element.remove();
</span><span class="cx"> delete this._shadowKnob;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleClick: function(event)
</del><ins>+ _handleClick(event)
</ins><span class="cx"> {
</span><span class="cx"> this._updateShadowKnob(event);
</span><span class="cx">
</span><span class="lines">@@ -192,9 +185,9 @@
</span><span class="cx"> this._knobs[this._stops.indexOf(stop)].selected = true;
</span><span class="cx">
</span><span class="cx"> delete this._shadowKnob;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateShadowKnob: function(event)
</del><ins>+ _updateShadowKnob(event)
</ins><span class="cx"> {
</span><span class="cx"> if (!this._shadowKnob) {
</span><span class="cx"> this._shadowKnob = new WebInspector.GradientSliderKnob(this);
</span><span class="lines">@@ -206,22 +199,22 @@
</span><span class="cx">
</span><span class="cx"> var colorData = this._canvas.getContext("2d").getImageData(this._shadowKnob.x - 1, 0, 1, 1).data;
</span><span class="cx"> this._shadowKnob.wellColor = new WebInspector.Color(WebInspector.Color.Format.RGB, [colorData[0], colorData[1], colorData[2], colorData[3] / 255]);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _sortStops: function()
</del><ins>+ _sortStops()
</ins><span class="cx"> {
</span><span class="cx"> this._stops.sort(function(a, b) {
</span><span class="cx"> return a.offset - b.offset;
</span><span class="cx"> });
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateStops: function()
</del><ins>+ _updateStops()
</ins><span class="cx"> {
</span><span class="cx"> this._updateCanvas();
</span><span class="cx"> this._updateKnobs();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateCanvas: function()
</del><ins>+ _updateCanvas()
</ins><span class="cx"> {
</span><span class="cx"> var w = WebInspector.GradientSlider.Width;
</span><span class="cx"> var h = WebInspector.GradientSlider.Height;
</span><span class="lines">@@ -240,9 +233,9 @@
</span><span class="cx">
</span><span class="cx"> if (this.delegate && typeof this.delegate.gradientSliderStopsDidChange === "function")
</span><span class="cx"> this.delegate.gradientSliderStopsDidChange(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateKnobs: function()
</del><ins>+ _updateKnobs()
</ins><span class="cx"> {
</span><span class="cx"> var selectedStop = this._selectedKnob ? this._selectedKnob.stop : null;
</span><span class="cx">
</span><span class="lines">@@ -264,87 +257,91 @@
</span><span class="cx"> knob.selected = stop === selectedStop;
</span><span class="cx"> }
</span><span class="cx"> }
</span><del>-}
</del><ins>+};
</ins><span class="cx">
</span><del>-WebInspector.GradientSliderKnob = function(delegate)
</del><ins>+WebInspector.GradientSlider.Width = 238;
+WebInspector.GradientSlider.Height = 19;
+
+WebInspector.GradientSlider.AddAreaClassName = "add-area";
+WebInspector.GradientSlider.DetachingClassName = "detaching";
+WebInspector.GradientSlider.ShadowClassName = "shadow";
+
+WebInspector.GradientSliderKnob = class GradientSliderKnob extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- this._x = 0;
- this._y = 0;
- this._stop = null;
-
- this.delegate = delegate;
-
- this._element = document.createElement("div");
- this._element.className = WebInspector.GradientSliderKnob.StyleClassName;
</del><ins>+ constructor(delegate)
+ {
+ super();
</ins><span class="cx">
</span><del>- // Checkers pattern.
- this._element.appendChild(document.createElement("img"));
</del><ins>+ this._x = 0;
+ this._y = 0;
+ this._stop = null;
</ins><span class="cx">
</span><del>- this._well = this._element.appendChild(document.createElement("div"));
</del><ins>+ this.delegate = delegate;
</ins><span class="cx">
</span><del>- this._element.addEventListener("mousedown", this);
-};
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "gradient-slider-knob";
</ins><span class="cx">
</span><del>-WebInspector.GradientSliderKnob.StyleClassName = "gradient-slider-knob";
-WebInspector.GradientSliderKnob.SelectedClassName = "selected";
-WebInspector.GradientSliderKnob.FadeOutClassName = "fade-out";
</del><ins>+ // Checkers pattern.
+ this._element.appendChild(document.createElement("img"));
</ins><span class="cx">
</span><del>-WebInspector.GradientSliderKnob.prototype = {
- constructor: WebInspector.GradientSliderKnob,
</del><ins>+ this._well = this._element.appendChild(document.createElement("div"));
</ins><span class="cx">
</span><ins>+ this._element.addEventListener("mousedown", this);
+ }
+
</ins><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get stop()
</span><span class="cx"> {
</span><span class="cx"> return this._stop;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set stop(stop)
</span><span class="cx"> {
</span><span class="cx"> this.wellColor = stop.color;
</span><span class="cx"> this._stop = stop;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get x()
</span><span class="cx"> {
</span><span class="cx"> return this._x;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set x(x) {
</span><span class="cx"> this._x = x;
</span><span class="cx"> this._updateTransform();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get y()
</span><span class="cx"> {
</span><span class="cx"> return this._x;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set y(y) {
</span><span class="cx"> this._y = y;
</span><span class="cx"> this._updateTransform();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get wellColor()
</span><span class="cx"> {
</span><span class="cx"> return this._wellColor;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set wellColor(color)
</span><span class="cx"> {
</span><span class="cx"> this._wellColor = color;
</span><span class="cx"> this._well.style.backgroundColor = color;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selected()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.GradientSliderKnob.SelectedClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set selected(selected)
</span><span class="cx"> {
</span><span class="lines">@@ -355,11 +352,11 @@
</span><span class="cx">
</span><span class="cx"> if (this.delegate && typeof this.delegate.knobSelectionChanged === "function")
</span><span class="cx"> this.delegate.knobSelectionChanged(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> event.preventDefault();
</span><span class="cx"> event.stopPropagation();
</span><span class="lines">@@ -378,11 +375,11 @@
</span><span class="cx"> this._handleTransitionEnd(event);
</span><span class="cx"> break;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _handleMousedown: function(event)
</del><ins>+ _handleMousedown(event)
</ins><span class="cx"> {
</span><span class="cx"> this._moved = false;
</span><span class="cx"> this._detaching = false;
</span><span class="lines">@@ -393,9 +390,9 @@
</span><span class="cx"> this._startX = this.x;
</span><span class="cx"> this._startMouseX = event.pageX;
</span><span class="cx"> this._startMouseY = event.pageY;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMousemove: function(event)
</del><ins>+ _handleMousemove(event)
</ins><span class="cx"> {
</span><span class="cx"> var w = WebInspector.GradientSlider.Width;
</span><span class="cx">
</span><span class="lines">@@ -421,9 +418,9 @@
</span><span class="cx"> this.y = event.pageY - this._startMouseY;
</span><span class="cx"> else if (this.delegate && typeof this.delegate.knobXDidChange === "function")
</span><span class="cx"> this.delegate.knobXDidChange(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMouseup: function(event)
</del><ins>+ _handleMouseup(event)
</ins><span class="cx"> {
</span><span class="cx"> window.removeEventListener("mousemove", this, true);
</span><span class="cx"> window.removeEventListener("mouseup", this, true);
</span><span class="lines">@@ -434,17 +431,20 @@
</span><span class="cx"> this.selected = false;
</span><span class="cx"> } else if (!this._moved)
</span><span class="cx"> this.selected = !this.selected;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleTransitionEnd: function(event)
</del><ins>+ _handleTransitionEnd(event)
</ins><span class="cx"> {
</span><span class="cx"> this.element.removeEventListener("transitionend", this);
</span><span class="cx"> this.element.classList.remove(WebInspector.GradientSliderKnob.FadeOutClassName);
</span><span class="cx"> this.element.remove();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateTransform: function()
</del><ins>+ _updateTransform()
</ins><span class="cx"> {
</span><span class="cx"> this.element.style.webkitTransform = "translate3d(" + this._x + "px, " + this._y + "px, 0)";
</span><span class="cx"> }
</span><del>-}
</del><ins>+};
+
+WebInspector.GradientSliderKnob.SelectedClassName = "selected";
+WebInspector.GradientSliderKnob.FadeOutClassName = "fade-out";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsHierarchicalPathComponentjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathComponent.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathComponent.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathComponent.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -23,104 +23,81 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.HierarchicalPathComponent = function(displayName, styleClassNames, representedObject, textOnly, showSelectorArrows)
</del><ins>+WebInspector.HierarchicalPathComponent = class HierarchicalPathComponent extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ constructor(displayName, styleClassNames, representedObject, textOnly, showSelectorArrows)
+ {
+ super();
</ins><span class="cx">
</span><del>- console.assert(displayName);
- console.assert(styleClassNames);
</del><ins>+ console.assert(displayName);
+ console.assert(styleClassNames);
</ins><span class="cx">
</span><del>- this._representedObject = representedObject || null;
</del><ins>+ this._representedObject = representedObject || null;
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = WebInspector.HierarchicalPathComponent.StyleClassName;
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "hierarchical-path-component";
</ins><span class="cx">
</span><del>- if (!(styleClassNames instanceof Array))
- styleClassNames = [styleClassNames];
</del><ins>+ if (!(styleClassNames instanceof Array))
+ styleClassNames = [styleClassNames];
</ins><span class="cx">
</span><del>- for (var i = 0; i < styleClassNames.length; ++i) {
- if (!styleClassNames[i])
- continue;
- this._element.classList.add(styleClassNames[i]);
- }
</del><ins>+ for (var i = 0; i < styleClassNames.length; ++i) {
+ if (!styleClassNames[i])
+ continue;
+ this._element.classList.add(styleClassNames[i]);
+ }
</ins><span class="cx">
</span><del>- if (!textOnly) {
- this._iconElement = document.createElement("img");
- this._iconElement.className = WebInspector.HierarchicalPathComponent.IconElementStyleClassName;
- this._element.appendChild(this._iconElement);
- } else
- this._element.classList.add(WebInspector.HierarchicalPathComponent.TextOnlyStyleClassName);
</del><ins>+ if (!textOnly) {
+ this._iconElement = document.createElement("img");
+ this._iconElement.className = WebInspector.HierarchicalPathComponent.IconElementStyleClassName;
+ this._element.appendChild(this._iconElement);
+ } else
+ this._element.classList.add(WebInspector.HierarchicalPathComponent.TextOnlyStyleClassName);
</ins><span class="cx">
</span><del>- this._titleElement = document.createElement("div");
- this._titleElement.className = WebInspector.HierarchicalPathComponent.TitleElementStyleClassName;
- this._element.appendChild(this._titleElement);
</del><ins>+ this._titleElement = document.createElement("div");
+ this._titleElement.className = WebInspector.HierarchicalPathComponent.TitleElementStyleClassName;
+ this._element.appendChild(this._titleElement);
</ins><span class="cx">
</span><del>- this._titleContentElement = document.createElement("div");
- this._titleContentElement.className = WebInspector.HierarchicalPathComponent.TitleContentElementStyleClassName;
- this._titleElement.appendChild(this._titleContentElement);
</del><ins>+ this._titleContentElement = document.createElement("div");
+ this._titleContentElement.className = WebInspector.HierarchicalPathComponent.TitleContentElementStyleClassName;
+ this._titleElement.appendChild(this._titleContentElement);
</ins><span class="cx">
</span><del>- this._separatorElement = document.createElement("div");
- this._separatorElement.className = WebInspector.HierarchicalPathComponent.SeparatorElementStyleClassName;
- this._element.appendChild(this._separatorElement);
</del><ins>+ this._separatorElement = document.createElement("div");
+ this._separatorElement.className = WebInspector.HierarchicalPathComponent.SeparatorElementStyleClassName;
+ this._element.appendChild(this._separatorElement);
</ins><span class="cx">
</span><del>- this._selectElement = document.createElement("select");
- this._selectElement.addEventListener("mouseover", this._selectElementMouseOver.bind(this));
- this._selectElement.addEventListener("mouseout", this._selectElementMouseOut.bind(this));
- this._selectElement.addEventListener("mousedown", this._selectElementMouseDown.bind(this));
- this._selectElement.addEventListener("mouseup", this._selectElementMouseUp.bind(this));
- this._selectElement.addEventListener("change", this._selectElementSelectionChanged.bind(this));
- this._element.appendChild(this._selectElement);
</del><ins>+ this._selectElement = document.createElement("select");
+ this._selectElement.addEventListener("mouseover", this._selectElementMouseOver.bind(this));
+ this._selectElement.addEventListener("mouseout", this._selectElementMouseOut.bind(this));
+ this._selectElement.addEventListener("mousedown", this._selectElementMouseDown.bind(this));
+ this._selectElement.addEventListener("mouseup", this._selectElementMouseUp.bind(this));
+ this._selectElement.addEventListener("change", this._selectElementSelectionChanged.bind(this));
+ this._element.appendChild(this._selectElement);
</ins><span class="cx">
</span><del>- this._previousSibling = null;
- this._nextSibling = null;
</del><ins>+ this._previousSibling = null;
+ this._nextSibling = null;
</ins><span class="cx">
</span><del>- this._truncatedDisplayNameLength = 0;
</del><ins>+ this._truncatedDisplayNameLength = 0;
</ins><span class="cx">
</span><del>- this.selectorArrows = showSelectorArrows;
- this.displayName = displayName;
-};
</del><ins>+ this.selectorArrows = showSelectorArrows;
+ this.displayName = displayName;
+ }
</ins><span class="cx">
</span><del>-WebInspector.HierarchicalPathComponent.StyleClassName = "hierarchical-path-component";
-WebInspector.HierarchicalPathComponent.HiddenStyleClassName = "hidden";
-WebInspector.HierarchicalPathComponent.CollapsedStyleClassName = "collapsed";
-WebInspector.HierarchicalPathComponent.IconElementStyleClassName = "icon";
-WebInspector.HierarchicalPathComponent.TextOnlyStyleClassName = "text-only";
-WebInspector.HierarchicalPathComponent.ShowSelectorArrowsStyleClassName = "show-selector-arrows";
-WebInspector.HierarchicalPathComponent.TitleElementStyleClassName = "title";
-WebInspector.HierarchicalPathComponent.TitleContentElementStyleClassName = "content";
-WebInspector.HierarchicalPathComponent.SelectorArrowsElementStyleClassName = "selector-arrows";
-WebInspector.HierarchicalPathComponent.SeparatorElementStyleClassName = "separator";
-
-WebInspector.HierarchicalPathComponent.MinimumWidth = 32;
-WebInspector.HierarchicalPathComponent.MinimumWidthCollapsed = 24;
-WebInspector.HierarchicalPathComponent.MinimumWidthForOneCharacterTruncatedTitle = 54;
-WebInspector.HierarchicalPathComponent.SelectorArrowsWidth = 12;
-
-WebInspector.HierarchicalPathComponent.Event = {
- SiblingWasSelected: "hierarchical-path-component-sibling-was-selected",
- Clicked: "hierarchical-path-component-clicked"
-};
-
-WebInspector.HierarchicalPathComponent.prototype = {
- constructor: WebInspector.HierarchicalPathComponent,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get representedObject()
</span><span class="cx"> {
</span><span class="cx"> return this._representedObject;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get displayName()
</span><span class="cx"> {
</span><span class="cx"> return this._displayName;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set displayName(newDisplayName)
</span><span class="cx"> {
</span><span class="lines">@@ -131,12 +108,12 @@
</span><span class="cx"> this._displayName = newDisplayName;
</span><span class="cx">
</span><span class="cx"> this._updateElementTitleAndText();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get truncatedDisplayNameLength()
</span><span class="cx"> {
</span><span class="cx"> return this._truncatedDisplayNameLength;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set truncatedDisplayNameLength(truncatedDisplayNameLength)
</span><span class="cx"> {
</span><span class="lines">@@ -148,7 +125,7 @@
</span><span class="cx"> this._truncatedDisplayNameLength = truncatedDisplayNameLength;
</span><span class="cx">
</span><span class="cx"> this._updateElementTitleAndText();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get minimumWidth()
</span><span class="cx"> {
</span><span class="lines">@@ -157,7 +134,7 @@
</span><span class="cx"> if (this.selectorArrows)
</span><span class="cx"> return WebInspector.HierarchicalPathComponent.MinimumWidth + WebInspector.HierarchicalPathComponent.SelectorArrowsWidth;
</span><span class="cx"> return WebInspector.HierarchicalPathComponent.MinimumWidth;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get forcedWidth()
</span><span class="cx"> {
</span><span class="lines">@@ -165,7 +142,7 @@
</span><span class="cx"> if (typeof maxWidth === "string")
</span><span class="cx"> return parseInt(maxWidth);
</span><span class="cx"> return null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set forcedWidth(width)
</span><span class="cx"> {
</span><span class="lines">@@ -184,12 +161,12 @@
</span><span class="cx"> this._element.style.setProperty("width", Math.max(1, width) + "px");
</span><span class="cx"> } else
</span><span class="cx"> this._element.style.removeProperty("width");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get hidden()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.HierarchicalPathComponent.HiddenStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set hidden(flag)
</span><span class="cx"> {
</span><span class="lines">@@ -197,12 +174,12 @@
</span><span class="cx"> this._element.classList.add(WebInspector.HierarchicalPathComponent.HiddenStyleClassName);
</span><span class="cx"> else
</span><span class="cx"> this._element.classList.remove(WebInspector.HierarchicalPathComponent.HiddenStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get collapsed()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.HierarchicalPathComponent.CollapsedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set collapsed(flag)
</span><span class="cx"> {
</span><span class="lines">@@ -210,12 +187,12 @@
</span><span class="cx"> this._element.classList.add(WebInspector.HierarchicalPathComponent.CollapsedStyleClassName);
</span><span class="cx"> else
</span><span class="cx"> this._element.classList.remove(WebInspector.HierarchicalPathComponent.CollapsedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selectorArrows()
</span><span class="cx"> {
</span><span class="cx"> return this._element.classList.contains(WebInspector.HierarchicalPathComponent.ShowSelectorArrowsStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set selectorArrows(flag)
</span><span class="cx"> {
</span><span class="lines">@@ -233,31 +210,31 @@
</span><span class="cx">
</span><span class="cx"> this._element.classList.remove(WebInspector.HierarchicalPathComponent.ShowSelectorArrowsStyleClassName);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get previousSibling()
</span><span class="cx"> {
</span><span class="cx"> return this._previousSibling;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set previousSibling(newSlibling)
</span><span class="cx"> {
</span><span class="cx"> this._previousSibling = newSlibling || null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get nextSibling()
</span><span class="cx"> {
</span><span class="cx"> return this._nextSibling;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set nextSibling(newSlibling)
</span><span class="cx"> {
</span><span class="cx"> this._nextSibling = newSlibling || null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _updateElementTitleAndText: function()
</del><ins>+ _updateElementTitleAndText()
</ins><span class="cx"> {
</span><span class="cx"> var truncatedDisplayName = this._displayName;
</span><span class="cx"> if (this._truncatedDisplayNameLength && truncatedDisplayName.length > this._truncatedDisplayNameLength)
</span><span class="lines">@@ -265,16 +242,16 @@
</span><span class="cx">
</span><span class="cx"> this._element.title = this._displayName;
</span><span class="cx"> this._titleContentElement.textContent = truncatedDisplayName;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _updateSelectElement: function()
</del><ins>+ _updateSelectElement()
</ins><span class="cx"> {
</span><span class="cx"> this._selectElement.removeChildren();
</span><span class="cx">
</span><span class="cx"> function createOption(component)
</span><span class="cx"> {
</span><span class="cx"> var optionElement = document.createElement("option");
</span><del>- const maxPopupMenuLength = 130; // <rdar://problem/13445374> <select> with very long option has clipped text and popup menu is still very wide
</del><ins>+ var maxPopupMenuLength = 130; // <rdar://problem/13445374> <select> with very long option has clipped text and popup menu is still very wide
</ins><span class="cx"> optionElement.textContent = component.displayName.length <= maxPopupMenuLength ? component.displayName : component.displayName.substring(0, maxPopupMenuLength) + "\u2026";
</span><span class="cx"> optionElement._pathComponent = component;
</span><span class="cx"> return optionElement;
</span><span class="lines">@@ -307,34 +284,52 @@
</span><span class="cx"> this._selectElement.selectedIndex = -1;
</span><span class="cx"> else
</span><span class="cx"> this._selectElement.selectedIndex = previousSiblingCount;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _selectElementMouseOver: function(event)
</del><ins>+ _selectElementMouseOver(event)
</ins><span class="cx"> {
</span><span class="cx"> if (typeof this.mouseOver === "function")
</span><span class="cx"> this.mouseOver();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _selectElementMouseOut: function(event)
</del><ins>+ _selectElementMouseOut(event)
</ins><span class="cx"> {
</span><span class="cx"> if (typeof this.mouseOut === "function")
</span><span class="cx"> this.mouseOut();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _selectElementMouseDown: function(event)
</del><ins>+ _selectElementMouseDown(event)
</ins><span class="cx"> {
</span><span class="cx"> this._updateSelectElement();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _selectElementMouseUp: function(event)
</del><ins>+ _selectElementMouseUp(event)
</ins><span class="cx"> {
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.HierarchicalPathComponent.Event.Clicked);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _selectElementSelectionChanged: function(event)
</del><ins>+ _selectElementSelectionChanged(event)
</ins><span class="cx"> {
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, {pathComponent: this._selectElement[this._selectElement.selectedIndex]._pathComponent});
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.HierarchicalPathComponent.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.HierarchicalPathComponent.HiddenStyleClassName = "hidden";
+WebInspector.HierarchicalPathComponent.CollapsedStyleClassName = "collapsed";
+WebInspector.HierarchicalPathComponent.IconElementStyleClassName = "icon";
+WebInspector.HierarchicalPathComponent.TextOnlyStyleClassName = "text-only";
+WebInspector.HierarchicalPathComponent.ShowSelectorArrowsStyleClassName = "show-selector-arrows";
+WebInspector.HierarchicalPathComponent.TitleElementStyleClassName = "title";
+WebInspector.HierarchicalPathComponent.TitleContentElementStyleClassName = "content";
+WebInspector.HierarchicalPathComponent.SelectorArrowsElementStyleClassName = "selector-arrows";
+WebInspector.HierarchicalPathComponent.SeparatorElementStyleClassName = "separator";
+
+WebInspector.HierarchicalPathComponent.MinimumWidth = 32;
+WebInspector.HierarchicalPathComponent.MinimumWidthCollapsed = 24;
+WebInspector.HierarchicalPathComponent.MinimumWidthForOneCharacterTruncatedTitle = 54;
+WebInspector.HierarchicalPathComponent.SelectorArrowsWidth = 12;
+
+WebInspector.HierarchicalPathComponent.Event = {
+ SiblingWasSelected: "hierarchical-path-component-sibling-was-selected",
+ Clicked: "hierarchical-path-component-clicked"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsHierarchicalPathNavigationItemjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathNavigationItem.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathNavigationItem.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HierarchicalPathNavigationItem.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,28 +23,21 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.HierarchicalPathNavigationItem = function(identifier, components) {
- WebInspector.NavigationItem.call(this, identifier);
</del><ins>+WebInspector.HierarchicalPathNavigationItem = class HierarchicalPathNavigationItem extends WebInspector.NavigationItem
+{
+ constructor(identifier, components)
+ {
+ super(identifier);
</ins><span class="cx">
</span><del>- this.components = components;
-};
</del><ins>+ this.components = components;
+ }
</ins><span class="cx">
</span><del>-WebInspector.HierarchicalPathNavigationItem.StyleClassName = "hierarchical-path";
-WebInspector.HierarchicalPathNavigationItem.AlwaysShowLastPathComponentSeparatorStyleClassName = "always-show-last-path-component-separator";
-
-WebInspector.HierarchicalPathNavigationItem.Event = {
- PathComponentWasSelected: "hierarchical-path-navigation-item-path-component-was-selected"
-};
-
-WebInspector.HierarchicalPathNavigationItem.prototype = {
- constructor: WebInspector.HierarchicalPathNavigationItem,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get components()
</span><span class="cx"> {
</span><span class="cx"> return this._components;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set components(newComponents)
</span><span class="cx"> {
</span><span class="lines">@@ -69,17 +62,17 @@
</span><span class="cx"> // Update layout for the so other items can adjust to the extra space (or lack thereof) too.
</span><span class="cx"> if (this.parentNavigationBar)
</span><span class="cx"> this.parentNavigationBar.updateLayoutSoon();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get lastComponent()
</span><span class="cx"> {
</span><span class="cx"> return this._components.lastValue || null;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get alwaysShowLastPathComponentSeparator()
</span><span class="cx"> {
</span><span class="cx"> return this.element.classList.contains(WebInspector.HierarchicalPathNavigationItem.AlwaysShowLastPathComponentSeparatorStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set alwaysShowLastPathComponentSeparator(flag)
</span><span class="cx"> {
</span><span class="lines">@@ -87,9 +80,9 @@
</span><span class="cx"> this.element.classList.add(WebInspector.HierarchicalPathNavigationItem.AlwaysShowLastPathComponentSeparatorStyleClassName);
</span><span class="cx"> else
</span><span class="cx"> this.element.classList.remove(WebInspector.HierarchicalPathNavigationItem.AlwaysShowLastPathComponentSeparatorStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- updateLayout: function(expandOnly)
</del><ins>+ updateLayout(expandOnly)
</ins><span class="cx"> {
</span><span class="cx"> var navigationBar = this.parentNavigationBar;
</span><span class="cx"> if (!navigationBar)
</span><span class="lines">@@ -222,16 +215,25 @@
</span><span class="cx">
</span><span class="cx"> // Set the tool tip of the collapsed component.
</span><span class="cx"> this._collapsedComponent.element.title = hiddenDisplayNames.join("\n");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><ins>+ // Protected
+
+ get additionalClassNames()
+ {
+ return ["hierarchical-path"];
+ }
+
</ins><span class="cx"> // Private
</span><span class="cx">
</span><del>- _additionalClassNames: [WebInspector.HierarchicalPathNavigationItem.StyleClassName],
-
- _siblingPathComponentWasSelected: function(event)
</del><ins>+ _siblingPathComponentWasSelected(event)
</ins><span class="cx"> {
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.HierarchicalPathNavigationItem.Event.PathComponentWasSelected, event.data);
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.HierarchicalPathNavigationItem.prototype.__proto__ = WebInspector.NavigationItem.prototype;
</del><ins>+WebInspector.HierarchicalPathNavigationItem.AlwaysShowLastPathComponentSeparatorStyleClassName = "always-show-last-path-component-separator";
+
+WebInspector.HierarchicalPathNavigationItem.Event = {
+ PathComponentWasSelected: "hierarchical-path-navigation-item-path-component-was-selected"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsHoverMenujs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/HoverMenu.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/HoverMenu.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/HoverMenu.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,38 +23,32 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.HoverMenu = function(delegate)
</del><ins>+WebInspector.HoverMenu = class HoverMenu extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ constructor(delegate)
+ {
+ super();
</ins><span class="cx">
</span><del>- this.delegate = delegate;
</del><ins>+ this.delegate = delegate;
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = WebInspector.HoverMenu.StyleClassName;
- this._element.addEventListener("transitionend", this, true);
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "hover-menu";
+ this._element.addEventListener("transitionend", this, true);
</ins><span class="cx">
</span><del>- this._outlineElement = this._element.appendChild(document.createElementNS("http://www.w3.org/2000/svg", "svg"));
</del><ins>+ this._outlineElement = this._element.appendChild(document.createElementNS("http://www.w3.org/2000/svg", "svg"));
</ins><span class="cx">
</span><del>- this._button = this._element.appendChild(document.createElement("img"));
- this._button.addEventListener("click", this);
-}
</del><ins>+ this._button = this._element.appendChild(document.createElement("img"));
+ this._button.addEventListener("click", this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.HoverMenu.StyleClassName = "hover-menu";
-WebInspector.HoverMenu.VisibleClassName = "visible";
-
-WebInspector.HoverMenu.prototype = {
- constructor: WebInspector.HoverMenu,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- present: function(rects)
</del><ins>+ present(rects)
</ins><span class="cx"> {
</span><span class="cx"> this._outlineElement.textContent = "";
</span><span class="cx">
</span><span class="lines">@@ -63,9 +57,9 @@
</span><span class="cx"> this._element.classList.add(WebInspector.HoverMenu.VisibleClassName);
</span><span class="cx">
</span><span class="cx"> window.addEventListener("scroll", this, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- dismiss: function(discrete)
</del><ins>+ dismiss(discrete)
</ins><span class="cx"> {
</span><span class="cx"> if (this._element.parentNode !== document.body)
</span><span class="cx"> return;
</span><span class="lines">@@ -76,11 +70,11 @@
</span><span class="cx"> this._element.classList.remove(WebInspector.HoverMenu.VisibleClassName);
</span><span class="cx">
</span><span class="cx"> window.removeEventListener("scroll", this, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> switch (event.type) {
</span><span class="cx"> case "scroll":
</span><span class="lines">@@ -95,17 +89,17 @@
</span><span class="cx"> this._element.remove();
</span><span class="cx"> break;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _handleClickEvent: function(event)
</del><ins>+ _handleClickEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this.delegate && typeof this.delegate.hoverMenuButtonWasPressed === "function")
</span><span class="cx"> this.delegate.hoverMenuButtonWasPressed(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawOutline: function(rects)
</del><ins>+ _drawOutline(rects)
</ins><span class="cx"> {
</span><span class="cx"> var buttonWidth = this._button.width;
</span><span class="cx"> var buttonHeight = this._button.height;
</span><span class="lines">@@ -135,11 +129,11 @@
</span><span class="cx">
</span><span class="cx"> this._button.style.left = (lastRect.maxX() - bounds.minX() - buttonWidth) + "px";
</span><span class="cx"> this._button.style.top = (lastRect.maxY() - bounds.minY() - buttonHeight) + "px";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addRect: function(rect)
</del><ins>+ _addRect(rect)
</ins><span class="cx"> {
</span><del>- const r = 4;
</del><ins>+ var r = 4;
</ins><span class="cx">
</span><span class="cx"> var svgRect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
</span><span class="cx"> svgRect.setAttribute("x", 1);
</span><span class="lines">@@ -149,24 +143,24 @@
</span><span class="cx"> svgRect.setAttribute("rx", r);
</span><span class="cx"> svgRect.setAttribute("ry", r);
</span><span class="cx"> return this._outlineElement.appendChild(svgRect);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addPath: function(commands, tx, ty)
</del><ins>+ _addPath(commands, tx, ty)
</ins><span class="cx"> {
</span><span class="cx"> var path = document.createElementNS("http://www.w3.org/2000/svg", "path");
</span><span class="cx"> path.setAttribute("d", commands.join(" "));
</span><span class="cx"> path.setAttribute("transform", "translate(" + (tx + 1) + "," + (ty + 1) + ")");
</span><span class="cx"> return this._outlineElement.appendChild(path);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawSingleLine: function(rect)
</del><ins>+ _drawSingleLine(rect)
</ins><span class="cx"> {
</span><span class="cx"> this._addRect(rect.pad(2));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawTwoNonOverlappingLines: function(rects)
</del><ins>+ _drawTwoNonOverlappingLines(rects)
</ins><span class="cx"> {
</span><del>- const r = 4;
</del><ins>+ var r = 4;
</ins><span class="cx">
</span><span class="cx"> var firstRect = rects[0].pad(2);
</span><span class="cx"> var secondRect = rects[1].pad(2);
</span><span class="lines">@@ -193,12 +187,12 @@
</span><span class="cx"> "q", 0, r, -r, r,
</span><span class="cx"> "H", rect.minX()
</span><span class="cx"> ], tx, ty);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawOverlappingLines: function(rects)
</del><ins>+ _drawOverlappingLines(rects)
</ins><span class="cx"> {
</span><del>- const PADDING = 2;
- const r = 4;
</del><ins>+ var PADDING = 2;
+ var r = 4;
</ins><span class="cx">
</span><span class="cx"> var minX = Number.MAX_VALUE;
</span><span class="cx"> var maxX = -Number.MAX_VALUE;
</span><span class="lines">@@ -219,7 +213,7 @@
</span><span class="cx"> return this._addRect(new WebInspector.Rect(minX, minY, maxX - minX, maxY - minY));
</span><span class="cx">
</span><span class="cx"> var lastLineMinY = rects.lastValue.minY() + PADDING;
</span><del>- if (rects[0].minX() === minX + PADDING)
</del><ins>+ if (rects[0].minX() === minX + PADDING) {
</ins><span class="cx"> return this._addPath([
</span><span class="cx"> "M", minX + r, minY,
</span><span class="cx"> "H", maxX - r,
</span><span class="lines">@@ -235,9 +229,10 @@
</span><span class="cx"> "V", minY + r,
</span><span class="cx"> "q", 0, -r, r, -r
</span><span class="cx"> ], -minX, -minY);
</span><del>-
</del><ins>+ }
+
</ins><span class="cx"> var firstLineMaxY = rects[0].maxY() - PADDING;
</span><del>- if (rects.lastValue.maxX() === maxX - PADDING)
</del><ins>+ if (rects.lastValue.maxX() === maxX - PADDING) {
</ins><span class="cx"> return this._addPath([
</span><span class="cx"> "M", firstLineMinX + r, minY,
</span><span class="cx"> "H", maxX - r,
</span><span class="lines">@@ -253,7 +248,8 @@
</span><span class="cx"> "V", minY + r,
</span><span class="cx"> "q", 0, -r, r, -r
</span><span class="cx"> ], -minX, -minY);
</span><del>-
</del><ins>+ }
+
</ins><span class="cx"> return this._addPath([
</span><span class="cx"> "M", firstLineMinX + r, minY,
</span><span class="cx"> "H", maxX - r,
</span><span class="lines">@@ -274,4 +270,6 @@
</span><span class="cx"> "q", 0, -r, r, -r
</span><span class="cx"> ], -minX, -minY);
</span><span class="cx"> }
</span><del>-}
</del><ins>+};
+
+WebInspector.HoverMenu.VisibleClassName = "visible";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsPopoverjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Popover.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,60 +23,48 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.Popover = function(delegate) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.Popover = class Popover extends WebInspector.Object
+{
+ constructor(delegate)
+ {
+ super();
</ins><span class="cx">
</span><del>- this.delegate = delegate;
- this._edge = null;
- this._frame = new WebInspector.Rect;
- this._content = null;
- this._targetFrame = new WebInspector.Rect;
- this._anchorPoint = new WebInspector.Point;
- this._preferredEdges = null;
</del><ins>+ this.delegate = delegate;
+ this._edge = null;
+ this._frame = new WebInspector.Rect;
+ this._content = null;
+ this._targetFrame = new WebInspector.Rect;
+ this._anchorPoint = new WebInspector.Point;
+ this._preferredEdges = null;
</ins><span class="cx">
</span><del>- this._contentNeedsUpdate = false;
</del><ins>+ this._contentNeedsUpdate = false;
</ins><span class="cx">
</span><del>- this._element = document.createElement("div");
- this._element.className = WebInspector.Popover.StyleClassName;
- this._canvasId = "popover-" + (WebInspector.Popover.canvasId++);
- this._element.style.backgroundImage = "-webkit-canvas(" + this._canvasId + ")";
- this._element.addEventListener("transitionend", this, true);
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "popover";
+ this._canvasId = "popover-" + (WebInspector.Popover.canvasId++);
+ this._element.style.backgroundImage = "-webkit-canvas(" + this._canvasId + ")";
+ this._element.addEventListener("transitionend", this, true);
</ins><span class="cx">
</span><del>- this._container = this._element.appendChild(document.createElement("div"));
- this._container.className = "container";
-};
</del><ins>+ this._container = this._element.appendChild(document.createElement("div"));
+ this._container.className = "container";
+ }
</ins><span class="cx">
</span><del>-WebInspector.Popover.StyleClassName = "popover";
-WebInspector.Popover.FadeOutClassName = "fade-out";
-WebInspector.Popover.canvasId = 0;
-WebInspector.Popover.CornerRadius = 5;
-WebInspector.Popover.MinWidth = 40;
-WebInspector.Popover.MinHeight = 40;
-WebInspector.Popover.ShadowPadding = 5;
-WebInspector.Popover.ContentPadding = 5;
-WebInspector.Popover.AnchorSize = new WebInspector.Size(22, 11);
-WebInspector.Popover.ShadowEdgeInsets = new WebInspector.EdgeInsets(WebInspector.Popover.ShadowPadding);
-
-WebInspector.Popover.prototype = {
- constructor: WebInspector.Popover,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get frame()
</span><span class="cx"> {
</span><span class="cx"> return this._frame;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get visible()
</span><span class="cx"> {
</span><span class="cx"> return this._element.parentNode === document.body && !this._element.classList.contains(WebInspector.Popover.FadeOutClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set frame(frame)
</span><span class="cx"> {
</span><span class="lines">@@ -86,7 +74,7 @@
</span><span class="cx"> this._element.style.height = frame.size.height + "px";
</span><span class="cx"> this._element.style.backgroundSize = frame.size.width + "px " + frame.size.height + "px";
</span><span class="cx"> this._frame = frame;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set content(content)
</span><span class="cx"> {
</span><span class="lines">@@ -99,9 +87,9 @@
</span><span class="cx">
</span><span class="cx"> if (this.visible)
</span><span class="cx"> this._update(true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- update: function()
</del><ins>+ update()
</ins><span class="cx"> {
</span><span class="cx"> if (!this.visible)
</span><span class="cx"> return;
</span><span class="lines">@@ -113,9 +101,9 @@
</span><span class="cx">
</span><span class="cx"> if (previouslyFocusedElement)
</span><span class="cx"> previouslyFocusedElement.focus();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- present: function(targetFrame, preferredEdges)
</del><ins>+ present(targetFrame, preferredEdges)
</ins><span class="cx"> {
</span><span class="cx"> this._targetFrame = targetFrame;
</span><span class="cx"> this._preferredEdges = preferredEdges;
</span><span class="lines">@@ -126,9 +114,9 @@
</span><span class="cx"> this._addListenersIfNeeded();
</span><span class="cx">
</span><span class="cx"> this._update();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- presentNewContentWithFrame: function(content, targetFrame, preferredEdges)
</del><ins>+ presentNewContentWithFrame(content, targetFrame, preferredEdges)
</ins><span class="cx"> {
</span><span class="cx"> this._content = content;
</span><span class="cx"> this._contentNeedsUpdate = true;
</span><span class="lines">@@ -140,9 +128,9 @@
</span><span class="cx">
</span><span class="cx"> var shouldAnimate = this.visible;
</span><span class="cx"> this._update(shouldAnimate);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- dismiss: function()
</del><ins>+ dismiss()
</ins><span class="cx"> {
</span><span class="cx"> if (this._element.parentNode !== document.body)
</span><span class="cx"> return;
</span><span class="lines">@@ -156,9 +144,9 @@
</span><span class="cx">
</span><span class="cx"> if (this.delegate && typeof this.delegate.willDismissPopover === "function")
</span><span class="cx"> this.delegate.willDismissPopover(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> switch (event.type) {
</span><span class="cx"> case "mousedown":
</span><span class="lines">@@ -176,11 +164,11 @@
</span><span class="cx"> break;
</span><span class="cx"> }
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _update: function(shouldAnimate)
</del><ins>+ _update(shouldAnimate)
</ins><span class="cx"> {
</span><span class="cx"> if (shouldAnimate)
</span><span class="cx"> var previousEdge = this._edge;
</span><span class="lines">@@ -212,7 +200,7 @@
</span><span class="cx"> this._preferredSize = new WebInspector.Size(Math.ceil(popoverBounds.width), Math.ceil(popoverBounds.height));
</span><span class="cx"> }
</span><span class="cx">
</span><del>- const titleBarOffset = WebInspector.Platform.name === "mac" && !WebInspector.Platform.isLegacyMacOS ? 22 : 0;
</del><ins>+ var titleBarOffset = WebInspector.Platform.name === "mac" && !WebInspector.Platform.isLegacyMacOS ? 22 : 0;
</ins><span class="cx"> var containerFrame = new WebInspector.Rect(0, titleBarOffset, window.innerWidth, window.innerHeight - titleBarOffset);
</span><span class="cx"> // The frame of the window with a little inset to make sure we have room for shadows.
</span><span class="cx"> containerFrame = containerFrame.inset(WebInspector.Popover.ShadowEdgeInsets);
</span><span class="lines">@@ -297,9 +285,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> this._contentNeedsUpdate = false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _cssClassNameForEdge: function()
</del><ins>+ _cssClassNameForEdge()
</ins><span class="cx"> {
</span><span class="cx"> switch (this._edge) {
</span><span class="cx"> case WebInspector.RectEdge.MIN_X: // Displayed on the left of the target, arrow points right.
</span><span class="lines">@@ -313,15 +301,15 @@
</span><span class="cx"> }
</span><span class="cx"> console.error("Unknown edge.");
</span><span class="cx"> return "arrow-up";
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _setAnchorPoint: function(anchorPoint) {
</del><ins>+ _setAnchorPoint(anchorPoint) {
</ins><span class="cx"> anchorPoint.x = Math.floor(anchorPoint.x);
</span><span class="cx"> anchorPoint.y = Math.floor(anchorPoint.y);
</span><span class="cx"> this._anchorPoint = anchorPoint;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _animateFrame: function(toFrame, toAnchor)
</del><ins>+ _animateFrame(toFrame, toAnchor)
</ins><span class="cx"> {
</span><span class="cx"> var startTime = Date.now();
</span><span class="cx"> var duration = 350;
</span><span class="lines">@@ -359,9 +347,9 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> drawBackground.call(this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawBackground: function()
</del><ins>+ _drawBackground()
</ins><span class="cx"> {
</span><span class="cx"> var scaleFactor = window.devicePixelRatio;
</span><span class="cx">
</span><span class="lines">@@ -429,9 +417,9 @@
</span><span class="cx"> finalContext.shadowColor = "rgba(0, 0, 0, 0.5)";
</span><span class="cx">
</span><span class="cx"> finalContext.drawImage(scratchCanvas, 0, 0, scaledWidth, scaledHeight);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _bestMetricsForEdge: function(preferredSize, targetFrame, containerFrame, edge)
</del><ins>+ _bestMetricsForEdge(preferredSize, targetFrame, containerFrame, edge)
</ins><span class="cx"> {
</span><span class="cx"> var x, y;
</span><span class="cx"> var width = preferredSize.width + (WebInspector.Popover.ShadowPadding * 2) + (WebInspector.Popover.ContentPadding * 2);
</span><span class="lines">@@ -494,9 +482,9 @@
</span><span class="cx"> frame: bestFrame,
</span><span class="cx"> contentSize: new WebInspector.Size(width, height)
</span><span class="cx"> };
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _drawFrame: function(ctx, bounds, anchorEdge)
</del><ins>+ _drawFrame(ctx, bounds, anchorEdge)
</ins><span class="cx"> {
</span><span class="cx"> var r = WebInspector.Popover.CornerRadius;
</span><span class="cx"> var arrowHalfLength = WebInspector.Popover.AnchorSize.width / 2;
</span><span class="lines">@@ -546,9 +534,9 @@
</span><span class="cx"> break;
</span><span class="cx"> }
</span><span class="cx"> ctx.closePath();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addListenersIfNeeded: function()
</del><ins>+ _addListenersIfNeeded()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._isListeningForPopoverEvents) {
</span><span class="cx"> this._isListeningForPopoverEvents = true;
</span><span class="lines">@@ -558,4 +546,12 @@
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.Popover.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.Popover.FadeOutClassName = "fade-out";
+WebInspector.Popover.canvasId = 0;
+WebInspector.Popover.CornerRadius = 5;
+WebInspector.Popover.MinWidth = 40;
+WebInspector.Popover.MinHeight = 40;
+WebInspector.Popover.ShadowPadding = 5;
+WebInspector.Popover.ContentPadding = 5;
+WebInspector.Popover.AnchorSize = new WebInspector.Size(22, 11);
+WebInspector.Popover.ShadowEdgeInsets = new WebInspector.EdgeInsets(WebInspector.Popover.ShadowPadding);
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsProbeSetDetailsSectionjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ProbeSetDetailsSection.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,4 +1,5 @@
</span><span class="cx"> /*
</span><ins>+ * Copyright (C) 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> * Copyright (C) 2013 University of Washington. All rights reserved.
</span><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="lines">@@ -23,71 +24,65 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ProbeSetDetailsSection = function(probeSet)
</del><ins>+WebInspector.ProbeSetDetailsSection = class ProbeSetDetailsSection extends WebInspector.DetailsSection
</ins><span class="cx"> {
</span><del>- console.assert(probeSet instanceof WebInspector.ProbeSet, "Invalid ProbeSet argument:", probeSet);
</del><ins>+ constructor(probeSet)
+ {
+ console.assert(probeSet instanceof WebInspector.ProbeSet, "Invalid ProbeSet argument:", probeSet);
</ins><span class="cx">
</span><del>- this._listeners = new WebInspector.EventListenerSet(this, "ProbeSetDetailsSection UI listeners");
- this._probeSet = probeSet;
</del><ins>+ var optionsElement = document.createElement("div");
+ optionsElement.classList.add(WebInspector.ProbeSetDetailsSection.SectionOptionsStyleClassName);
</ins><span class="cx">
</span><del>- var optionsElement = this._optionsElement = document.createElement("div");
- optionsElement.classList.add(WebInspector.ProbeSetDetailsSection.SectionOptionsStyleClassName);
</del><ins>+ var dataGrid = new WebInspector.ProbeSetDataGrid(probeSet);
</ins><span class="cx">
</span><del>- var removeProbeButton = optionsElement.createChild("img");
- removeProbeButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeRemoveStyleClassName);
- removeProbeButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeButtonEnabledStyleClassName);
- this._listeners.register(removeProbeButton, "click", this._removeButtonClicked);
</del><ins>+ var singletonRow = new WebInspector.DetailsSectionRow;
+ singletonRow.element.appendChild(dataGrid.element);
</ins><span class="cx">
</span><del>- var clearSamplesButton = optionsElement.createChild("img");
- clearSamplesButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeClearSamplesStyleClassName);
- clearSamplesButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeButtonEnabledStyleClassName);
- this._listeners.register(clearSamplesButton, "click", this._clearSamplesButtonClicked);
</del><ins>+ var probeSectionGroup = new WebInspector.DetailsSectionGroup([singletonRow]);
</ins><span class="cx">
</span><del>- var addProbeButton = optionsElement.createChild("img");
- addProbeButton.classList.add(WebInspector.ProbeSetDetailsSection.AddProbeValueStyleClassName);
- this._listeners.register(addProbeButton, "click", this._addProbeButtonClicked);
</del><ins>+ super("probe", "", [probeSectionGroup], optionsElement);
</ins><span class="cx">
</span><del>- // Update the source link when the breakpoint's resolved state changes,
- // so that it can become a live location link when possible.
- this._updateLinkElement();
- this._listeners.register(this._probeSet.breakpoint, WebInspector.Breakpoint.Event.ResolvedStateDidChange, this._updateLinkElement);
</del><ins>+ this.element.classList.add("probe-set");
</ins><span class="cx">
</span><del>- this._dataGrid = new WebInspector.ProbeSetDataGrid(probeSet);
- var singletonRow = new WebInspector.DetailsSectionRow;
- singletonRow.element.appendChild(this._dataGrid.element);
- var probeSectionGroup = new WebInspector.DetailsSectionGroup([singletonRow]);
</del><ins>+ this._optionsElement = optionsElement;
</ins><span class="cx">
</span><del>- var dummyTitle = "";
- WebInspector.DetailsSection.call(this, "probe", dummyTitle, [probeSectionGroup], optionsElement);
- this.element.classList.add(WebInspector.ProbeSetDetailsSection.StyleClassName);
</del><ins>+ this._listeners = new WebInspector.EventListenerSet(this, "ProbeSetDetailsSection UI listeners");
+ this._probeSet = probeSet;
+ this._dataGrid = dataGrid;
</ins><span class="cx">
</span><del>- this._listeners.install();
-};
</del><ins>+ var removeProbeButton = optionsElement.createChild("img");
+ removeProbeButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeRemoveStyleClassName);
+ removeProbeButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeButtonEnabledStyleClassName);
+ this._listeners.register(removeProbeButton, "click", this._removeButtonClicked);
</ins><span class="cx">
</span><del>-WebInspector.ProbeSetDetailsSection.AddProbeValueStyleClassName = "probe-add";
-WebInspector.ProbeSetDetailsSection.DontFloatLinkStyleClassName = "dont-float";
-WebInspector.ProbeSetDetailsSection.ProbeButtonEnabledStyleClassName = "enabled";
-WebInspector.ProbeSetDetailsSection.ProbePopoverElementStyleClassName = "probe-popover";
-WebInspector.ProbeSetDetailsSection.ProbeClearSamplesStyleClassName = "probe-clear-samples";
-WebInspector.ProbeSetDetailsSection.ProbeRemoveStyleClassName = "probe-remove";
-WebInspector.ProbeSetDetailsSection.SectionOptionsStyleClassName = "options";
-WebInspector.ProbeSetDetailsSection.StyleClassName = "probe-set";
</del><ins>+ var clearSamplesButton = optionsElement.createChild("img");
+ clearSamplesButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeClearSamplesStyleClassName);
+ clearSamplesButton.classList.add(WebInspector.ProbeSetDetailsSection.ProbeButtonEnabledStyleClassName);
+ this._listeners.register(clearSamplesButton, "click", this._clearSamplesButtonClicked);
</ins><span class="cx">
</span><del>-WebInspector.ProbeSetDetailsSection.prototype = {
- __proto__: WebInspector.DetailsSection.prototype,
- constructor: WebInspector.ProbeSetDetailsSection,
</del><ins>+ var addProbeButton = optionsElement.createChild("img");
+ addProbeButton.classList.add(WebInspector.ProbeSetDetailsSection.AddProbeValueStyleClassName);
+ this._listeners.register(addProbeButton, "click", this._addProbeButtonClicked);
</ins><span class="cx">
</span><ins>+ // Update the source link when the breakpoint's resolved state changes,
+ // so that it can become a live location link when possible.
+ this._updateLinkElement();
+ this._listeners.register(this._probeSet.breakpoint, WebInspector.Breakpoint.Event.ResolvedStateDidChange, this._updateLinkElement);
+
+ this._listeners.install();
+ }
+
</ins><span class="cx"> // Public
</span><span class="cx">
</span><del>- closed: function()
</del><ins>+ closed()
</ins><span class="cx"> {
</span><span class="cx"> this._listeners.uninstall(true);
</span><span class="cx"> this.element.remove();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _updateLinkElement: function()
</del><ins>+ _updateLinkElement()
</ins><span class="cx"> {
</span><span class="cx"> var breakpoint = this._probeSet.breakpoint;
</span><span class="cx"> var titleElement = null;
</span><span class="lines">@@ -108,9 +103,9 @@
</span><span class="cx">
</span><span class="cx"> this._linkElement = titleElement;
</span><span class="cx"> this._optionsElement.appendChild(this._linkElement);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _addProbeButtonClicked: function(event)
</del><ins>+ _addProbeButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> function createProbeFromEnteredExpression(visiblePopover, event)
</span><span class="cx"> {
</span><span class="lines">@@ -134,15 +129,24 @@
</span><span class="cx"> var target = WebInspector.Rect.rectFromClientRect(event.target.getBoundingClientRect());
</span><span class="cx"> popover.present(target, [WebInspector.RectEdge.MAX_Y, WebInspector.RectEdge.MIN_Y, WebInspector.RectEdge.MAX_X]);
</span><span class="cx"> textBox.select();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _removeButtonClicked: function(event)
</del><ins>+ _removeButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> this._probeSet.clear();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _clearSamplesButtonClicked: function(event)
</del><ins>+ _clearSamplesButtonClicked(event)
</ins><span class="cx"> {
</span><span class="cx"> this._probeSet.clearSamples();
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.ProbeSetDetailsSection.AddProbeValueStyleClassName = "probe-add";
+WebInspector.ProbeSetDetailsSection.DontFloatLinkStyleClassName = "dont-float";
+WebInspector.ProbeSetDetailsSection.ProbeButtonEnabledStyleClassName = "enabled";
+WebInspector.ProbeSetDetailsSection.ProbePopoverElementStyleClassName = "probe-popover";
+WebInspector.ProbeSetDetailsSection.ProbeClearSamplesStyleClassName = "probe-clear-samples";
+WebInspector.ProbeSetDetailsSection.ProbeRemoveStyleClassName = "probe-remove";
+WebInspector.ProbeSetDetailsSection.SectionOptionsStyleClassName = "options";
+WebInspector.ProbeSetDetailsSection.StyleClassName = "probe-set";
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsResizerjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Resizer.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/Resizer.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Resizer.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,4 +1,5 @@
</span><span class="cx"> /*
</span><ins>+ * Copyright (C) 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> * Copyright (C) 2015 University of Washington.
</span><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="lines">@@ -23,61 +24,49 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.Resizer = function(ruleOrientation, delegate) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.Resizer = class Resizer extends WebInspector.Object
+{
+ constructor(ruleOrientation, delegate)
+ {
+ console.assert(delegate);
</ins><span class="cx">
</span><del>- console.assert(delegate);
</del><ins>+ super();
</ins><span class="cx">
</span><del>- this._delegate = delegate;
- this._orientation = ruleOrientation;
- this._element = document.createElement("div");
- this._element.classList.add(WebInspector.Resizer.StyleClassName);
</del><ins>+ this._delegate = delegate;
+ this._orientation = ruleOrientation;
+ this._element = document.createElement("div");
+ this._element.classList.add("resizer");
</ins><span class="cx">
</span><del>- if (this._orientation === WebInspector.Resizer.RuleOrientation.Horizontal)
- this._element.classList.add(WebInspector.Resizer.HorizontalRuleStyleClassName);
- else if (this._orientation === WebInspector.Resizer.RuleOrientation.Vertical)
- this._element.classList.add(WebInspector.Resizer.VerticalRuleStyleClassName);
</del><ins>+ if (this._orientation === WebInspector.Resizer.RuleOrientation.Horizontal)
+ this._element.classList.add("horizontal-rule");
+ else if (this._orientation === WebInspector.Resizer.RuleOrientation.Vertical)
+ this._element.classList.add("vertical-rule");
</ins><span class="cx">
</span><del>- this._element.addEventListener("mousedown", this._resizerMouseDown.bind(this), false);
- this._resizerMouseMovedEventListener = this._resizerMouseMoved.bind(this);
- this._resizerMouseUpEventListener = this._resizerMouseUp.bind(this);
-};
</del><ins>+ this._element.addEventListener("mousedown", this._resizerMouseDown.bind(this), false);
+ this._resizerMouseMovedEventListener = this._resizerMouseMoved.bind(this);
+ this._resizerMouseUpEventListener = this._resizerMouseUp.bind(this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.Resizer.RuleOrientation = {
- Horizontal: Symbol("resizer-rule-orientation-horizontal"),
- Vertical: Symbol("resizer-rule-orientation-vertical"),
-};
-
-WebInspector.Resizer.StyleClassName = "resizer";
-WebInspector.Resizer.HorizontalRuleStyleClassName = "horizontal-rule";
-WebInspector.Resizer.VerticalRuleStyleClassName = "vertical-rule";
-WebInspector.Resizer.GlassPaneStyleClassName = "glass-pane-for-drag";
-
-WebInspector.Resizer.prototype = {
- constructor: WebInspector.Resizer,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get orientation()
</span><span class="cx"> {
</span><span class="cx"> return this._orientation;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get initialPosition()
</span><span class="cx"> {
</span><span class="cx"> return this._resizerMouseDownPosition || NaN;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _currentPosition: function()
</del><ins>+ _currentPosition()
</ins><span class="cx"> {
</span><span class="cx"> if (this._orientation === WebInspector.Resizer.RuleOrientation.Vertical)
</span><span class="cx"> return event.pageX;
</span><span class="lines">@@ -85,9 +74,9 @@
</span><span class="cx"> return event.pageY;
</span><span class="cx">
</span><span class="cx"> console.assert(false, "Should not be reached!");
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _resizerMouseDown: function(event)
</del><ins>+ _resizerMouseDown(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.button !== 0 || event.ctrlKey)
</span><span class="cx"> return;
</span><span class="lines">@@ -124,21 +113,21 @@
</span><span class="cx"> WebInspector._elementDraggingGlassPane.parentElement.removeChild(WebInspector._elementDraggingGlassPane);
</span><span class="cx">
</span><span class="cx"> var glassPaneElement = document.createElement("div");
</span><del>- glassPaneElement.className = WebInspector.Resizer.GlassPaneStyleClassName;
</del><ins>+ glassPaneElement.className = "glass-pane-for-drag";
</ins><span class="cx"> document.body.appendChild(glassPaneElement);
</span><span class="cx"> WebInspector._elementDraggingGlassPane = glassPaneElement;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _resizerMouseMoved: function(event)
</del><ins>+ _resizerMouseMoved(event)
</ins><span class="cx"> {
</span><span class="cx"> event.preventDefault();
</span><span class="cx"> event.stopPropagation();
</span><span class="cx">
</span><span class="cx"> if (typeof this._delegate.resizerDragging === "function")
</span><span class="cx"> this._delegate.resizerDragging(this, this._resizerMouseDownPosition - this._currentPosition());
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _resizerMouseUp: function(event)
</del><ins>+ _resizerMouseUp(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.button !== 0 || event.ctrlKey)
</span><span class="cx"> return;
</span><span class="lines">@@ -162,3 +151,8 @@
</span><span class="cx"> delete this._resizerMouseDownPosition;
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.Resizer.RuleOrientation = {
+ Horizontal: Symbol("resizer-rule-orientation-horizontal"),
+ Vertical: Symbol("resizer-rule-orientation-vertical"),
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsResourceTimelineDataGridNodePathComponentjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNodePathComponent.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,31 +23,31 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ResourceTimelineDataGridNodePathComponent = function(resourceTimelineDataGridNode) {
- var resource = resourceTimelineDataGridNode.record.resource;
- var classNames = [WebInspector.ResourceTreeElement.ResourceIconStyleClassName, resource.type];
</del><ins>+WebInspector.ResourceTimelineDataGridNodePathComponent = class ResourceTimelineDataGridNodePathComponent extends WebInspector.HierarchicalPathComponent
+{
+ constructor(resourceTimelineDataGridNode)
+ {
+ var resource = resourceTimelineDataGridNode.record.resource;
+ var classNames = [WebInspector.ResourceTreeElement.ResourceIconStyleClassName, resource.type];
</ins><span class="cx">
</span><del>- WebInspector.HierarchicalPathComponent.call(this, resourceTimelineDataGridNode.data.name, classNames, resource);
</del><ins>+ super(resourceTimelineDataGridNode.data.name, classNames, resource);
</ins><span class="cx">
</span><del>- this._resourceTimelineDataGridNode = resourceTimelineDataGridNode;
-};
</del><ins>+ this._resourceTimelineDataGridNode = resourceTimelineDataGridNode;
+ }
</ins><span class="cx">
</span><del>-WebInspector.ResourceTimelineDataGridNodePathComponent.prototype = {
- constructor: WebInspector.ResourceTimelineDataGridNodePathComponent,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get resourceTimelineDataGridNode()
</span><span class="cx"> {
</span><span class="cx"> return this._resourceTimelineDataGridNode;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get previousSibling()
</span><span class="cx"> {
</span><span class="cx"> if (!this._resourceTimelineDataGridNode.previousSibling)
</span><span class="cx"> return null;
</span><span class="cx"> return new WebInspector.ResourceTimelineDataGridNodePathComponent(this._resourceTimelineDataGridNode.previousSibling);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get nextSibling()
</span><span class="cx"> {
</span><span class="lines">@@ -56,5 +56,3 @@
</span><span class="cx"> return new WebInspector.ResourceTimelineDataGridNodePathComponent(this._resourceTimelineDataGridNode.nextSibling);
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.ResourceTimelineDataGridNodePathComponent.prototype.__proto__ = WebInspector.HierarchicalPathComponent.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsScopeBarjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,53 +23,48 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ScopeBar = function(identifier, items, defaultItem) {
- WebInspector.NavigationItem.call(this, identifier);
</del><ins>+WebInspector.ScopeBar = class ScopeBar extends WebInspector.NavigationItem
+{
+ constructor(identifier, items, defaultItem)
+ {
+ super(identifier);
</ins><span class="cx">
</span><del>- this._element.classList.add(WebInspector.ScopeBar.StyleClassName);
</del><ins>+ this._element.classList.add("scope-bar");
</ins><span class="cx">
</span><del>- this._items = items;
- this._defaultItem = defaultItem;
</del><ins>+ this._items = items;
+ this._defaultItem = defaultItem;
</ins><span class="cx">
</span><del>- this._itemsById = [];
- this._populate();
-};
</del><ins>+ this._itemsById = [];
+ this._populate();
+ }
</ins><span class="cx">
</span><del>-WebInspector.ScopeBar.StyleClassName = "scope-bar";
-WebInspector.ScopeBar.Event = {
- SelectionChanged: "scopebar-selection-did-change"
-};
-
-WebInspector.ScopeBar.prototype = {
- constructor: WebInspector.ScopeBar,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get defaultItem()
</span><span class="cx"> {
</span><span class="cx"> return this._defaultItem;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- item: function(id)
</del><ins>+ item(id)
</ins><span class="cx"> {
</span><span class="cx"> return this._itemsById[id];
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selectedItems()
</span><span class="cx"> {
</span><span class="cx"> return this._items.filter(function(item) {
</span><span class="cx"> return item.selected;
</span><span class="cx"> });
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- hasNonDefaultItemSelected: function()
</del><ins>+ hasNonDefaultItemSelected()
</ins><span class="cx"> {
</span><span class="cx"> return this._items.some(function(item) {
</span><span class="cx"> return item.selected && item !== this._defaultItem;
</span><span class="cx"> }, this);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- updateLayout: function(expandOnly)
</del><ins>+ updateLayout(expandOnly)
</ins><span class="cx"> {
</span><span class="cx"> if (expandOnly)
</span><span class="cx"> return;
</span><span class="lines">@@ -88,11 +83,11 @@
</span><span class="cx"> if (!isSelected)
</span><span class="cx"> item.element.classList.remove(WebInspector.ScopeBarItem.SelectedStyleClassName);
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _populate: function()
</del><ins>+ _populate()
</ins><span class="cx"> {
</span><span class="cx"> var item;
</span><span class="cx"> for (var i = 0; i < this._items.length; ++i) {
</span><span class="lines">@@ -105,9 +100,9 @@
</span><span class="cx">
</span><span class="cx"> if (!this.selectedItems.length && this._defaultItem)
</span><span class="cx"> this._defaultItem.selected = true;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _itemSelectionDidChange: function(event)
</del><ins>+ _itemSelectionDidChange(event)
</ins><span class="cx"> {
</span><span class="cx"> var sender = event.target;
</span><span class="cx"> var item;
</span><span class="lines">@@ -138,4 +133,6 @@
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.ScopeBar.prototype.__proto__ = WebInspector.NavigationItem.prototype;
</del><ins>+WebInspector.ScopeBar.Event = {
+ SelectionChanged: "scopebar-selection-did-change"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsScopeBarItemjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBarItem.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBarItem.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBarItem.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,27 +23,21 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.ScopeBarItem = function(id, label, isExclusive) {
- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+WebInspector.ScopeBarItem = class ScopeBarItem extends WebInspector.Object
+{
+ constructor(id, label, isExclusive)
+ {
+ super();
</ins><span class="cx">
</span><del>- this.id = id;
- this.label = label;
- this.isExclusive = isExclusive;
</del><ins>+ this.id = id;
+ this.label = label;
+ this.isExclusive = isExclusive;
</ins><span class="cx">
</span><del>- this._selectedSetting = new WebInspector.Setting("scopebaritem-" + id, false);
</del><ins>+ this._selectedSetting = new WebInspector.Setting("scopebaritem-" + id, false);
</ins><span class="cx">
</span><del>- this._markElementSelected(this._selectedSetting.value);
-};
</del><ins>+ this._markElementSelected(this._selectedSetting.value);
+ }
</ins><span class="cx">
</span><del>-WebInspector.ScopeBarItem.SelectedStyleClassName = "selected";
-WebInspector.ScopeBarItem.Event = {
- SelectionChanged: "scope-bar-item-selection-did-change"
-};
-
-WebInspector.ScopeBarItem.prototype = {
- constructor: WebInspector.ScopeBarItem,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="lines">@@ -54,19 +48,19 @@
</span><span class="cx"> this._element.addEventListener("click", this._clicked.bind(this), false);
</span><span class="cx"> }
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get selected()
</span><span class="cx"> {
</span><span class="cx"> return this._selectedSetting.value;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set selected(selected)
</span><span class="cx"> {
</span><span class="cx"> this.setSelected(selected, false);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- setSelected: function(selected, withModifier)
</del><ins>+ setSelected(selected, withModifier)
</ins><span class="cx"> {
</span><span class="cx"> if (this._selectedSetting.value === selected)
</span><span class="cx"> return;
</span><span class="lines">@@ -76,23 +70,27 @@
</span><span class="cx"> this._selectedSetting.value = selected;
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.ScopeBarItem.Event.SelectionChanged, {withModifier});
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _markElementSelected: function(selected)
</del><ins>+ _markElementSelected(selected)
</ins><span class="cx"> {
</span><span class="cx"> if (selected)
</span><span class="cx"> this.element.classList.add(WebInspector.ScopeBarItem.SelectedStyleClassName);
</span><span class="cx"> else
</span><span class="cx"> this.element.classList.remove(WebInspector.ScopeBarItem.SelectedStyleClassName);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _clicked: function(event)
</del><ins>+ _clicked(event)
</ins><span class="cx"> {
</span><span class="cx"> var withModifier = (event.metaKey && !event.ctrlKey && !event.altKey && !event.shiftKey);
</span><span class="cx"> this.setSelected(!this.selected, withModifier);
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.ScopeBarItem.prototype.__proto__ = WebInspector.Object.prototype;
</del><ins>+WebInspector.ScopeBarItem.SelectedStyleClassName = "selected";
+
+WebInspector.ScopeBarItem.Event = {
+ SelectionChanged: "scope-bar-item-selection-did-change"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsSearchBarjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SearchBar.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/SearchBar.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SearchBar.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,61 +23,56 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.SearchBar = function(identifier, placeholder, delegate) {
- WebInspector.NavigationItem.call(this, identifier);
</del><ins>+WebInspector.SearchBar = class SearchBar extends WebInspector.NavigationItem
+{
+ constructor(identifier, placeholder, delegate)
+ {
+ super(identifier);
</ins><span class="cx">
</span><del>- this.delegate = delegate;
</del><ins>+ this.delegate = delegate;
</ins><span class="cx">
</span><del>- this._element.classList.add(WebInspector.SearchBar.StyleClassName);
</del><ins>+ this._element.classList.add("search-bar");
</ins><span class="cx">
</span><del>- this._keyboardShortcutEsc = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Escape);
- this._keyboardShortcutEnter = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Enter);
</del><ins>+ this._keyboardShortcutEsc = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Escape);
+ this._keyboardShortcutEnter = new WebInspector.KeyboardShortcut(null, WebInspector.KeyboardShortcut.Key.Enter);
</ins><span class="cx">
</span><del>- this._searchInput = this._element.appendChild(document.createElement("input"));
- this._searchInput.type = "search";
- this._searchInput.spellcheck = false;
- this._searchInput.incremental = true;
- this._searchInput.setAttribute("results", 5);
- this._searchInput.setAttribute("autosave", identifier + "-autosave");
- this._searchInput.setAttribute("placeholder", placeholder);
- this._searchInput.addEventListener("search", this._handleSearchEvent.bind(this), false);
- this._searchInput.addEventListener("keydown", this._handleKeydownEvent.bind(this), false);
-};
</del><ins>+ this._searchInput = this._element.appendChild(document.createElement("input"));
+ this._searchInput.type = "search";
+ this._searchInput.spellcheck = false;
+ this._searchInput.incremental = true;
+ this._searchInput.setAttribute("results", 5);
+ this._searchInput.setAttribute("autosave", identifier + "-autosave");
+ this._searchInput.setAttribute("placeholder", placeholder);
+ this._searchInput.addEventListener("search", this._handleSearchEvent.bind(this));
+ this._searchInput.addEventListener("keydown", this._handleKeydownEvent.bind(this));
+ }
</ins><span class="cx">
</span><del>-WebInspector.SearchBar.StyleClassName = "search-bar";
-WebInspector.SearchBar.Event = {
- TextChanged: "searchbar-text-did-change"
-};
-
-WebInspector.SearchBar.prototype = {
- constructor: WebInspector.SearchBar,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get text()
</span><span class="cx"> {
</span><span class="cx"> return this._searchInput.value;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set text(newText)
</span><span class="cx"> {
</span><span class="cx"> this._searchInput.value = newText;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- focus: function()
</del><ins>+ focus()
</ins><span class="cx"> {
</span><span class="cx"> this._searchInput.focus();
</span><span class="cx"> this._searchInput.select();
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _handleSearchEvent: function(event)
</del><ins>+ _handleSearchEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.SearchBar.Event.TextChanged);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleKeydownEvent: function(event)
</del><ins>+ _handleKeydownEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> if (this._keyboardShortcutEsc.matchesEvent(event)) {
</span><span class="cx"> if (this.delegate && typeof this.delegate.searchBarWantsToLoseFocus === "function") {
</span><span class="lines">@@ -95,4 +90,6 @@
</span><span class="cx"> }
</span><span class="cx"> };
</span><span class="cx">
</span><del>-WebInspector.SearchBar.prototype.__proto__ = WebInspector.NavigationItem.prototype;
</del><ins>+WebInspector.SearchBar.Event = {
+ TextChanged: "searchbar-text-did-change"
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsSliderjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,37 +23,35 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.Slider = function()
</del><ins>+WebInspector.Slider = class Slider extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- this._element = document.createElement("div");
- this._element.className = "slider";
</del><ins>+ constructor()
+ {
+ super();
</ins><span class="cx">
</span><del>- this._knob = this._element.appendChild(document.createElement("img"));
</del><ins>+ this._element = document.createElement("div");
+ this._element.className = "slider";
</ins><span class="cx">
</span><del>- this._value = 0;
- this._knobX = 0;
- this.__maxX = 0;
</del><ins>+ this._knob = this._element.appendChild(document.createElement("img"));
</ins><span class="cx">
</span><del>- this._element.addEventListener("mousedown", this);
-};
</del><ins>+ this._value = 0;
+ this._knobX = 0;
+ this.__maxX = 0;
</ins><span class="cx">
</span><del>-WebInspector.Slider.KnobWidth = 13;
</del><ins>+ this._element.addEventListener("mousedown", this);
+ }
</ins><span class="cx">
</span><del>-WebInspector.Slider.prototype = {
- contructor: WebInspector.Slider,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><span class="cx"> get element()
</span><span class="cx"> {
</span><span class="cx"> return this._element;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get value()
</span><span class="cx"> {
</span><span class="cx"> return this._value;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> set value(value)
</span><span class="cx"> {
</span><span class="lines">@@ -69,11 +67,11 @@
</span><span class="cx">
</span><span class="cx"> if (this.delegate && typeof this.delegate.sliderValueDidChange === "function")
</span><span class="cx"> this.delegate.sliderValueDidChange(this, value);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Protected
</span><span class="cx">
</span><del>- handleEvent: function(event)
</del><ins>+ handleEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> switch (event.type) {
</span><span class="cx"> case "mousedown":
</span><span class="lines">@@ -86,11 +84,11 @@
</span><span class="cx"> this._handleMouseup(event);
</span><span class="cx"> break;
</span><span class="cx"> }
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _handleMousedown: function(event)
</del><ins>+ _handleMousedown(event)
</ins><span class="cx"> {
</span><span class="cx"> if (event.target !== this._knob)
</span><span class="cx"> this.value = (this._localPointForEvent(event).x - 3) / this._maxX;
</span><span class="lines">@@ -102,30 +100,30 @@
</span><span class="cx">
</span><span class="cx"> window.addEventListener("mousemove", this, true);
</span><span class="cx"> window.addEventListener("mouseup", this, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMousemove: function(event)
</del><ins>+ _handleMousemove(event)
</ins><span class="cx"> {
</span><span class="cx"> var dx = this._localPointForEvent(event).x - this._startMouseX;
</span><span class="cx"> var x = Math.max(Math.min(this._startKnobX + dx, this._maxX), 0);
</span><span class="cx">
</span><span class="cx"> this.value = x / this._maxX;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _handleMouseup: function(event)
</del><ins>+ _handleMouseup(event)
</ins><span class="cx"> {
</span><span class="cx"> this._element.classList.remove("dragging");
</span><span class="cx">
</span><span class="cx"> window.removeEventListener("mousemove", this, true);
</span><span class="cx"> window.removeEventListener("mouseup", this, true);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _localPointForEvent: function(event)
</del><ins>+ _localPointForEvent(event)
</ins><span class="cx"> {
</span><span class="cx"> // We convert all event coordinates from page coordinates to local coordinates such that the slider
</span><span class="cx"> // may be transformed using CSS Transforms and interaction works as expected.
</span><span class="cx"> return window.webkitConvertPointFromPageToNode(this._element, new WebKitPoint(event.pageX, event.pageY));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> get _maxX()
</span><span class="cx"> {
</span><span class="lines">@@ -135,3 +133,5 @@
</span><span class="cx"> return this.__maxX;
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.Slider.KnobWidth = 13;
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTypeTokenViewjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TypeTokenView.js (182039 => 182040)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TypeTokenView.js 2015-03-26 23:37:30 UTC (rev 182039)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TypeTokenView.js 2015-03-26 23:37:45 UTC (rev 182040)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2014 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,72 +23,52 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.TypeTokenView = function(tokenAnnotator, shouldHaveRightMargin, shouldHaveLeftMargin, titleType, functionOrVariableName)
</del><ins>+WebInspector.TypeTokenView = class TypeTokenView extends WebInspector.Object
</ins><span class="cx"> {
</span><del>- console.assert(titleType === WebInspector.TypeTokenView.TitleType.Variable || titleType === WebInspector.TypeTokenView.TitleType.ReturnStatement);
</del><ins>+ constructor(tokenAnnotator, shouldHaveRightMargin, shouldHaveLeftMargin, titleType, functionOrVariableName)
+ {
+ console.assert(titleType === WebInspector.TypeTokenView.TitleType.Variable || titleType === WebInspector.TypeTokenView.TitleType.ReturnStatement);
</ins><span class="cx">
</span><del>- // FIXME: Convert this to a WebInspector.Object subclass, and call super().
- // WebInspector.Object.call(this);
</del><ins>+ super();
</ins><span class="cx">
</span><del>- var span = document.createElement("span");
- span.classList.add("type-token");
- if (shouldHaveRightMargin)
- span.classList.add("type-token-right-spacing");
- if (shouldHaveLeftMargin)
- span.classList.add("type-token-left-spacing");
</del><ins>+ var span = document.createElement("span");
+ span.classList.add("type-token");
+ if (shouldHaveRightMargin)
+ span.classList.add("type-token-right-spacing");
+ if (shouldHaveLeftMargin)
+ span.classList.add("type-token-left-spacing");
</ins><span class="cx">
</span><del>- this.element = span;
- this._tokenAnnotator = tokenAnnotator;
- this._types = null;
- this._typeSet = null;
- this._colorClass = null;
</del><ins>+ this.element = span;
+ this._tokenAnnotator = tokenAnnotator;
+ this._types = null;
+ this._typeSet = null;
+ this._colorClass = null;
</ins><span class="cx">
</span><del>- this._popoverTitle = WebInspector.TypeTokenView.titleForPopover(titleType, functionOrVariableName);
</del><ins>+ this._popoverTitle = WebInspector.TypeTokenView.titleForPopover(titleType, functionOrVariableName);
</ins><span class="cx">
</span><del>- this._setUpMouseoverHandlers();
-};
-
-WebInspector.TypeTokenView.titleForPopover = function(titleType, functionOrVariableName)
-{
- var titleString = null;
- if (titleType === WebInspector.TypeTokenView.TitleType.Variable)
- titleString = WebInspector.UIString("Type information for variable: %s").format(functionOrVariableName);
- else {
- if (functionOrVariableName)
- titleString = WebInspector.UIString("Return type for function: %s").format(functionOrVariableName);
- else
- titleString = WebInspector.UIString("Return type for anonymous function");
</del><ins>+ this._setUpMouseoverHandlers();
</ins><span class="cx"> }
</span><span class="cx">
</span><del>- return titleString;
-};
</del><ins>+ // Static
</ins><span class="cx">
</span><del>-WebInspector.TypeTokenView.TitleType = {
- Variable: "title-type-variable",
- ReturnStatement: "title-type-return-statement"
-};
</del><ins>+ static titleForPopover(titleType, functionOrVariableName)
+ {
+ var titleString = null;
+ if (titleType === WebInspector.TypeTokenView.TitleType.Variable)
+ titleString = WebInspector.UIString("Type information for variable: %s").format(functionOrVariableName);
+ else {
+ if (functionOrVariableName)
+ titleString = WebInspector.UIString("Return type for function: %s").format(functionOrVariableName);
+ else
+ titleString = WebInspector.UIString("Return type for anonymous function");
+ }
</ins><span class="cx">
</span><del>-WebInspector.TypeTokenView.ColorClassForType = {
- "String": "type-token-string",
- "Function": "type-token-function",
- "Number": "type-token-number",
- "Integer": "type-token-number",
- "Undefined": "type-token-empty",
- "Null": "type-token-empty",
- "(?)": "type-token-empty",
- "Boolean": "type-token-boolean",
- "(many)": "type-token-many"
-};
</del><ins>+ return titleString;
+ }
</ins><span class="cx">
</span><del>-WebInspector.TypeTokenView.DelayHoverTime = 350;
-
-WebInspector.TypeTokenView.prototype = {
- constructor: WebInspector.TypeTokenView,
- __proto__: WebInspector.Object.prototype,
-
</del><span class="cx"> // Public
</span><span class="cx">
</span><del>- update: function(types)
</del><ins>+ update(types)
</ins><span class="cx"> {
</span><span class="cx"> this._types = types;
</span><span class="cx"> this._typeSet = WebInspector.TypeSet.fromPayload(this._types);
</span><span class="lines">@@ -105,11 +85,11 @@
</span><span class="cx">
</span><span class="cx"> this._colorClass = WebInspector.TypeTokenView.ColorClassForType[hashString] || "type-token-default";
</span><span class="cx"> this.element.classList.add(this._colorClass);
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><span class="cx"> // Private
</span><span class="cx">
</span><del>- _setUpMouseoverHandlers: function()
</del><ins>+ _setUpMouseoverHandlers()
</ins><span class="cx"> {
</span><span class="cx"> var timeoutID = null;
</span><span class="cx">
</span><span class="lines">@@ -131,9 +111,9 @@
</span><span class="cx"> if (timeoutID)
</span><span class="cx"> clearTimeout(timeoutID);
</span><span class="cx"> }.bind(this));
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _shouldShowPopover: function()
</del><ins>+ _shouldShowPopover()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._types.isValid)
</span><span class="cx"> return false;
</span><span class="lines">@@ -145,9 +125,9 @@
</span><span class="cx"> return true;
</span><span class="cx">
</span><span class="cx"> return false;
</span><del>- },
</del><ins>+ }
</ins><span class="cx">
</span><del>- _displayTypeName: function()
</del><ins>+ _displayTypeName()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._types.isValid)
</span><span class="cx"> return "";
</span><span class="lines">@@ -203,3 +183,22 @@
</span><span class="cx"> return WebInspector.UIString("(many)");
</span><span class="cx"> }
</span><span class="cx"> };
</span><ins>+
+WebInspector.TypeTokenView.TitleType = {
+ Variable: Symbol("title-type-variable"),
+ ReturnStatement: Symbol("title-type-return-statement")
+};
+
+WebInspector.TypeTokenView.ColorClassForType = {
+ "String": "type-token-string",
+ "Function": "type-token-function",
+ "Number": "type-token-number",
+ "Integer": "type-token-number",
+ "Undefined": "type-token-empty",
+ "Null": "type-token-empty",
+ "(?)": "type-token-empty",
+ "Boolean": "type-token-boolean",
+ "(many)": "type-token-many"
+};
+
+WebInspector.TypeTokenView.DelayHoverTime = 350;
</ins></span></pre>
</div>
</div>
</body>
</html>