DevTools: rename WebInspector into modules.

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

 /*
  * Copyright (C) 2007 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 12 matching lines @@
  * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
  * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
  * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
 /**
  * @unrestricted
  */
-WebInspector.ComputedStyleWidget = class extends WebInspector.ThrottledWidget {
+Elements.ComputedStyleWidget = class extends UI.ThrottledWidget {
   constructor() {
     super();
     this.element.classList.add('computed-style-sidebar-pane');
 
     this.registerRequiredCSS('elements/computedStyleSidebarPane.css');
     this._alwaysShowComputedProperties = {'display': true, 'height': true, 'width': true};
 
-    this._computedStyleModel = new WebInspector.ComputedStyleModel();
+    this._computedStyleModel = new Elements.ComputedStyleModel();
     this._computedStyleModel.addEventListener(
-        WebInspector.ComputedStyleModel.Events.ComputedStyleChanged, this.update, this);
+        Elements.ComputedStyleModel.Events.ComputedStyleChanged, this.update, this);
 
     this._showInheritedComputedStylePropertiesSetting =
-        WebInspector.settings.createSetting('showInheritedComputedStyleProperties', false);
+        Common.settings.createSetting('showInheritedComputedStyleProperties', false);
     this._showInheritedComputedStylePropertiesSetting.addChangeListener(
         this._showInheritedComputedStyleChanged.bind(this));
 
     var hbox = this.element.createChild('div', 'hbox styles-sidebar-pane-toolbar');
     var filterContainerElement = hbox.createChild('div', 'styles-sidebar-pane-filter-box');
-    var filterInput = WebInspector.StylesSidebarPane.createPropertyFilterElement(
-        WebInspector.UIString('Filter'), hbox, filterCallback.bind(this));
+    var filterInput = Elements.StylesSidebarPane.createPropertyFilterElement(
+        Common.UIString('Filter'), hbox, filterCallback.bind(this));
     filterContainerElement.appendChild(filterInput);
 
-    var toolbar = new WebInspector.Toolbar('styles-pane-toolbar', hbox);
-    toolbar.appendToolbarItem(new WebInspector.ToolbarCheckbox(
-        WebInspector.UIString('Show all'), undefined, this._showInheritedComputedStylePropertiesSetting));
+    var toolbar = new UI.Toolbar('styles-pane-toolbar', hbox);
+    toolbar.appendToolbarItem(new UI.ToolbarCheckbox(
+        Common.UIString('Show all'), undefined, this._showInheritedComputedStylePropertiesSetting));
 
     this._propertiesOutline = new TreeOutlineInShadow();
     this._propertiesOutline.hideOverflow();
     this._propertiesOutline.registerRequiredCSS('elements/computedStyleSidebarPane.css');
     this._propertiesOutline.element.classList.add('monospace', 'computed-properties');
     this.element.appendChild(this._propertiesOutline.element);
 
-    this._linkifier = new WebInspector.Linkifier(WebInspector.ComputedStyleWidget._maxLinkLength);
+    this._linkifier = new Components.Linkifier(Elements.ComputedStyleWidget._maxLinkLength);
 
     /**
      * @param {?RegExp} regex
-     * @this {WebInspector.ComputedStyleWidget}
+     * @this {Elements.ComputedStyleWidget}
      */
     function filterCallback(regex) {
       this._filterRegex = regex;
       this._updateFilter(regex);
     }
 
-    var fontsWidget = new WebInspector.PlatformFontsWidget(this._computedStyleModel);
+    var fontsWidget = new Elements.PlatformFontsWidget(this._computedStyleModel);
     fontsWidget.show(this.element);
   }
 
   _showInheritedComputedStyleChanged() {
     this.update();
   }
 
   /**
    * @override
    * @return {!Promise.<?>}
    */
   doUpdate() {
     var promises = [this._computedStyleModel.fetchComputedStyle(), this._fetchMatchedCascade()];
     return Promise.all(promises).spread(this._innerRebuildUpdate.bind(this));
   }
 
   /**
-   * @return {!Promise.<?WebInspector.CSSMatchedStyles>}
+   * @return {!Promise.<?SDK.CSSMatchedStyles>}
    */
   _fetchMatchedCascade() {
     var node = this._computedStyleModel.node();
     if (!node || !this._computedStyleModel.cssModel())
-      return Promise.resolve(/** @type {?WebInspector.CSSMatchedStyles} */ (null));
+      return Promise.resolve(/** @type {?SDK.CSSMatchedStyles} */ (null));
 
     return this._computedStyleModel.cssModel().cachedMatchedCascadeForNode(node).then(validateStyles.bind(this));
 
     /**
-     * @param {?WebInspector.CSSMatchedStyles} matchedStyles
-     * @return {?WebInspector.CSSMatchedStyles}
-     * @this {WebInspector.ComputedStyleWidget}
+     * @param {?SDK.CSSMatchedStyles} matchedStyles
+     * @return {?SDK.CSSMatchedStyles}
+     * @this {Elements.ComputedStyleWidget}
      */
     function validateStyles(matchedStyles) {
       return matchedStyles && matchedStyles.node() === this._computedStyleModel.node() ? matchedStyles : null;
     }
   }
 
   /**
    * @param {string} text
    * @return {!Node}
    */
   _processColor(text) {
-    var color = WebInspector.Color.parse(text);
+    var color = Common.Color.parse(text);
     if (!color)
       return createTextNode(text);
-    var swatch = WebInspector.ColorSwatch.create();
+    var swatch = UI.ColorSwatch.create();
     swatch.setColor(color);
-    swatch.setFormat(WebInspector.Color.detectColorFormat(color));
+    swatch.setFormat(Common.Color.detectColorFormat(color));
     return swatch;
   }
 
   /**
-   * @param {?WebInspector.ComputedStyleModel.ComputedStyle} nodeStyle
-   * @param {?WebInspector.CSSMatchedStyles} matchedStyles
+   * @param {?Elements.ComputedStyleModel.ComputedStyle} nodeStyle
+   * @param {?SDK.CSSMatchedStyles} matchedStyles
    */
   _innerRebuildUpdate(nodeStyle, matchedStyles) {
     /** @type {!Set<string>} */
     var expandedProperties = new Set();
     for (var treeElement of this._propertiesOutline.rootElement().children()) {
       if (!treeElement.expanded)
         continue;
-      var propertyName = treeElement[WebInspector.ComputedStyleWidget._propertySymbol].name;
+      var propertyName = treeElement[Elements.ComputedStyleWidget._propertySymbol].name;
       expandedProperties.add(propertyName);
     }
     this._propertiesOutline.removeChildren();
     this._linkifier.reset();
     var cssModel = this._computedStyleModel.cssModel();
     if (!nodeStyle || !matchedStyles || !cssModel)
       return;
 
     var uniqueProperties = nodeStyle.computedStyle.keysArray();
     uniqueProperties.sort(propertySorter);
 
     var propertyTraces = this._computePropertyTraces(matchedStyles);
     var inhertiedProperties = this._computeInheritedProperties(matchedStyles);
     var showInherited = this._showInheritedComputedStylePropertiesSetting.get();
     for (var i = 0; i < uniqueProperties.length; ++i) {
       var propertyName = uniqueProperties[i];
       var propertyValue = nodeStyle.computedStyle.get(propertyName);
-      var canonicalName = WebInspector.cssMetadata().canonicalPropertyName(propertyName);
+      var canonicalName = SDK.cssMetadata().canonicalPropertyName(propertyName);
       var inherited = !inhertiedProperties.has(canonicalName);
       if (!showInherited && inherited && !(propertyName in this._alwaysShowComputedProperties))
         continue;
       if (propertyName !== canonicalName && propertyValue === nodeStyle.computedStyle.get(canonicalName))
         continue;
 
       var propertyElement = createElement('div');
       propertyElement.classList.add('computed-style-property');
       propertyElement.classList.toggle('computed-style-property-inherited', inherited);
-      var renderer = new WebInspector.StylesSidebarPropertyRenderer(
+      var renderer = new Elements.StylesSidebarPropertyRenderer(
           null, nodeStyle.node, propertyName, /** @type {string} */ (propertyValue));
       renderer.setColorHandler(this._processColor.bind(this));
       var propertyNameElement = renderer.renderName();
       propertyNameElement.classList.add('property-name');
       propertyElement.appendChild(propertyNameElement);
 
       var colon = createElementWithClass('span', 'delimeter');
       colon.textContent = ':';
       propertyNameElement.appendChild(colon);
 
       var propertyValueElement = propertyElement.createChild('span', 'property-value');
 
       var propertyValueText = renderer.renderValue();
       propertyValueText.classList.add('property-value-text');
       propertyValueElement.appendChild(propertyValueText);
 
       var semicolon = createElementWithClass('span', 'delimeter');
       semicolon.textContent = ';';
       propertyValueElement.appendChild(semicolon);
 
       var treeElement = new TreeElement();
       treeElement.selectable = false;
       treeElement.title = propertyElement;
-      treeElement[WebInspector.ComputedStyleWidget._propertySymbol] = {name: propertyName, value: propertyValue};
+      treeElement[Elements.ComputedStyleWidget._propertySymbol] = {name: propertyName, value: propertyValue};
       var isOdd = this._propertiesOutline.rootElement().children().length % 2 === 0;
       treeElement.listItemElement.classList.toggle('odd-row', isOdd);
       this._propertiesOutline.appendChild(treeElement);
 
       var trace = propertyTraces.get(propertyName);
       if (trace) {
         var activeProperty = this._renderPropertyTrace(cssModel, matchedStyles, nodeStyle.node, treeElement, trace);
         treeElement.listItemElement.addEventListener('mousedown', (e) => e.consume(), false);
         treeElement.listItemElement.addEventListener('dblclick', (e) => e.consume(), false);
         treeElement.listItemElement.addEventListener('click', handleClick.bind(null, treeElement), false);
         var gotoSourceElement = propertyValueElement.createChild('div', 'goto-source-icon');
         gotoSourceElement.addEventListener('click', this._navigateToSource.bind(this, activeProperty));
         if (expandedProperties.has(propertyName))
           treeElement.expand();
       }
     }
 
     this._updateFilter(this._filterRegex);
 
     /**
      * @param {string} a
      * @param {string} b
      * @return {number}
      */
     function propertySorter(a, b) {
       if (a.startsWith('-webkit') ^ b.startsWith('-webkit'))
         return a.startsWith('-webkit') ? 1 : -1;
-      var canonical1 = WebInspector.cssMetadata().canonicalPropertyName(a);
-      var canonical2 = WebInspector.cssMetadata().canonicalPropertyName(b);
+      var canonical1 = SDK.cssMetadata().canonicalPropertyName(a);
+      var canonical2 = SDK.cssMetadata().canonicalPropertyName(b);
       return canonical1.compareTo(canonical2);
     }
 
     /**
      * @param {!TreeElement} treeElement
      * @param {!Event} event
      */
     function handleClick(treeElement, event) {
       if (!treeElement.expanded)
         treeElement.expand();
       else
         treeElement.collapse();
       event.consume();
     }
   }
 
   /**
-   * @param {!WebInspector.CSSProperty} cssProperty
+   * @param {!SDK.CSSProperty} cssProperty
    * @param {!Event} event
    */
   _navigateToSource(cssProperty, event) {
-    WebInspector.Revealer.reveal(cssProperty);
+    Common.Revealer.reveal(cssProperty);
     event.consume(true);
   }
 
   /**
-   * @param {!WebInspector.CSSModel} cssModel
-   * @param {!WebInspector.CSSMatchedStyles} matchedStyles
-   * @param {!WebInspector.DOMNode} node
+   * @param {!SDK.CSSModel} cssModel
+   * @param {!SDK.CSSMatchedStyles} matchedStyles
+   * @param {!SDK.DOMNode} node
    * @param {!TreeElement} rootTreeElement
-   * @param {!Array<!WebInspector.CSSProperty>} tracedProperties
-   * @return {!WebInspector.CSSProperty}
+   * @param {!Array<!SDK.CSSProperty>} tracedProperties
+   * @return {!SDK.CSSProperty}
    */
   _renderPropertyTrace(cssModel, matchedStyles, node, rootTreeElement, tracedProperties) {
     var activeProperty = null;
     for (var property of tracedProperties) {
       var trace = createElement('div');
       trace.classList.add('property-trace');
-      if (matchedStyles.propertyState(property) === WebInspector.CSSMatchedStyles.PropertyState.Overloaded)
+      if (matchedStyles.propertyState(property) === SDK.CSSMatchedStyles.PropertyState.Overloaded)
         trace.classList.add('property-trace-inactive');
       else
         activeProperty = property;
 
-      var renderer = new WebInspector.StylesSidebarPropertyRenderer(
+      var renderer = new Elements.StylesSidebarPropertyRenderer(
           null, node, property.name, /** @type {string} */ (property.value));
       renderer.setColorHandler(this._processColor.bind(this));
       var valueElement = renderer.renderValue();
       valueElement.classList.add('property-trace-value');
       valueElement.addEventListener('click', this._navigateToSource.bind(this, property), false);
       var gotoSourceElement = createElement('div');
       gotoSourceElement.classList.add('goto-source-icon');
       gotoSourceElement.addEventListener('click', this._navigateToSource.bind(this, property));
       valueElement.insertBefore(gotoSourceElement, valueElement.firstChild);
 
       trace.appendChild(valueElement);
 
       var rule = property.ownerStyle.parentRule;
       if (rule) {
         var linkSpan = trace.createChild('span', 'trace-link');
         linkSpan.appendChild(
-            WebInspector.StylePropertiesSection.createRuleOriginNode(matchedStyles, this._linkifier, rule));
+            Elements.StylePropertiesSection.createRuleOriginNode(matchedStyles, this._linkifier, rule));
       }
 
       var selectorElement = trace.createChild('span', 'property-trace-selector');
       selectorElement.textContent = rule ? rule.selectorText() : 'element.style';
       selectorElement.title = selectorElement.textContent;
 
       var traceTreeElement = new TreeElement();
       traceTreeElement.title = trace;
       traceTreeElement.selectable = false;
       rootTreeElement.appendChild(traceTreeElement);
     }
-    return /** @type {!WebInspector.CSSProperty} */ (activeProperty);
+    return /** @type {!SDK.CSSProperty} */ (activeProperty);
   }
 
   /**
-   * @param {!WebInspector.CSSMatchedStyles} matchedStyles
-   * @return {!Map<string, !Array<!WebInspector.CSSProperty>>}
+   * @param {!SDK.CSSMatchedStyles} matchedStyles
+   * @return {!Map<string, !Array<!SDK.CSSProperty>>}
    */
   _computePropertyTraces(matchedStyles) {
     var result = new Map();
     for (var style of matchedStyles.nodeStyles()) {
       var allProperties = style.allProperties;
       for (var property of allProperties) {
         if (!property.activeInStyle() || !matchedStyles.propertyState(property))
           continue;
         if (!result.has(property.name))
           result.set(property.name, []);
         result.get(property.name).push(property);
       }
     }
     return result;
   }
 
   /**
-   * @param {!WebInspector.CSSMatchedStyles} matchedStyles
+   * @param {!SDK.CSSMatchedStyles} matchedStyles
    * @return {!Set<string>}
    */
   _computeInheritedProperties(matchedStyles) {
     var result = new Set();
     for (var style of matchedStyles.nodeStyles()) {
       for (var property of style.allProperties) {
         if (!matchedStyles.propertyState(property))
           continue;
-        result.add(WebInspector.cssMetadata().canonicalPropertyName(property.name));
+        result.add(SDK.cssMetadata().canonicalPropertyName(property.name));
       }
     }
     return result;
   }
 
   /**
    * @param {?RegExp} regex
    */
   _updateFilter(regex) {
     var children = this._propertiesOutline.rootElement().children();
     for (var child of children) {
-      var property = child[WebInspector.ComputedStyleWidget._propertySymbol];
+      var property = child[Elements.ComputedStyleWidget._propertySymbol];
       var matched = !regex || regex.test(property.name) || regex.test(property.value);
       child.hidden = !matched;
     }
   }
 };
 
-WebInspector.ComputedStyleWidget._maxLinkLength = 30;
+Elements.ComputedStyleWidget._maxLinkLength = 30;
 
-WebInspector.ComputedStyleWidget._propertySymbol = Symbol('property');
+Elements.ComputedStyleWidget._propertySymbol = Symbol('property');