DevTools: reformat front-end code to match chromium style.

third_party/WebKit/Source/devtools/front_end/elements/PropertyChangeHighlighter.js

 // 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;
-            }
+      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;
-            }
-        }
+      if (this._checkRanges(declaration.range, this._range)) {
+        foundSection = section;
+        break;
+      }
+    }
 
-        if (!foundSection)
-            return;
+    if (!foundSection)
+      return;
 
-        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);
-        }
+    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 (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)" });
-        }
-    },
+    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: 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;
-    }
+  /**
+   *
+   * @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;
+  }
+
+  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;
+
+    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)'});
+  }
 };
-
-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;
-        }
-
-        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)" });
-    },
-};