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

Source/devtools/front_end/DOMModel.js

 /*
  * Copyright (C) 2009, 2010 Google 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:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
@@ skipping 22 matching lines @@
  * @constructor
  * @extends {WebInspector.TargetAware}
  * @param {!WebInspector.DOMModel} domModel
  * @param {?WebInspector.DOMDocument} doc
  * @param {boolean} isInShadowTree
  * @param {!DOMAgent.Node} payload
  */
 WebInspector.DOMNode = function(domModel, doc, isInShadowTree, payload) {
     WebInspector.TargetAware.call(this, domModel._target);
     this._domModel = domModel;
+    this._agent = domModel._agent;
     this.ownerDocument = doc;
     this._isInShadowTree = isInShadowTree;
 
     this.id = payload.nodeId;
     domModel._idToDOMNode[this.id] = this;
     this._nodeType = payload.nodeType;
     this._nodeName = payload.nodeName;
     this._localName = payload.localName;
     this._nodeValue = payload.nodeValue;
     this._pseudoType = payload.pseudoType;
@@ skipping 76 matching lines @@
 /**
  * @enum {string}
  */
 WebInspector.DOMNode.ShadowRootTypes = {
     UserAgent: "user-agent",
     Author: "author"
 }
 
 WebInspector.DOMNode.prototype = {
     /**
+     * @return {!WebInspector.DOMModel}
+     */
+    domModel: function()
+    {
+        return this._domModel;
+    },
+
+    /**
      * @return {?Array.<!WebInspector.DOMNode>}
      */
     children: function()
     {
         return this._children ? this._children.slice() : null;
     },
 
     /**
      * @return {boolean}
      */
@@ skipping 130 matching lines @@
             return "#shadow-root" + (shadowRootType === WebInspector.DOMNode.ShadowRootTypes.UserAgent ? " (user-agent)" : "");
         return this.isXMLNode() ? this.nodeName() : this.nodeName().toLowerCase();
     },
 
     /**
      * @param {string} name
      * @param {function(?Protocol.Error)=} callback
      */
     setNodeName: function(name, callback)
     {
-        DOMAgent.setNodeName(this.id, name, WebInspector.domModel._markRevision(this, callback));
+        this._agent.setNodeName(this.id, name, this._domModel._markRevision(this, callback));
     },
 
     /**
      * @return {string}
      */
     localName: function()
     {
         return this._localName;
     },
 
     /**
      * @return {string}
      */
     nodeValue: function()
     {
         return this._nodeValue;
     },
 
     /**
      * @param {string} value
      * @param {function(?Protocol.Error)=} callback
      */
     setNodeValue: function(value, callback)
     {
-        DOMAgent.setNodeValue(this.id, value, WebInspector.domModel._markRevision(this, callback));
+        this._agent.setNodeValue(this.id, value, this._domModel._markRevision(this, callback));
     },
 
     /**
      * @param {string} name
      * @return {string}
      */
     getAttribute: function(name)
     {
         var attr = this._attributesMap[name];
         return attr ? attr.value : undefined;
     },
 
     /**
      * @param {string} name
      * @param {string} text
      * @param {function(?Protocol.Error)=} callback
      */
     setAttribute: function(name, text, callback)
     {
-        DOMAgent.setAttributesAsText(this.id, text, name, WebInspector.domModel._markRevision(this, callback));
+        this._agent.setAttributesAsText(this.id, text, name, this._domModel._markRevision(this, callback));
     },
 
     /**
      * @param {string} name
      * @param {string} value
      * @param {function(?Protocol.Error)=} callback
      */
     setAttributeValue: function(name, value, callback)
     {
-        DOMAgent.setAttributeValue(this.id, name, value, WebInspector.domModel._markRevision(this, callback));
+        this._agent.setAttributeValue(this.id, name, value, this._domModel._markRevision(this, callback));
     },
 
     /**
      * @return {!Object}
      */
     attributes: function()
     {
         return this._attributes;
     },
 
@@ skipping 12 matching lines @@
             if (!error) {
                 delete this._attributesMap[name];
                 for (var i = 0;  i < this._attributes.length; ++i) {
                     if (this._attributes[i].name === name) {
                         this._attributes.splice(i, 1);
                         break;
                     }
                 }
             }
 
-            WebInspector.domModel._markRevision(this, callback)(error);
+            this._domModel._markRevision(this, callback)(error);
         }
-        DOMAgent.removeAttribute(this.id, name, mycallback.bind(this));
+        this._agent.removeAttribute(this.id, name, mycallback.bind(this));
     },
 
     /**
      * @param {function(?Array.<!WebInspector.DOMNode>)=} callback
      */
     getChildNodes: function(callback)
     {
         if (this._children) {
             if (callback)
                 callback(this.children());
             return;
         }
 
         /**
          * @this {WebInspector.DOMNode}
          * @param {?Protocol.Error} error
          */
         function mycallback(error)
         {
             if (callback)
                 callback(error ? null : this.children());
         }
 
-        DOMAgent.requestChildNodes(this.id, undefined, mycallback.bind(this));
+        this._agent.requestChildNodes(this.id, undefined, mycallback.bind(this));
     },
 
     /**
      * @param {number} depth
      * @param {function(?Array.<!WebInspector.DOMNode>)=} callback
      */
     getSubtree: function(depth, callback)
     {
         /**
          * @this {WebInspector.DOMNode}
          * @param {?Protocol.Error} error
          */
         function mycallback(error)
         {
             if (callback)
                 callback(error ? null : this._children);
         }
 
-        DOMAgent.requestChildNodes(this.id, depth, mycallback.bind(this));
+        this._agent.requestChildNodes(this.id, depth, mycallback.bind(this));
     },
 
     /**
      * @param {function(?Protocol.Error)=} callback
      */
     getOuterHTML: function(callback)
     {
-        DOMAgent.getOuterHTML(this.id, callback);
+        this._agent.getOuterHTML(this.id, callback);
     },
 
     /**
      * @param {string} html
      * @param {function(?Protocol.Error)=} callback
      */
     setOuterHTML: function(html, callback)
     {
-        DOMAgent.setOuterHTML(this.id, html, WebInspector.domModel._markRevision(this, callback));
+        this._agent.setOuterHTML(this.id, html, this._domModel._markRevision(this, callback));
     },
 
     /**
      * @param {function(?Protocol.Error, !DOMAgent.NodeId=)=} callback
      */
     removeNode: function(callback)
     {
-        DOMAgent.removeNode(this.id, WebInspector.domModel._markRevision(this, callback));
+        this._agent.removeNode(this.id, this._domModel._markRevision(this, callback));
     },
 
     copyNode: function()
     {
         function copy(error, text)
         {
             if (!error)
                 InspectorFrontendHost.copyText(text);
         }
-        DOMAgent.getOuterHTML(this.id, copy);
+        this._agent.getOuterHTML(this.id, copy);
     },
 
     /**
      * @param {string} objectGroupId
      * @param {function(?Protocol.Error, !Array.<!DOMAgent.EventListener>)=} callback
      */
     eventListeners: function(objectGroupId, callback)
     {
-        DOMAgent.getEventListenersForNode(this.id, objectGroupId, callback);
+        this._agent.getEventListenersForNode(this.id, objectGroupId, callback);
     },
 
     /**
      * @return {string}
      */
     path: function()
     {
         /**
          * @param {?WebInspector.DOMNode} node
          */
@@ skipping 202 matching lines @@
         }
     },
 
     /**
      * @param {!WebInspector.DOMNode} targetNode
      * @param {?WebInspector.DOMNode} anchorNode
      * @param {function(?Protocol.Error, !DOMAgent.NodeId=)=} callback
      */
     moveTo: function(targetNode, anchorNode, callback)
     {
-        DOMAgent.moveTo(this.id, targetNode.id, anchorNode ? anchorNode.id : undefined, WebInspector.domModel._markRevision(this, callback));
+        this._agent.moveTo(this.id, targetNode.id, anchorNode ? anchorNode.id : undefined, this._domModel._markRevision(this, callback));
     },
 
     /**
      * @return {boolean}
      */
     isXMLNode: function()
     {
         return !!this.ownerDocument && !!this.ownerDocument.xmlVersion;
     },
 
@@ skipping 77 matching lines @@
     {
         if (!url)
             return url;
         for (var frameOwnerCandidate = this; frameOwnerCandidate; frameOwnerCandidate = frameOwnerCandidate.parentNode) {
             if (frameOwnerCandidate.baseURL)
                 return WebInspector.ParsedURL.completeURL(frameOwnerCandidate.baseURL, url);
         }
         return null;
     },
 
+    /**
+     * @param {string=} mode
+     * @param {!RuntimeAgent.RemoteObjectId=} objectId
+     */
+    highlight: function(mode, objectId)
+    {
+        this._domModel.highlightDOMNode(this.id, mode, objectId);
+    },
+
+    highlightForTwoSeconds: function()
+    {
+        this._domModel.highlightDOMNodeForTwoSeconds(this.id);
+    },
+
+    reveal: function()
+    {
+        WebInspector.Revealer.reveal(this);
+    },
+
+    /**
+     * @param {string=} objectGroup
+     * @param {function(?WebInspector.RemoteObject)=} callback
+     */
+    resolveToObject: function(objectGroup, callback)
+    {
+        this._agent.resolveNode(this.id, objectGroup, mycallback.bind(this));
+
+        /**
+         * @param {?Protocol.Error} error
+         * @param {!RuntimeAgent.RemoteObject} object
+         * @this {WebInspector.DOMNode}
+         */
+        function mycallback(error, object)
+        {
+            if (!callback)
+                return;
+
+            if (error || !object)
+                callback(null);
+            else
+                callback(this.target().runtimeModel.createRemoteObject(object));
+        }
+    },
+
     __proto__: WebInspector.TargetAware.prototype
 }
 
 /**
  * @extends {WebInspector.DOMNode}
  * @constructor
  * @param {!WebInspector.DOMModel} domModel
  * @param {!DOMAgent.Node} payload
  */
 WebInspector.DOMDocument = function(domModel, payload)
 {
     WebInspector.DOMNode.call(this, domModel, this, false, payload);
     this.documentURL = payload.documentURL || "";
     this.baseURL = payload.baseURL || "";
     this.xmlVersion = payload.xmlVersion;
     this._listeners = {};
 }
 
 WebInspector.DOMDocument.prototype = {
     __proto__: WebInspector.DOMNode.prototype
 }
 
 /**
  * @extends {WebInspector.Object}
  * @constructor
  * @param {!WebInspector.Target} target
  */
 WebInspector.DOMModel = function(target) {
     this._target = target;
+    this._agent = target.domAgent();
+
     /** @type {!Object.<number, !WebInspector.DOMNode>} */
     this._idToDOMNode = {};
     /** @type {?WebInspector.DOMDocument} */
     this._document = null;
     /** @type {!Object.<number, boolean>} */
     this._attributeLoadNodeIds = {};
     InspectorBackend.registerDOMDispatcher(new WebInspector.DOMDispatcher(this));
 
-    this._defaultHighlighter = new WebInspector.DefaultDOMNodeHighlighter();
+    this._defaultHighlighter = new WebInspector.DefaultDOMNodeHighlighter(this._agent);
     this._highlighter = this._defaultHighlighter;
 }
 
 WebInspector.DOMModel.Events = {
     AttrModified: "AttrModified",
     AttrRemoved: "AttrRemoved",
     CharacterDataModified: "CharacterDataModified",
     NodeInserted: "NodeInserted",
     NodeRemoved: "NodeRemoved",
     DocumentUpdated: "DocumentUpdated",
@@ skipping 32 matching lines @@
                 this._setDocument(root);
 
             for (var i = 0; i < this._pendingDocumentRequestCallbacks.length; ++i) {
                 var callback = this._pendingDocumentRequestCallbacks[i];
                 if (callback)
                     callback(this._document);
             }
             delete this._pendingDocumentRequestCallbacks;
         }
 
-        DOMAgent.getDocument(onDocumentAvailable.bind(this));
+        this._agent.getDocument(onDocumentAvailable.bind(this));
     },
 
     /**
      * @return {?WebInspector.DOMDocument}
      */
     existingDocument: function()
     {
         return this._document;
     },
 
     /**
      * @param {!RuntimeAgent.RemoteObjectId} objectId
      * @param {function(?DOMAgent.NodeId)=} callback
      */
     pushNodeToFrontend: function(objectId, callback)
     {
-        this._dispatchWhenDocumentAvailable(DOMAgent.requestNode.bind(DOMAgent, objectId), callback);
+        this._dispatchWhenDocumentAvailable(this._agent.requestNode.bind(this._agent, objectId), callback);
     },
 
     /**
      * @param {string} path
      * @param {function(?number)=} callback
      */
     pushNodeByPathToFrontend: function(path, callback)
     {
-        this._dispatchWhenDocumentAvailable(DOMAgent.pushNodeByPathToFrontend.bind(DOMAgent, path), callback);
+        this._dispatchWhenDocumentAvailable(this._agent.pushNodeByPathToFrontend.bind(this._agent, path), callback);
     },
 
     /**
      * @param {!Array.<number>} backendNodeIds
      * @param {function(?Array.<number>)=} callback
      */
     pushNodesByBackendIdsToFrontend: function(backendNodeIds, callback)
     {
-        this._dispatchWhenDocumentAvailable(DOMAgent.pushNodesByBackendIdsToFrontend.bind(DOMAgent, backendNodeIds), callback);
+        this._dispatchWhenDocumentAvailable(this._agent.pushNodesByBackendIdsToFrontend.bind(this._agent, backendNodeIds), callback);
     },
 
     /**
      * @param {function(!T)=} callback
      * @return {function(?Protocol.Error, !T=)|undefined}
      * @template T
      */
     _wrapClientCallback: function(callback)
     {
         if (!callback)
@@ skipping 92 matching lines @@
             if (node) {
                 if (node._setAttributesPayload(attributes))
                     this.dispatchEventToListeners(WebInspector.DOMModel.Events.AttrModified, { node: node, name: "style" });
             }
         }
 
         delete this._loadNodeAttributesTimeout;
 
         for (var nodeId in this._attributeLoadNodeIds) {
             var nodeIdAsNumber = parseInt(nodeId, 10);
-            DOMAgent.getAttributes(nodeIdAsNumber, callback.bind(this, nodeIdAsNumber));
+            this._agent.getAttributes(nodeIdAsNumber, callback.bind(this, nodeIdAsNumber));
         }
         this._attributeLoadNodeIds = {};
     },
 
     /**
      * @param {!DOMAgent.NodeId} nodeId
      * @param {string} newValue
      */
     _characterDataModified: function(nodeId, newValue)
     {
@@ skipping 205 matching lines @@
          * @param {?Protocol.Error} error
          * @param {string} searchId
          * @param {number} resultsCount
          * @this {WebInspector.DOMModel}
          */
         function callback(error, searchId, resultsCount)
         {
             this._searchId = searchId;
             searchCallback(resultsCount);
         }
-        DOMAgent.performSearch(query, callback.bind(this));
+        this._agent.performSearch(query, callback.bind(this));
     },
 
     /**
      * @param {number} index
      * @param {?function(?WebInspector.DOMNode)} callback
      */
     searchResult: function(index, callback)
     {
         if (this._searchId)
-            DOMAgent.getSearchResults(this._searchId, index, index + 1, searchResultsCallback.bind(this));
+            this._agent.getSearchResults(this._searchId, index, index + 1, searchResultsCallback.bind(this));
         else
             callback(null);
 
         /**
          * @param {?Protocol.Error} error
          * @param {!Array.<number>} nodeIds
          * @this {WebInspector.DOMModel}
          */
         function searchResultsCallback(error, nodeIds)
         {
             if (error) {
                 console.error(error);
                 callback(null);
                 return;
             }
             if (nodeIds.length != 1)
                 return;
 
             callback(this.nodeForId(nodeIds[0]));
         }
     },
 
     cancelSearch: function()
     {
         if (this._searchId) {
-            DOMAgent.discardSearchResults(this._searchId);
+            this._agent.discardSearchResults(this._searchId);
             delete this._searchId;
         }
     },
 
     /**
      * @param {!DOMAgent.NodeId} nodeId
      * @param {string} selectors
      * @param {function(?DOMAgent.NodeId)=} callback
      */
     querySelector: function(nodeId, selectors, callback)
     {
-        DOMAgent.querySelector(nodeId, selectors, this._wrapClientCallback(callback));
+        this._agent.querySelector(nodeId, selectors, this._wrapClientCallback(callback));
     },
 
     /**
      * @param {!DOMAgent.NodeId} nodeId
      * @param {string} selectors
      * @param {function(!Array.<!DOMAgent.NodeId>=)=} callback
      */
     querySelectorAll: function(nodeId, selectors, callback)
     {
-        DOMAgent.querySelectorAll(nodeId, selectors, this._wrapClientCallback(callback));
+        this._agent.querySelectorAll(nodeId, selectors, this._wrapClientCallback(callback));
     },
 
     /**
      * @param {!DOMAgent.NodeId=} nodeId
      * @param {string=} mode
      * @param {!RuntimeAgent.RemoteObjectId=} objectId
      */
     highlightDOMNode: function(nodeId, mode, objectId)
     {
         if (this._hideDOMNodeHighlightTimeout) {
@@ skipping 120 matching lines @@
             if (error)
                 return;
             this._addTouchEventsScriptId = scriptId;
         }
 
         PageAgent.setTouchEmulationEnabled(emulationEnabled);
     },
 
     markUndoableState: function()
     {
-        DOMAgent.markUndoableState();
+        this._agent.markUndoableState();
     },
 
     /**
      * @param {function(?Protocol.Error)=} callback
      */
     undo: function(callback)
     {
         /**
          * @param {?Protocol.Error} error
          * @this {WebInspector.DOMModel}
          */
         function mycallback(error)
         {
             this.dispatchEventToListeners(WebInspector.DOMModel.Events.UndoRedoCompleted);
             callback(error);
         }
 
         this.dispatchEventToListeners(WebInspector.DOMModel.Events.UndoRedoRequested);
-        DOMAgent.undo(callback);
+        this._agent.undo(callback);
     },
 
     /**
      * @param {function(?Protocol.Error)=} callback
      */
     redo: function(callback)
     {
         /**
          * @param {?Protocol.Error} error
          * @this {WebInspector.DOMModel}
          */
         function mycallback(error)
         {
             this.dispatchEventToListeners(WebInspector.DOMModel.Events.UndoRedoCompleted);
             callback(error);
         }
 
         this.dispatchEventToListeners(WebInspector.DOMModel.Events.UndoRedoRequested);
-        DOMAgent.redo(callback);
+        this._agent.redo(callback);
     },
 
     /**
      * @param {?WebInspector.DOMNodeHighlighter} highlighter
      */
     setHighlighter: function(highlighter)
     {
         this._highlighter = highlighter || this._defaultHighlighter;
     },
 
@@ skipping 153 matching lines @@
      * @param {boolean} inspectUAShadowDOM
      * @param {!DOMAgent.HighlightConfig} config
      * @param {function(?Protocol.Error)=} callback
      */
     setInspectModeEnabled: function(enabled, inspectUAShadowDOM, config, callback) {}
 }
 
 /**
  * @constructor
  * @implements {WebInspector.DOMNodeHighlighter}
+ * @param {!Protocol.DOMAgent} agent
  */
-WebInspector.DefaultDOMNodeHighlighter = function() {
+WebInspector.DefaultDOMNodeHighlighter = function(agent)
+{
+    this._agent = agent;
 }
 
 WebInspector.DefaultDOMNodeHighlighter.prototype = {
     /**
      * @param {!DOMAgent.NodeId} nodeId
      * @param {!DOMAgent.HighlightConfig} config
      * @param {!RuntimeAgent.RemoteObjectId=} objectId
      */
     highlightDOMNode: function(nodeId, config, objectId)
     {
         if (objectId || nodeId)
-            DOMAgent.highlightNode(config, objectId ? undefined : nodeId, objectId);
+            this._agent.highlightNode(config, objectId ? undefined : nodeId, objectId);
         else
-            DOMAgent.hideHighlight();
+            this._agent.hideHighlight();
     },
 
     /**
      * @param {boolean} enabled
      * @param {boolean} inspectUAShadowDOM
      * @param {!DOMAgent.HighlightConfig} config
      * @param {function(?Protocol.Error)=} callback
      */
     setInspectModeEnabled: function(enabled, inspectUAShadowDOM, config, callback)
     {
-        DOMAgent.setInspectModeEnabled(enabled, inspectUAShadowDOM, config, callback);
+        this._agent.setInspectModeEnabled(enabled, inspectUAShadowDOM, config, callback);
     }
 }
 
 /**
  * @type {!WebInspector.DOMModel}
  */
 WebInspector.domModel;