corysanin/tubestation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bug 1122605 - Focus selected inspector node after user selection. r=bgrins

Browse Source
This commit is contained in:
Patrick Brosset
2015-05-21 15:41:53 +02:00
parent 73520ad3b3
commit 03753b11fd
4 changed files with 147 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
browser/devtools/markupview/markup-view.js
View File

@@ -419,10 +419,13 @@ MarkupView.prototype = {
},
/**
* Highlight the inspector selected node.
* React to new-node-front selection events.
* Highlights the node if needed, and make sure it is shown and selected in
* the view.
*/
_onNewSelection: function() {
let selection = this._inspector.selection;
let reason = selection.reason;
this.htmlEditor.hide();
if (this._hoveredNode && this._hoveredNode !== selection.nodeFront) {
@@ -430,34 +433,57 @@ MarkupView.prototype = {
this._hoveredNode = null;
}
if (!selection.isNode()) {
this.unmarkSelectedNode();
return;
}
let done = this._inspector.updating("markup-view");
if (selection.isNode()) {
if (this._shouldNewSelectionBeHighlighted()) {
this._brieflyShowBoxModel(selection.nodeFront);
// Highlight the element briefly if needed.
if (this._shouldNewSelectionBeHighlighted()) {
this._brieflyShowBoxModel(selection.nodeFront);
}
this.showNode(selection.nodeFront).then(() => {
// We could be destroyed by now.
if (this._destroyer) {
return promise.reject("markupview destroyed");
}
this.showNode(selection.nodeFront).then(() => {
if (this._destroyer) {
return promise.reject("markupview destroyed");
}
if (selection.reason !== "treepanel") {
this.markNodeAsSelected(selection.nodeFront);
}
done();
}).then(null, e => {
if (!this._destroyer) {
console.error(e);
} else {
console.warn("Could not mark node as selected, the markup-view was " +
"destroyed while showing the node.");
}
// Mark the node as selected.
this.markNodeAsSelected(selection.nodeFront);
// Make sure the new selection receives focus so the keyboard can be used.
this.maybeFocusNewSelection();
done();
});
} else {
this.unmarkSelectedNode();
done();
}).catch(e => {
if (!this._destroyer) {
console.error(e);
} else {
console.warn("Could not mark node as selected, the markup-view was " +
"destroyed while showing the node.");
}
done();
});
},
/**
* Focus the current node selection's MarkupContainer if the selection
* happened because the user picked an element using the element picker or
* browser context menu.
*/
maybeFocusNewSelection: function() {
let {reason, nodeFront} = this._inspector.selection;
if (reason !== "browser-context-menu" &&
reason !== "picker-node-picked") {
return;
}
this.getContainer(nodeFront).focus();
},
/**
@@ -1155,22 +1181,33 @@ MarkupView.prototype = {
/**
* Mark the given node selected, and update the inspector.selection
* object's NodeFront to keep consistent state between UI and selection.
* @param aNode The NodeFront to mark as selected.
* @param {NodeFront} aNode The NodeFront to mark as selected.
* @param {String} reason The reason for marking the node as selected.
* @return {Boolean} False if the node is already marked as selected, true
* otherwise.
*/
markNodeAsSelected: function(aNode, reason) {
let container = this.getContainer(aNode);
markNodeAsSelected: function(node, reason) {
let container = this.getContainer(node);
if (this._selectedContainer === container) {
return false;
}
// Un-select the previous container.
if (this._selectedContainer) {
this._selectedContainer.selected = false;
}
// Select the new container.
this._selectedContainer = container;
if (aNode) {
if (node) {
this._selectedContainer.selected = true;
}
this._inspector.selection.setNodeFront(aNode, reason || "nodeselected");
// Change the current selection if needed.
if (this._inspector.selection.nodeFront !== node) {
this._inspector.selection.setNodeFront(node, reason || "nodeselected");
}
return true;
},