DevTools: [wip] move Elements panel off WebInspector.domModel and single tree outline.

Source/devtools/front_end/StylesSidebarPane.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 13 matching lines @@
  * 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.
  */
 
 /**
  * @constructor
  * @extends {WebInspector.SidebarPane}
  * @param {!WebInspector.ComputedStyleSidebarPane} computedStylePane
- * @param {function(!DOMAgent.NodeId, string, boolean)} setPseudoClassCallback
+ * @param {function(!WebInspector.DOMNode, string, boolean)=} setPseudoClassCallback
  */
 WebInspector.StylesSidebarPane = function(computedStylePane, setPseudoClassCallback)
 {
     WebInspector.SidebarPane.call(this, WebInspector.UIString("Styles"));
 
     this._elementStateButton = document.createElement("button");
     this._elementStateButton.className = "pane-title-button element-state";
     this._elementStateButton.title = WebInspector.UIString("Toggle Element State");
     this._elementStateButton.addEventListener("click", this._toggleElementStatePane.bind(this), false);
     this.titleElement.appendChild(this._elementStateButton);
@@ skipping 159 matching lines @@
         function searchHandler(regex)
         {
             this._filterRegex = regex;
         }
 
         return filterInput;
     },
 
     get _forcedPseudoClasses()
     {
-        return this.node ? (this.node.getUserProperty("pseudoState") || undefined) : undefined;
+        return this.node ? (this.node.getUserProperty(WebInspector.CSSStyleModel.PseudoStatePropertyName) || undefined) : undefined;
     },
 
     _updateForcedPseudoStateInputs: function()
     {
         if (!this.node)
             return;
 
         var hasPseudoType = !!this.node.pseudoType();
         this._elementStateButton.classList.toggle("hidden", hasPseudoType);
         this._elementStatePane.classList.toggle("expanded", !hasPseudoType && this._elementStateButton.classList.contains("toggled"));
@@ skipping 588 matching lines @@
 
         /**
          * @param {?Event} event
          * @this {WebInspector.StylesSidebarPane}
          */
         function clickListener(event)
         {
             var node = this._validateNode();
             if (!node)
                 return;
-            this._setPseudoClassCallback(node.id, event.target.state, event.target.checked);
+            this._setPseudoClassCallback(node, event.target.state, event.target.checked);
         }
 
         /**
          * @param {string} state
          * @return {!Element}
          * @this {WebInspector.StylesSidebarPane}
          */
         function createCheckbox(state)
         {
             var td = document.createElement("td");
@@ skipping 2405 matching lines @@
             return;
         }
 
         var results = this._cssCompletions.startsWith(prefix);
         var selectedIndex = this._cssCompletions.mostUsedOf(results);
         completionsReadyCallback(results, selectedIndex);
     },
 
     __proto__: WebInspector.TextPrompt.prototype
 }