Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(299)

Unified Diff: third_party/WebKit/Source/devtools/front_end/elements/PropertyChangeHighlighter.js

Issue 2466123002: DevTools: reformat front-end code to match chromium style. (Closed)
Patch Set: all done Created 4 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/Source/devtools/front_end/elements/PropertyChangeHighlighter.js
diff --git a/third_party/WebKit/Source/devtools/front_end/elements/PropertyChangeHighlighter.js b/third_party/WebKit/Source/devtools/front_end/elements/PropertyChangeHighlighter.js
index 303df99a7677afa1e9c568366006c11ea96b1390..bc8adef6e661a7f5cb3478a8c9e883ada567ef05 100644
--- a/third_party/WebKit/Source/devtools/front_end/elements/PropertyChangeHighlighter.js
+++ b/third_party/WebKit/Source/devtools/front_end/elements/PropertyChangeHighlighter.js
@@ -1,138 +1,144 @@
// Copyright (c) 2015 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
-
/**
- * @constructor
- * @param {!WebInspector.StylesSidebarPane} ssp
- * @param {!WebInspector.CSSModel} cssModel
- * @param {!CSSAgent.StyleSheetId} styleSheetId
- * @param {!WebInspector.TextRange} range
+ * @unrestricted
*/
-WebInspector.PropertyChangeHighlighter = function(ssp, cssModel, styleSheetId, range)
-{
+WebInspector.PropertyChangeHighlighter = class {
+ /**
+ * @param {!WebInspector.StylesSidebarPane} ssp
+ * @param {!WebInspector.CSSModel} cssModel
+ * @param {!CSSAgent.StyleSheetId} styleSheetId
+ * @param {!WebInspector.TextRange} range
+ */
+ constructor(ssp, cssModel, styleSheetId, range) {
this._styleSidebarPane = ssp;
this._target = cssModel.target();
this._styleSheetId = styleSheetId;
this._range = range;
-};
+ }
-WebInspector.PropertyChangeHighlighter.prototype = {
- /**
- */
- perform: function()
- {
- var node = this._styleSidebarPane.node();
- if (!node || this._target !== node.target())
- return;
+ /**
+ */
+ perform() {
+ var node = this._styleSidebarPane.node();
+ if (!node || this._target !== node.target())
+ return;
- var foundSection = null;
- for (var section of this._styleSidebarPane.allSections()) {
- var declaration = section.style();
- if (declaration.styleSheetId !== this._styleSheetId)
- continue;
+ var foundSection = null;
+ for (var section of this._styleSidebarPane.allSections()) {
+ var declaration = section.style();
+ if (declaration.styleSheetId !== this._styleSheetId)
+ continue;
- var parentRule = declaration.parentRule;
- var isInlineSelector = this._range.isEmpty();
- var isMatchingRule = parentRule && parentRule.selectorRange() && this._range.compareTo(parentRule.selectorRange()) === 0;
- if (isInlineSelector || isMatchingRule) {
- section.element.animate([
- { offset: 0, backgroundColor: "rgba(255, 227, 199, 1)" },
- { offset: 0.5, backgroundColor: "rgba(255, 227, 199, 1)" },
- { offset: 0.9, backgroundColor: "rgba(255, 227, 199, 0)" },
- { offset: 1, backgroundColor: "white" }
- ], { duration : 400, easing: "cubic-bezier(0, 0, 0.2, 1)" });
- return;
- }
-
- if (this._checkRanges(declaration.range, this._range)) {
- foundSection = section;
- break;
- }
- }
+ var parentRule = declaration.parentRule;
+ var isInlineSelector = this._range.isEmpty();
+ var isMatchingRule =
+ parentRule && parentRule.selectorRange() && this._range.compareTo(parentRule.selectorRange()) === 0;
+ if (isInlineSelector || isMatchingRule) {
+ section.element.animate(
+ [
+ {offset: 0, backgroundColor: 'rgba(255, 227, 199, 1)'},
+ {offset: 0.5, backgroundColor: 'rgba(255, 227, 199, 1)'},
+ {offset: 0.9, backgroundColor: 'rgba(255, 227, 199, 0)'}, {offset: 1, backgroundColor: 'white'}
+ ],
+ {duration: 400, easing: 'cubic-bezier(0, 0, 0.2, 1)'});
+ return;
+ }
- if (!foundSection)
- return;
+ if (this._checkRanges(declaration.range, this._range)) {
+ foundSection = section;
+ break;
+ }
+ }
- var highlightElement;
- var treeElement = foundSection.propertiesTreeOutline.firstChild();
- var foundTreeElement = null;
- while (!highlightElement && treeElement) {
- if (treeElement.property.range && this._checkRanges(treeElement.property.range, this._range)) {
- highlightElement = treeElement.valueElement;
- break;
- }
- treeElement = treeElement.traverseNextTreeElement(false, null, true);
- }
+ if (!foundSection)
+ return;
- if (highlightElement) {
- highlightElement.animate([
- { offset: 0, backgroundColor: "rgba(158, 54, 153, 1)", color: "white" },
- { offset: 0.5, backgroundColor: "rgba(158, 54, 153, 1)", color: "white" },
- { offset: 0.9, backgroundColor: "rgba(158, 54, 153, 0)", color: "initial" },
- { offset: 1, backgroundColor: "white", color: "initial" }
- ], { duration : 400, easing: "cubic-bezier(0, 0, 0.2, 1)" });
- }
- },
+ var highlightElement;
+ var treeElement = foundSection.propertiesTreeOutline.firstChild();
+ var foundTreeElement = null;
+ while (!highlightElement && treeElement) {
+ if (treeElement.property.range && this._checkRanges(treeElement.property.range, this._range)) {
+ highlightElement = treeElement.valueElement;
+ break;
+ }
+ treeElement = treeElement.traverseNextTreeElement(false, null, true);
+ }
- /**
- *
- * @param {!WebInspector.TextRange} outterRange
- * @param {!WebInspector.TextRange} innerRange
- * @return {boolean}
- */
- _checkRanges: function(outterRange, innerRange)
- {
- var startsBefore = outterRange.startLine < innerRange.startLine || (outterRange.startLine === innerRange.startLine && outterRange.startColumn <= innerRange.startColumn);
- // SSP might be outdated, so inner range will a bit bigger than outter. E.g.; "padding-left: 9px" -> "padding-left: 10px"
- var eps = 5;
- var endsAfter = outterRange.endLine > innerRange.endLine || (outterRange.endLine === innerRange.endLine && outterRange.endColumn + eps >= innerRange.endColumn);
- return startsBefore && endsAfter;
+ if (highlightElement) {
+ highlightElement.animate(
+ [
+ {offset: 0, backgroundColor: 'rgba(158, 54, 153, 1)', color: 'white'},
+ {offset: 0.5, backgroundColor: 'rgba(158, 54, 153, 1)', color: 'white'},
+ {offset: 0.9, backgroundColor: 'rgba(158, 54, 153, 0)', color: 'initial'},
+ {offset: 1, backgroundColor: 'white', color: 'initial'}
+ ],
+ {duration: 400, easing: 'cubic-bezier(0, 0, 0.2, 1)'});
}
+ }
+
+ /**
+ *
+ * @param {!WebInspector.TextRange} outterRange
+ * @param {!WebInspector.TextRange} innerRange
+ * @return {boolean}
+ */
+ _checkRanges(outterRange, innerRange) {
+ var startsBefore = outterRange.startLine < innerRange.startLine ||
+ (outterRange.startLine === innerRange.startLine && outterRange.startColumn <= innerRange.startColumn);
+ // SSP might be outdated, so inner range will a bit bigger than outter. E.g.; "padding-left: 9px" -> "padding-left: 10px"
+ var eps = 5;
+ var endsAfter = outterRange.endLine > innerRange.endLine ||
+ (outterRange.endLine === innerRange.endLine && outterRange.endColumn + eps >= innerRange.endColumn);
+ return startsBefore && endsAfter;
+ }
};
/**
- * @constructor
- * @param {!WebInspector.StylesSidebarPane} ssp
- * @param {!WebInspector.CSSProperty} cssProperty
+ * @unrestricted
*/
-WebInspector.PropertyRevealHighlighter = function(ssp, cssProperty)
-{
+WebInspector.PropertyRevealHighlighter = class {
+ /**
+ * @param {!WebInspector.StylesSidebarPane} ssp
+ * @param {!WebInspector.CSSProperty} cssProperty
+ */
+ constructor(ssp, cssProperty) {
this._styleSidebarPane = ssp;
this._cssProperty = cssProperty;
-};
+ }
-WebInspector.PropertyRevealHighlighter.prototype = {
- perform: function()
- {
- // Expand all shorthands.
- for (var section of this._styleSidebarPane.allSections()) {
- for (var treeElement = section.propertiesTreeOutline.firstChild(); treeElement; treeElement = treeElement.nextSibling)
- treeElement.onpopulate();
- }
- var highlightTreeElement = null;
- for (var section of this._styleSidebarPane.allSections()) {
- var treeElement = section.propertiesTreeOutline.firstChild();
- while (treeElement && !highlightTreeElement) {
- if (treeElement.property === this._cssProperty) {
- highlightTreeElement = treeElement;
- break;
- }
- treeElement = treeElement.traverseNextTreeElement(false, null, true);
- }
- if (highlightTreeElement)
- break;
+ perform() {
+ // Expand all shorthands.
+ for (var section of this._styleSidebarPane.allSections()) {
+ for (var treeElement = section.propertiesTreeOutline.firstChild(); treeElement;
+ treeElement = treeElement.nextSibling)
+ treeElement.onpopulate();
+ }
+ var highlightTreeElement = null;
+ for (var section of this._styleSidebarPane.allSections()) {
+ var treeElement = section.propertiesTreeOutline.firstChild();
+ while (treeElement && !highlightTreeElement) {
+ if (treeElement.property === this._cssProperty) {
+ highlightTreeElement = treeElement;
+ break;
}
+ treeElement = treeElement.traverseNextTreeElement(false, null, true);
+ }
+ if (highlightTreeElement)
+ break;
+ }
- if (!highlightTreeElement)
- return;
+ if (!highlightTreeElement)
+ return;
- highlightTreeElement.parent.expand();
- highlightTreeElement.listItemElement.scrollIntoViewIfNeeded();
- highlightTreeElement.listItemElement.animate([
- { offset: 0, backgroundColor: "rgba(255, 255, 0, 0.2)"},
- { offset: 0.1, backgroundColor: "rgba(255, 255, 0, 0.7)"},
- { offset: 1, backgroundColor: "transparent"}
- ], { duration : 2000, easing: "cubic-bezier(0, 0, 0.2, 1)" });
- },
+ highlightTreeElement.parent.expand();
+ highlightTreeElement.listItemElement.scrollIntoViewIfNeeded();
+ highlightTreeElement.listItemElement.animate(
+ [
+ {offset: 0, backgroundColor: 'rgba(255, 255, 0, 0.2)'},
+ {offset: 0.1, backgroundColor: 'rgba(255, 255, 0, 0.7)'}, {offset: 1, backgroundColor: 'transparent'}
+ ],
+ {duration: 2000, easing: 'cubic-bezier(0, 0, 0.2, 1)'});
+ }
};

Powered by Google App Engine
This is Rietveld 408576698