diff options
author | Allan Sandfeld Jensen <allan.jensen@digia.com> | 2013-09-13 12:51:20 +0200 |
---|---|---|
committer | The Qt Project <gerrit-noreply@qt-project.org> | 2013-09-19 20:50:05 +0200 |
commit | d441d6f39bb846989d95bcf5caf387b42414718d (patch) | |
tree | e367e64a75991c554930278175d403c072de6bb8 /Source/WebInspectorUI/UserInterface/DOMTreeContentView.js | |
parent | 0060b2994c07842f4c59de64b5e3e430525c4b90 (diff) | |
download | qtwebkit-d441d6f39bb846989d95bcf5caf387b42414718d.tar.gz |
Import Qt5x2 branch of QtWebkit for Qt 5.2
Importing a new snapshot of webkit.
Change-Id: I2d01ad12cdc8af8cb015387641120a9d7ea5f10c
Reviewed-by: Allan Sandfeld Jensen <allan.jensen@digia.com>
Diffstat (limited to 'Source/WebInspectorUI/UserInterface/DOMTreeContentView.js')
-rw-r--r-- | Source/WebInspectorUI/UserInterface/DOMTreeContentView.js | 429 |
1 files changed, 429 insertions, 0 deletions
diff --git a/Source/WebInspectorUI/UserInterface/DOMTreeContentView.js b/Source/WebInspectorUI/UserInterface/DOMTreeContentView.js new file mode 100644 index 000000000..57f911169 --- /dev/null +++ b/Source/WebInspectorUI/UserInterface/DOMTreeContentView.js @@ -0,0 +1,429 @@ +/* + * Copyright (C) 2013 Apple Inc. All rights reserved. + * + * 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. + * 2. Redistributions in binary form must reproduce the above copyright + * notice, this list of conditions and the following disclaimer in the + * documentation and/or other materials provided with the distribution. + * + * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' + * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, + * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR + * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS + * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR + * CONSEQUENTIAL DAMAGES (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. + */ + +WebInspector.DOMTreeContentView = function(domTree) +{ + console.assert(domTree); + + WebInspector.ContentView.call(this, domTree); + + // The navigation item for the compositing borders button. + this._compositingBordersButtonNavigationItem = new WebInspector.ActivateButtonNavigationItem("layer-borders", WebInspector.UIString("Show compositing borders"), WebInspector.UIString("Hide compositing borders"), "Images/LayerBorders.pdf", 16, 16); + this._compositingBordersButtonNavigationItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._toggleCompositingBorders, this); + this._compositingBordersButtonNavigationItem.enabled = !!PageAgent.getCompositingBordersVisible; + + // The navigation item for the shadow tree toggle button. + WebInspector.showShadowDOMSetting.addEventListener(WebInspector.Setting.Event.Changed, this._showShadowDOMSettingChanged, this); + this._showsShadowDOMButtonNavigationItem = new WebInspector.ActivateButtonNavigationItem("shows-shadow-DOM", WebInspector.UIString("Show shadow DOM nodes"), WebInspector.UIString("Hide shadow DOM nodes"), "Images/ShadowDOM.pdf", 16, 16); + this._showsShadowDOMButtonNavigationItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._toggleShowsShadowDOMSetting, this); + this._showShadowDOMSettingChanged(); + + this.element.classList.add(WebInspector.DOMTreeContentView.StyleClassName); + this.element.addEventListener("click", this._mouseWasClicked.bind(this), false); + + this._domTree = domTree; + this._domTree.addEventListener(WebInspector.DOMTree.Event.RootDOMNodeInvalidated, this._rootDOMNodeInvalidated, this); + + this._domTreeOutline = new WebInspector.DOMTreeOutline(true, true, false); + this._domTreeOutline.addEventListener(WebInspector.DOMTreeOutline.Event.SelectedNodeChanged, this._selectedNodeDidChange, this); + this._domTreeOutline.wireToDomAgent(); + this.element.appendChild(this._domTreeOutline.element); + + WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.AttributeModified, this._domNodeChanged, this); + WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.AttributeRemoved, this._domNodeChanged, this); + WebInspector.domTreeManager.addEventListener(WebInspector.DOMTreeManager.Event.CharacterDataModified, this._domNodeChanged, this); + + this._lastSelectedNodePathSetting = new WebInspector.Setting("last-selected-node-path", null); + + this._numberOfSearchResults = null; + + this._requestRootDOMNode(); +}; + +WebInspector.DOMTreeContentView.StyleClassName = "dom-tree"; + +WebInspector.DOMTreeContentView.prototype = { + constructor: WebInspector.DOMTreeContentView, + + // Public + + get navigationItems() + { + return [this._showsShadowDOMButtonNavigationItem, this._compositingBordersButtonNavigationItem]; + }, + + get domTree() + { + return this._domTree; + }, + + get scrollableElements() + { + return [this.element]; + }, + + updateLayout: function() + { + this._domTreeOutline.updateSelection(); + }, + + shown: function() + { + this._domTreeOutline.setVisible(true, WebInspector.isConsoleFocused()); + this._updateCompositingBordersButtonToMatchPageSettings(); + }, + + hidden: function() + { + WebInspector.domTreeManager.hideDOMNodeHighlight(); + this._domTreeOutline.setVisible(false); + }, + + closed: function() + { + this._domTree.removeEventListener(null, null, this); + WebInspector.domTreeManager.removeEventListener(null, null, this); + + this._domTreeOutline.close(); + }, + + get selectionPathComponents() + { + var treeElement = this._domTreeOutline.selectedTreeElement; + var pathComponents = []; + + while (treeElement && !treeElement.root) { + // The close tag is contained within the element it closes. So skip it since we don't want to + // show the same node twice in the hierarchy. + if (treeElement.isCloseTag()) { + treeElement = treeElement.parent; + continue; + } + + var pathComponent = new WebInspector.DOMTreeElementPathComponent(treeElement, treeElement.representedObject); + pathComponent.addEventListener(WebInspector.HierarchicalPathComponent.Event.SiblingWasSelected, this._pathComponentSelected, this); + pathComponents.unshift(pathComponent); + treeElement = treeElement.parent; + } + + return pathComponents; + }, + + selectAndRevealDOMNode: function(domNode, preventFocusChange) + { + this._domTreeOutline.selectDOMNode(domNode, !preventFocusChange); + }, + + handleCopyEvent: function(event) + { + var selectedDOMNode = this._domTreeOutline.selectedDOMNode(); + if (!selectedDOMNode) + return; + + event.clipboardData.clearData(); + event.preventDefault(); + + selectedDOMNode.copyNode(); + }, + + get supportsSearch() + { + return true; + }, + + get numberOfSearchResults() + { + return this._numberOfSearchResults; + }, + + get hasPerformedSearch() + { + return this._numberOfSearchResults !== null; + }, + + set automaticallyRevealFirstSearchResult(reveal) + { + this._automaticallyRevealFirstSearchResult = reveal; + + // If we haven't shown a search result yet, reveal one now. + if (this._automaticallyRevealFirstSearchResult && this._numberOfSearchResults > 0) { + if (this._currentSearchResultIndex === -1) + this.revealNextSearchResult(); + } + }, + + performSearch: function(query) + { + if (this._searchQuery === query) + return; + + if (this._searchIdentifier) + DOMAgent.discardSearchResults(this._searchIdentifier); + + this._searchQuery = query; + this._searchIdentifier = null; + this._numberOfSearchResults = null; + this._currentSearchResultIndex = -1; + + function searchResultsReady(error, searchIdentifier, resultsCount) + { + if (error) + return; + + this._searchIdentifier = searchIdentifier; + this._numberOfSearchResults = resultsCount; + + this.dispatchEventToListeners(WebInspector.ContentView.Event.NumberOfSearchResultsDidChange); + + if (this._automaticallyRevealFirstSearchResult) + this.revealNextSearchResult(); + } + + DOMAgent.performSearch(query, searchResultsReady.bind(this)); + }, + + searchCleared: function() + { + if (this._searchIdentifier) + DOMAgent.discardSearchResults(this._searchIdentifier); + + this._searchQuery = null; + this._searchIdentifier = null; + this._numberOfSearchResults = null; + this._currentSearchResultIndex = -1; + }, + + revealPreviousSearchResult: function(changeFocus) + { + if (!this._numberOfSearchResults) + return; + + if (this._currentSearchResultIndex > 0) + --this._currentSearchResultIndex; + else + this._currentSearchResultIndex = this._numberOfSearchResults - 1; + + this._revealSearchResult(this._currentSearchResultIndex, changeFocus); + }, + + revealNextSearchResult: function(changeFocus) + { + if (!this._numberOfSearchResults) + return; + + if (this._currentSearchResultIndex + 1 < this._numberOfSearchResults) + ++this._currentSearchResultIndex; + else + this._currentSearchResultIndex = 0; + + this._revealSearchResult(this._currentSearchResultIndex, changeFocus); + }, + + // Private + + _revealSearchResult: function(index, changeFocus) + { + console.assert(this._searchIdentifier); + + var searchIdentifier = this._searchIdentifier; + + function revealResult(error, nodeIdentifiers) + { + if (error) + return; + + // Bail if the searchIdentifier changed since we started. + if (this._searchIdentifier !== searchIdentifier) + return; + + console.assert(nodeIdentifiers.length === 1); + + var domNode = WebInspector.domTreeManager.nodeForId(nodeIdentifiers[0]); + console.assert(domNode); + if (!domNode) + return; + + this._domTreeOutline.selectDOMNode(domNode, changeFocus); + } + + DOMAgent.getSearchResults(this._searchIdentifier, index, index + 1, revealResult.bind(this)); + }, + + _rootDOMNodeAvailable: function(rootDOMNode) + { + this._domTreeOutline.rootDOMNode = rootDOMNode; + + if (!rootDOMNode) { + this._domTreeOutline.selectDOMNode(null, false); + return; + } + + function selectNode(lastSelectedNode) + { + // A selection was made while waiting for the async reply. Just bail now. + if (this._domTreeOutline.selectedTreeElement) + return; + + var nodeToFocus = lastSelectedNode; + if (!nodeToFocus) + nodeToFocus = rootDOMNode.body || rootDOMNode.documentElement; + + if (!nodeToFocus) + return; + + this._dontSetLastSelectedNodePath = true; + this.selectAndRevealDOMNode(nodeToFocus, WebInspector.isConsoleFocused()); + this._dontSetLastSelectedNodePath = false; + + // If this wasn't the last selected node, then expand it. + if (!lastSelectedNode && this._domTreeOutline.selectedTreeElement) + this._domTreeOutline.selectedTreeElement.expand(); + } + + function selectLastSelectedNode(nodeId) + { + selectNode.call(this, WebInspector.domTreeManager.nodeForId(nodeId)); + } + + if (this._lastSelectedNodePathSetting.value && this._lastSelectedNodePathSetting.value.path && this._lastSelectedNodePathSetting.value.url === this._domTree.frame.url.hash) + WebInspector.domTreeManager.pushNodeByPathToFrontend(this._lastSelectedNodePathSetting.value.path, selectLastSelectedNode.bind(this)); + else + selectNode.call(this); + }, + + _rootDOMNodeInvalidated: function(event) + { + this._requestRootDOMNode(); + }, + + _requestRootDOMNode: function() + { + this._domTree.requestRootDOMNode(this._rootDOMNodeAvailable.bind(this)); + }, + + _selectedNodeDidChange: function(event) + { + var selectedDOMNode = this._domTreeOutline.selectedDOMNode(); + if (selectedDOMNode && !this._dontSetLastSelectedNodePath) + this._lastSelectedNodePathSetting.value = {url: this._domTree.frame.url.hash, path: selectedDOMNode.path()}; + + if (selectedDOMNode) + ConsoleAgent.addInspectedNode(selectedDOMNode.id); + + this.dispatchEventToListeners(WebInspector.ContentView.Event.SelectionPathComponentsDidChange); + }, + + _pathComponentSelected: function(event) + { + console.assert(event.data.pathComponent instanceof WebInspector.DOMTreeElementPathComponent); + console.assert(event.data.pathComponent.domTreeElement instanceof WebInspector.DOMTreeElement); + + this._domTreeOutline.selectDOMNode(event.data.pathComponent.domTreeElement.representedObject, true); + }, + + _domNodeChanged: function(event) + { + var selectedDOMNode = this._domTreeOutline.selectedDOMNode(); + if (selectedDOMNode !== event.data.node) + return; + + this.dispatchEventToListeners(WebInspector.ContentView.Event.SelectionPathComponentsDidChange); + }, + + _mouseWasClicked: function(event) + { + var anchorElement = event.target.enclosingNodeOrSelfWithNodeName("a"); + if (!anchorElement || !anchorElement.href) + return; + + // Prevent the link from navigating, since we don't do any navigation by following links normally. + event.preventDefault(); + event.stopPropagation(); + + if (WebInspector.isBeingEdited(anchorElement)) { + // Don't follow the link when it is being edited. + return; + } + + // Cancel any pending link navigation. + if (this._followLinkTimeoutIdentifier) { + clearTimeout(this._followLinkTimeoutIdentifier); + delete this._followLinkTimeoutIdentifier; + } + + // If this is a double-click (or multiple-click), return early. + if (event.detail > 1) + return; + + function followLink() + { + // Since followLink is delayed, the call to WebInspector.openURL can't look at window.event + // to see if the command key is down like it normally would. So we need to do that check + // before calling WebInspector.openURL. + var alwaysOpenExternally = event ? event.metaKey : false; + WebInspector.openURL(anchorElement.href, this._frame, alwaysOpenExternally, anchorElement.lineNumber); + } + + // Start a timeout since this is a single click, if the timeout is canceled before it fires, + // then a double-click happened or another link was clicked. + // FIXME: The duration might be longer or shorter than the user's configured double click speed. + this._followLinkTimeoutIdentifier = setTimeout(followLink.bind(this), 333); + }, + + _toggleCompositingBorders: function(event) + { + console.assert(PageAgent.setCompositingBordersVisible); + + var activated = !this._compositingBordersButtonNavigationItem.activated; + this._compositingBordersButtonNavigationItem.activated = activated; + PageAgent.setCompositingBordersVisible(activated); + }, + + _updateCompositingBordersButtonToMatchPageSettings: function() + { + if (!PageAgent.getCompositingBordersVisible) + return; + + var button = this._compositingBordersButtonNavigationItem; + + // We need to sync with the page settings since these can be controlled + // in a different way than just using the navigation bar button. + PageAgent.getCompositingBordersVisible(function(error, compositingBordersVisible) { + button.activated = error ? false : compositingBordersVisible; + }); + }, + + _showShadowDOMSettingChanged: function(event) + { + this._showsShadowDOMButtonNavigationItem.activated = WebInspector.showShadowDOMSetting.value; + }, + + _toggleShowsShadowDOMSetting: function(event) + { + WebInspector.showShadowDOMSetting.value = !WebInspector.showShadowDOMSetting.value; + } +}; + +WebInspector.DOMTreeContentView.prototype.__proto__ = WebInspector.ContentView.prototype; |