| OLD | NEW |
| 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 /** | 5 /** |
| 6 * @constructor | 6 * @constructor |
| 7 * @extends {WebInspector.ElementsPanel.BaseToolbarPaneWidget} | 7 * @extends {WebInspector.Widget} |
| 8 * @param {!WebInspector.ToolbarItem} toolbarItem | |
| 9 */ | 8 */ |
| 10 WebInspector.ElementStatePaneWidget = function(toolbarItem) | 9 WebInspector.ElementStatePaneWidget = function() |
| 11 { | 10 { |
| 12 WebInspector.ElementsPanel.BaseToolbarPaneWidget.call(this, toolbarItem); | 11 WebInspector.Widget.call(this); |
| 13 this.element.className = "styles-element-state-pane"; | 12 this.element.className = "styles-element-state-pane"; |
| 14 this.element.createChild("div").createTextChild(WebInspector.UIString("Force
element state")); | 13 this.element.createChild("div").createTextChild(WebInspector.UIString("Force
element state")); |
| 15 var table = createElementWithClass("table", "source-code"); | 14 var table = createElementWithClass("table", "source-code"); |
| 16 | 15 |
| 17 var inputs = []; | 16 var inputs = []; |
| 18 this._inputs = inputs; | 17 this._inputs = inputs; |
| 19 | 18 |
| 20 /** | 19 /** |
| 21 * @param {!Event} event | 20 * @param {!Event} event |
| 22 */ | 21 */ |
| (...skipping 23 matching lines...) Expand all Loading... |
| 46 | 45 |
| 47 var tr = table.createChild("tr"); | 46 var tr = table.createChild("tr"); |
| 48 tr.appendChild(createCheckbox.call(null, "active")); | 47 tr.appendChild(createCheckbox.call(null, "active")); |
| 49 tr.appendChild(createCheckbox.call(null, "hover")); | 48 tr.appendChild(createCheckbox.call(null, "hover")); |
| 50 | 49 |
| 51 tr = table.createChild("tr"); | 50 tr = table.createChild("tr"); |
| 52 tr.appendChild(createCheckbox.call(null, "focus")); | 51 tr.appendChild(createCheckbox.call(null, "focus")); |
| 53 tr.appendChild(createCheckbox.call(null, "visited")); | 52 tr.appendChild(createCheckbox.call(null, "visited")); |
| 54 | 53 |
| 55 this.element.appendChild(table); | 54 this.element.appendChild(table); |
| 55 WebInspector.context.addFlavorChangeListener(WebInspector.DOMNode, this._upd
ate, this); |
| 56 } | 56 } |
| 57 | 57 |
| 58 WebInspector.ElementStatePaneWidget.prototype = { | 58 WebInspector.ElementStatePaneWidget.prototype = { |
| 59 /** | 59 /** |
| 60 * @param {?WebInspector.Target} target | 60 * @param {?WebInspector.Target} target |
| 61 */ | 61 */ |
| 62 _updateTarget: function(target) | 62 _updateTarget: function(target) |
| 63 { | 63 { |
| 64 if (this._target === target) | 64 if (this._target === target) |
| 65 return; | 65 return; |
| 66 | 66 |
| 67 if (this._target) { | 67 if (this._target) { |
| 68 var cssModel = WebInspector.CSSModel.fromTarget(this._target); | 68 var cssModel = WebInspector.CSSModel.fromTarget(this._target); |
| 69 cssModel.removeEventListener(WebInspector.CSSModel.Events.PseudoStat
eForced, this._pseudoStateForced, this) | 69 cssModel.removeEventListener(WebInspector.CSSModel.Events.PseudoStat
eForced, this._update, this) |
| 70 } | 70 } |
| 71 this._target = target; | 71 this._target = target; |
| 72 if (target) { | 72 if (target) { |
| 73 var cssModel = WebInspector.CSSModel.fromTarget(target); | 73 var cssModel = WebInspector.CSSModel.fromTarget(target); |
| 74 cssModel.addEventListener(WebInspector.CSSModel.Events.PseudoStateFo
rced, this._pseudoStateForced, this) | 74 cssModel.addEventListener(WebInspector.CSSModel.Events.PseudoStateFo
rced, this._update, this) |
| 75 } | 75 } |
| 76 }, | 76 }, |
| 77 | 77 |
| 78 /** | 78 /** |
| 79 * @param {!WebInspector.Event} event | 79 * @override |
| 80 */ | 80 */ |
| 81 _pseudoStateForced: function(event) | 81 wasShown: function() |
| 82 { | 82 { |
| 83 this.update(); | 83 this._update(); |
| 84 }, | 84 }, |
| 85 | 85 |
| 86 /** | 86 _update: function() |
| 87 * @override | |
| 88 * @param {?WebInspector.DOMNode} newNode | |
| 89 */ | |
| 90 onNodeChanged: function(newNode) | |
| 91 { | 87 { |
| 92 this._updateTarget(newNode ? newNode.target() : null); | 88 if (!this.isShowing()) |
| 93 this.update(); | 89 return; |
| 94 }, | |
| 95 | 90 |
| 96 /** | |
| 97 * @override | |
| 98 * @return {!Promise.<?>} | |
| 99 */ | |
| 100 doUpdate: function() | |
| 101 { | |
| 102 var node = WebInspector.context.flavor(WebInspector.DOMNode); | 91 var node = WebInspector.context.flavor(WebInspector.DOMNode); |
| 92 if (node) |
| 93 node = node.enclosingElementOrSelf(); |
| 94 |
| 95 this._updateTarget(node ? node.target() : null); |
| 103 if (node) { | 96 if (node) { |
| 104 var nodePseudoState = WebInspector.CSSModel.fromNode(node).pseudoSta
te(node); | 97 var nodePseudoState = WebInspector.CSSModel.fromNode(node).pseudoSta
te(node); |
| 105 for (var input of this._inputs) { | 98 for (var input of this._inputs) { |
| 106 input.disabled = !!node.pseudoType(); | 99 input.disabled = !!node.pseudoType(); |
| 107 input.checked = nodePseudoState.indexOf(input.state) >= 0; | 100 input.checked = nodePseudoState.indexOf(input.state) >= 0; |
| 108 } | 101 } |
| 109 } else { | 102 } else { |
| 110 for (var input of this._inputs) { | 103 for (var input of this._inputs) { |
| 111 input.disabled = true; | 104 input.disabled = true; |
| 112 input.checked = false; | 105 input.checked = false; |
| 113 } | 106 } |
| 114 } | 107 } |
| 115 return Promise.resolve(); | |
| 116 }, | 108 }, |
| 117 | 109 |
| 118 __proto__: WebInspector.ElementsPanel.BaseToolbarPaneWidget.prototype | 110 __proto__: WebInspector.Widget.prototype |
| 119 } | 111 } |
| 120 | 112 |
| 121 /** | 113 /** |
| 122 * @constructor | 114 * @constructor |
| 123 * @implements {WebInspector.ToolbarItem.Provider} | 115 * @implements {WebInspector.ToolbarItem.Provider} |
| 124 */ | 116 */ |
| 125 WebInspector.ElementStatePaneWidget.ButtonProvider = function() | 117 WebInspector.ElementStatePaneWidget.ButtonProvider = function() |
| 126 { | 118 { |
| 127 this._button = new WebInspector.ToolbarToggle(WebInspector.UIString("Toggle
Element State"), "", WebInspector.UIString(":hov")); | 119 this._button = new WebInspector.ToolbarToggle(WebInspector.UIString("Toggle
Element State"), "", WebInspector.UIString(":hov")); |
| 128 this._button.addEventListener("click", this._clicked, this); | 120 this._button.addEventListener("click", this._clicked, this); |
| 129 this._button.element.classList.add("monospace"); | 121 this._button.element.classList.add("monospace"); |
| 130 this._view = new WebInspector.ElementStatePaneWidget(this.item()); | 122 this._view = new WebInspector.ElementStatePaneWidget(); |
| 131 WebInspector.context.addFlavorChangeListener(WebInspector.DOMNode, this._nod
eChanged, this); | |
| 132 this._nodeChanged(); | |
| 133 } | 123 } |
| 134 | 124 |
| 135 WebInspector.ElementStatePaneWidget.ButtonProvider.prototype = { | 125 WebInspector.ElementStatePaneWidget.ButtonProvider.prototype = { |
| 136 _clicked: function() | 126 _clicked: function() |
| 137 { | 127 { |
| 138 WebInspector.ElementsPanel.instance().showToolbarPane(!this._view.isShow
ing() ? this._view : null); | 128 WebInspector.ElementsPanel.instance().showToolbarPane(!this._view.isShow
ing() ? this._view : null, this._button); |
| 139 }, | 129 }, |
| 140 | 130 |
| 141 /** | 131 /** |
| 142 * @override | 132 * @override |
| 143 * @return {!WebInspector.ToolbarItem} | 133 * @return {!WebInspector.ToolbarItem} |
| 144 */ | 134 */ |
| 145 item: function() | 135 item: function() |
| 146 { | 136 { |
| 147 return this._button; | 137 return this._button; |
| 148 }, | |
| 149 | |
| 150 _nodeChanged: function() | |
| 151 { | |
| 152 var enabled = !!WebInspector.context.flavor(WebInspector.DOMNode); | |
| 153 this._button.setEnabled(enabled); | |
| 154 if (!enabled && this._button.toggled()) | |
| 155 WebInspector.ElementsPanel.instance().showToolbarPane(null); | |
| 156 } | 138 } |
| 157 } | 139 } |
| OLD | NEW |