| OLD | NEW |
| 1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 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 * @unrestricted | 5 * @unrestricted |
| 6 */ | 6 */ |
| 7 WebInspector.ARIAAttributesPane = class extends WebInspector.AccessibilitySubPan
e { | 7 Accessibility.ARIAAttributesPane = class extends Accessibility.AccessibilitySubP
ane { |
| 8 constructor() { | 8 constructor() { |
| 9 super(WebInspector.UIString('ARIA Attributes')); | 9 super(Common.UIString('ARIA Attributes')); |
| 10 | 10 |
| 11 this._noPropertiesInfo = this.createInfo(WebInspector.UIString('No ARIA attr
ibutes')); | 11 this._noPropertiesInfo = this.createInfo(Common.UIString('No ARIA attributes
')); |
| 12 this._treeOutline = this.createTreeOutline(); | 12 this._treeOutline = this.createTreeOutline(); |
| 13 } | 13 } |
| 14 | 14 |
| 15 /** | 15 /** |
| 16 * @override | 16 * @override |
| 17 * @param {?WebInspector.DOMNode} node | 17 * @param {?SDK.DOMNode} node |
| 18 */ | 18 */ |
| 19 setNode(node) { | 19 setNode(node) { |
| 20 super.setNode(node); | 20 super.setNode(node); |
| 21 this._treeOutline.removeChildren(); | 21 this._treeOutline.removeChildren(); |
| 22 if (!this.node()) | 22 if (!this.node()) |
| 23 return; | 23 return; |
| 24 var target = this.node().target(); | 24 var target = this.node().target(); |
| 25 var attributes = node.attributes(); | 25 var attributes = node.attributes(); |
| 26 for (var i = 0; i < attributes.length; ++i) { | 26 for (var i = 0; i < attributes.length; ++i) { |
| 27 var attribute = attributes[i]; | 27 var attribute = attributes[i]; |
| 28 if (WebInspector.ARIAAttributesPane._attributes.indexOf(attribute.name) <
0) | 28 if (Accessibility.ARIAAttributesPane._attributes.indexOf(attribute.name) <
0) |
| 29 continue; | 29 continue; |
| 30 this._treeOutline.appendChild(new WebInspector.ARIAAttributesTreeElement(t
his, attribute, target)); | 30 this._treeOutline.appendChild(new Accessibility.ARIAAttributesTreeElement(
this, attribute, target)); |
| 31 } | 31 } |
| 32 | 32 |
| 33 var foundAttributes = (this._treeOutline.rootElement().childCount() !== 0); | 33 var foundAttributes = (this._treeOutline.rootElement().childCount() !== 0); |
| 34 this._noPropertiesInfo.classList.toggle('hidden', foundAttributes); | 34 this._noPropertiesInfo.classList.toggle('hidden', foundAttributes); |
| 35 this._treeOutline.element.classList.toggle('hidden', !foundAttributes); | 35 this._treeOutline.element.classList.toggle('hidden', !foundAttributes); |
| 36 } | 36 } |
| 37 }; | 37 }; |
| 38 | 38 |
| 39 /** | 39 /** |
| 40 * @unrestricted | 40 * @unrestricted |
| 41 */ | 41 */ |
| 42 WebInspector.ARIAAttributesTreeElement = class extends TreeElement { | 42 Accessibility.ARIAAttributesTreeElement = class extends TreeElement { |
| 43 /** | 43 /** |
| 44 * @param {!WebInspector.ARIAAttributesPane} parentPane | 44 * @param {!Accessibility.ARIAAttributesPane} parentPane |
| 45 * @param {!WebInspector.DOMNode.Attribute} attribute | 45 * @param {!SDK.DOMNode.Attribute} attribute |
| 46 * @param {!WebInspector.Target} target | 46 * @param {!SDK.Target} target |
| 47 */ | 47 */ |
| 48 constructor(parentPane, attribute, target) { | 48 constructor(parentPane, attribute, target) { |
| 49 super(''); | 49 super(''); |
| 50 | 50 |
| 51 this._parentPane = parentPane; | 51 this._parentPane = parentPane; |
| 52 this._attribute = attribute; | 52 this._attribute = attribute; |
| 53 | 53 |
| 54 this.selectable = false; | 54 this.selectable = false; |
| 55 } | 55 } |
| 56 | 56 |
| (...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 88 this._nameElement.textContent = name; | 88 this._nameElement.textContent = name; |
| 89 this._nameElement.classList.add('ax-name'); | 89 this._nameElement.classList.add('ax-name'); |
| 90 this._nameElement.classList.add('monospace'); | 90 this._nameElement.classList.add('monospace'); |
| 91 this.listItemElement.appendChild(this._nameElement); | 91 this.listItemElement.appendChild(this._nameElement); |
| 92 } | 92 } |
| 93 | 93 |
| 94 /** | 94 /** |
| 95 * @param {string} value | 95 * @param {string} value |
| 96 */ | 96 */ |
| 97 appendAttributeValueElement(value) { | 97 appendAttributeValueElement(value) { |
| 98 this._valueElement = WebInspector.ARIAAttributesTreeElement.createARIAValueE
lement(value); | 98 this._valueElement = Accessibility.ARIAAttributesTreeElement.createARIAValue
Element(value); |
| 99 this.listItemElement.appendChild(this._valueElement); | 99 this.listItemElement.appendChild(this._valueElement); |
| 100 } | 100 } |
| 101 | 101 |
| 102 /** | 102 /** |
| 103 * @param {!Event} event | 103 * @param {!Event} event |
| 104 */ | 104 */ |
| 105 _mouseClick(event) { | 105 _mouseClick(event) { |
| 106 if (event.target === this.listItemElement) | 106 if (event.target === this.listItemElement) |
| 107 return; | 107 return; |
| 108 | 108 |
| 109 event.consume(true); | 109 event.consume(true); |
| 110 | 110 |
| 111 this._startEditing(); | 111 this._startEditing(); |
| 112 } | 112 } |
| 113 | 113 |
| 114 _startEditing() { | 114 _startEditing() { |
| 115 var valueElement = this._valueElement; | 115 var valueElement = this._valueElement; |
| 116 | 116 |
| 117 if (WebInspector.isBeingEdited(valueElement)) | 117 if (UI.isBeingEdited(valueElement)) |
| 118 return; | 118 return; |
| 119 | 119 |
| 120 var previousContent = valueElement.textContent; | 120 var previousContent = valueElement.textContent; |
| 121 | 121 |
| 122 /** | 122 /** |
| 123 * @param {string} previousContent | 123 * @param {string} previousContent |
| 124 * @param {!Event} event | 124 * @param {!Event} event |
| 125 * @this {WebInspector.ARIAAttributesTreeElement} | 125 * @this {Accessibility.ARIAAttributesTreeElement} |
| 126 */ | 126 */ |
| 127 function blurListener(previousContent, event) { | 127 function blurListener(previousContent, event) { |
| 128 var text = event.target.textContent; | 128 var text = event.target.textContent; |
| 129 this._editingCommitted(text, previousContent); | 129 this._editingCommitted(text, previousContent); |
| 130 } | 130 } |
| 131 | 131 |
| 132 this._prompt = new WebInspector.ARIAAttributesPane.ARIAAttributePrompt( | 132 this._prompt = new Accessibility.ARIAAttributesPane.ARIAAttributePrompt( |
| 133 WebInspector.ariaMetadata().valuesForProperty(this._nameElement.textCont
ent), this); | 133 Accessibility.ariaMetadata().valuesForProperty(this._nameElement.textCon
tent), this); |
| 134 this._prompt.setAutocompletionTimeout(0); | 134 this._prompt.setAutocompletionTimeout(0); |
| 135 var proxyElement = this._prompt.attachAndStartEditing(valueElement, blurList
ener.bind(this, previousContent)); | 135 var proxyElement = this._prompt.attachAndStartEditing(valueElement, blurList
ener.bind(this, previousContent)); |
| 136 | 136 |
| 137 proxyElement.addEventListener('keydown', this._editingValueKeyDown.bind(this
, previousContent), false); | 137 proxyElement.addEventListener('keydown', this._editingValueKeyDown.bind(this
, previousContent), false); |
| 138 | 138 |
| 139 valueElement.getComponentSelection().setBaseAndExtent(valueElement, 0, value
Element, 1); | 139 valueElement.getComponentSelection().setBaseAndExtent(valueElement, 0, value
Element, 1); |
| 140 } | 140 } |
| 141 | 141 |
| 142 _removePrompt() { | 142 _removePrompt() { |
| 143 if (!this._prompt) | 143 if (!this._prompt) |
| (...skipping 26 matching lines...) Expand all Loading... |
| 170 _editingValueKeyDown(previousContent, event) { | 170 _editingValueKeyDown(previousContent, event) { |
| 171 if (event.handled) | 171 if (event.handled) |
| 172 return; | 172 return; |
| 173 | 173 |
| 174 if (isEnterKey(event)) { | 174 if (isEnterKey(event)) { |
| 175 this._editingCommitted(event.target.textContent, previousContent); | 175 this._editingCommitted(event.target.textContent, previousContent); |
| 176 event.consume(); | 176 event.consume(); |
| 177 return; | 177 return; |
| 178 } | 178 } |
| 179 | 179 |
| 180 if (event.keyCode === WebInspector.KeyboardShortcut.Keys.Esc.code || event.k
eyIdentifier === 'U+001B') { | 180 if (event.keyCode === UI.KeyboardShortcut.Keys.Esc.code || event.keyIdentifi
er === 'U+001B') { |
| 181 this._editingCancelled(); | 181 this._editingCancelled(); |
| 182 event.consume(); | 182 event.consume(); |
| 183 return; | 183 return; |
| 184 } | 184 } |
| 185 } | 185 } |
| 186 }; | 186 }; |
| 187 | 187 |
| 188 | 188 |
| 189 /** | 189 /** |
| 190 * @unrestricted | 190 * @unrestricted |
| 191 */ | 191 */ |
| 192 WebInspector.ARIAAttributesPane.ARIAAttributePrompt = class extends WebInspector
.TextPrompt { | 192 Accessibility.ARIAAttributesPane.ARIAAttributePrompt = class extends UI.TextProm
pt { |
| 193 /** | 193 /** |
| 194 * @param {!Array<string>} ariaCompletions | 194 * @param {!Array<string>} ariaCompletions |
| 195 * @param {!WebInspector.ARIAAttributesTreeElement} treeElement | 195 * @param {!Accessibility.ARIAAttributesTreeElement} treeElement |
| 196 */ | 196 */ |
| 197 constructor(ariaCompletions, treeElement) { | 197 constructor(ariaCompletions, treeElement) { |
| 198 super(); | 198 super(); |
| 199 this.initialize(this._buildPropertyCompletions.bind(this)); | 199 this.initialize(this._buildPropertyCompletions.bind(this)); |
| 200 | 200 |
| 201 this.setSuggestBoxEnabled(true); | 201 this.setSuggestBoxEnabled(true); |
| 202 | 202 |
| 203 this._ariaCompletions = ariaCompletions; | 203 this._ariaCompletions = ariaCompletions; |
| 204 this._treeElement = treeElement; | 204 this._treeElement = treeElement; |
| 205 } | 205 } |
| (...skipping 10 matching lines...) Expand all Loading... |
| 216 completionsReadyCallback([]); | 216 completionsReadyCallback([]); |
| 217 return; | 217 return; |
| 218 } | 218 } |
| 219 | 219 |
| 220 var results = this._ariaCompletions.filter((value) => value.startsWith(prefi
x)); | 220 var results = this._ariaCompletions.filter((value) => value.startsWith(prefi
x)); |
| 221 | 221 |
| 222 completionsReadyCallback(results, 0); | 222 completionsReadyCallback(results, 0); |
| 223 } | 223 } |
| 224 }; | 224 }; |
| 225 | 225 |
| 226 WebInspector.ARIAAttributesPane._attributes = [ | 226 Accessibility.ARIAAttributesPane._attributes = [ |
| 227 'role', | 227 'role', |
| 228 'aria-busy', | 228 'aria-busy', |
| 229 'aria-checked', | 229 'aria-checked', |
| 230 'aria-disabled', | 230 'aria-disabled', |
| 231 'aria-expanded', | 231 'aria-expanded', |
| 232 'aria-grabbed', | 232 'aria-grabbed', |
| 233 'aria-hidden', | 233 'aria-hidden', |
| 234 'aria-invalid', | 234 'aria-invalid', |
| 235 'aria-pressed', | 235 'aria-pressed', |
| 236 'aria-selected', | 236 'aria-selected', |
| (...skipping 17 matching lines...) Expand all Loading... |
| 254 'aria-readonly', | 254 'aria-readonly', |
| 255 'aria-relevant', | 255 'aria-relevant', |
| 256 'aria-required', | 256 'aria-required', |
| 257 'aria-setsize', | 257 'aria-setsize', |
| 258 'aria-sort', | 258 'aria-sort', |
| 259 'aria-valuemax', | 259 'aria-valuemax', |
| 260 'aria-valuemin', | 260 'aria-valuemin', |
| 261 'aria-valuenow', | 261 'aria-valuenow', |
| 262 'aria-valuetext', | 262 'aria-valuetext', |
| 263 ]; | 263 ]; |
| OLD | NEW |