| OLD | NEW |
| 1 /* | 1 /* |
| 2 * Copyright (C) 2008 Nokia Inc. All rights reserved. | 2 * Copyright (C) 2008 Nokia Inc. All rights reserved. |
| 3 * Copyright (C) 2013 Samsung Electronics. All rights reserved. | 3 * Copyright (C) 2013 Samsung Electronics. All rights reserved. |
| 4 * | 4 * |
| 5 * Redistribution and use in source and binary forms, with or without | 5 * Redistribution and use in source and binary forms, with or without |
| 6 * modification, are permitted provided that the following conditions | 6 * modification, are permitted provided that the following conditions |
| 7 * are met: | 7 * are met: |
| 8 * 1. Redistributions of source code must retain the above copyright | 8 * 1. Redistributions of source code must retain the above copyright |
| 9 * notice, this list of conditions and the following disclaimer. | 9 * notice, this list of conditions and the following disclaimer. |
| 10 * 2. Redistributions in binary form must reproduce the above copyright | 10 * 2. Redistributions in binary form must reproduce the above copyright |
| 11 * notice, this list of conditions and the following disclaimer in the | 11 * notice, this list of conditions and the following disclaimer in the |
| 12 * documentation and/or other materials provided with the distribution. | 12 * documentation and/or other materials provided with the distribution. |
| 13 * | 13 * |
| 14 * THIS SOFTWARE IS PROVIDED ``AS IS'' AND ANY | 14 * THIS SOFTWARE IS PROVIDED ``AS IS'' AND ANY |
| 15 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | 15 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
| 16 * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR | 16 * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR |
| 17 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR | 17 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR |
| 18 * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, | 18 * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, |
| 19 * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, | 19 * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, |
| 20 * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR | 20 * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR |
| 21 * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY | 21 * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY |
| 22 * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT | 22 * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT |
| 23 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE | 23 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE |
| 24 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. | 24 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
| 25 */ | 25 */ |
| 26 | |
| 27 /** | 26 /** |
| 28 * @constructor | 27 * @unrestricted |
| 29 * @extends {WebInspector.SimpleView} | |
| 30 */ | 28 */ |
| 31 WebInspector.DOMStorageItemsView = function(domStorage) | 29 WebInspector.DOMStorageItemsView = class extends WebInspector.SimpleView { |
| 32 { | 30 constructor(domStorage) { |
| 33 WebInspector.SimpleView.call(this, WebInspector.UIString("DOM Storage")); | 31 super(WebInspector.UIString('DOM Storage')); |
| 34 | 32 |
| 35 this.domStorage = domStorage; | 33 this.domStorage = domStorage; |
| 36 | 34 |
| 37 this.element.classList.add("storage-view", "table"); | 35 this.element.classList.add('storage-view', 'table'); |
| 38 | 36 |
| 39 this.deleteButton = new WebInspector.ToolbarButton(WebInspector.UIString("De
lete"), "delete-toolbar-item"); | 37 this.deleteButton = new WebInspector.ToolbarButton(WebInspector.UIString('De
lete'), 'delete-toolbar-item'); |
| 40 this.deleteButton.setVisible(false); | 38 this.deleteButton.setVisible(false); |
| 41 this.deleteButton.addEventListener("click", this._deleteButtonClicked, this)
; | 39 this.deleteButton.addEventListener('click', this._deleteButtonClicked, this)
; |
| 42 | 40 |
| 43 this.refreshButton = new WebInspector.ToolbarButton(WebInspector.UIString("R
efresh"), "refresh-toolbar-item"); | 41 this.refreshButton = new WebInspector.ToolbarButton(WebInspector.UIString('R
efresh'), 'refresh-toolbar-item'); |
| 44 this.refreshButton.addEventListener("click", this._refreshButtonClicked, thi
s); | 42 this.refreshButton.addEventListener('click', this._refreshButtonClicked, thi
s); |
| 45 | 43 |
| 46 this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageIt
emsCleared, this._domStorageItemsCleared, this); | 44 this.domStorage.addEventListener( |
| 47 this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageIt
emRemoved, this._domStorageItemRemoved, this); | 45 WebInspector.DOMStorage.Events.DOMStorageItemsCleared, this._domStorageI
temsCleared, this); |
| 48 this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageIt
emAdded, this._domStorageItemAdded, this); | 46 this.domStorage.addEventListener( |
| 49 this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageIt
emUpdated, this._domStorageItemUpdated, this); | 47 WebInspector.DOMStorage.Events.DOMStorageItemRemoved, this._domStorageIt
emRemoved, this); |
| 48 this.domStorage.addEventListener( |
| 49 WebInspector.DOMStorage.Events.DOMStorageItemAdded, this._domStorageItem
Added, this); |
| 50 this.domStorage.addEventListener( |
| 51 WebInspector.DOMStorage.Events.DOMStorageItemUpdated, this._domStorageIt
emUpdated, this); |
| 52 } |
| 53 |
| 54 /** |
| 55 * @override |
| 56 * @return {!Array.<!WebInspector.ToolbarItem>} |
| 57 */ |
| 58 syncToolbarItems() { |
| 59 return [this.refreshButton, this.deleteButton]; |
| 60 } |
| 61 |
| 62 /** |
| 63 * @override |
| 64 */ |
| 65 wasShown() { |
| 66 this._update(); |
| 67 } |
| 68 |
| 69 /** |
| 70 * @override |
| 71 */ |
| 72 willHide() { |
| 73 this.deleteButton.setVisible(false); |
| 74 } |
| 75 |
| 76 /** |
| 77 * @param {!WebInspector.Event} event |
| 78 */ |
| 79 _domStorageItemsCleared(event) { |
| 80 if (!this.isShowing() || !this._dataGrid) |
| 81 return; |
| 82 |
| 83 this._dataGrid.rootNode().removeChildren(); |
| 84 this._dataGrid.addCreationNode(false); |
| 85 this.deleteButton.setVisible(false); |
| 86 event.consume(true); |
| 87 } |
| 88 |
| 89 /** |
| 90 * @param {!WebInspector.Event} event |
| 91 */ |
| 92 _domStorageItemRemoved(event) { |
| 93 if (!this.isShowing() || !this._dataGrid) |
| 94 return; |
| 95 |
| 96 var storageData = event.data; |
| 97 var rootNode = this._dataGrid.rootNode(); |
| 98 var children = rootNode.children; |
| 99 |
| 100 event.consume(true); |
| 101 |
| 102 for (var i = 0; i < children.length; ++i) { |
| 103 var childNode = children[i]; |
| 104 if (childNode.data.key === storageData.key) { |
| 105 rootNode.removeChild(childNode); |
| 106 this.deleteButton.setVisible(children.length > 1); |
| 107 return; |
| 108 } |
| 109 } |
| 110 } |
| 111 |
| 112 /** |
| 113 * @param {!WebInspector.Event} event |
| 114 */ |
| 115 _domStorageItemAdded(event) { |
| 116 if (!this.isShowing() || !this._dataGrid) |
| 117 return; |
| 118 |
| 119 var storageData = event.data; |
| 120 var rootNode = this._dataGrid.rootNode(); |
| 121 var children = rootNode.children; |
| 122 |
| 123 event.consume(true); |
| 124 this.deleteButton.setVisible(true); |
| 125 |
| 126 for (var i = 0; i < children.length; ++i) |
| 127 if (children[i].data.key === storageData.key) |
| 128 return; |
| 129 |
| 130 var childNode = new WebInspector.DataGridNode({key: storageData.key, value:
storageData.value}, false); |
| 131 rootNode.insertChild(childNode, children.length - 1); |
| 132 } |
| 133 |
| 134 /** |
| 135 * @param {!WebInspector.Event} event |
| 136 */ |
| 137 _domStorageItemUpdated(event) { |
| 138 if (!this.isShowing() || !this._dataGrid) |
| 139 return; |
| 140 |
| 141 var storageData = event.data; |
| 142 var rootNode = this._dataGrid.rootNode(); |
| 143 var children = rootNode.children; |
| 144 |
| 145 event.consume(true); |
| 146 |
| 147 var keyFound = false; |
| 148 for (var i = 0; i < children.length; ++i) { |
| 149 var childNode = children[i]; |
| 150 if (childNode.data.key === storageData.key) { |
| 151 if (keyFound) { |
| 152 rootNode.removeChild(childNode); |
| 153 return; |
| 154 } |
| 155 keyFound = true; |
| 156 if (childNode.data.value !== storageData.value) { |
| 157 childNode.data.value = storageData.value; |
| 158 childNode.refresh(); |
| 159 childNode.select(); |
| 160 childNode.reveal(); |
| 161 } |
| 162 this.deleteButton.setVisible(true); |
| 163 } |
| 164 } |
| 165 } |
| 166 |
| 167 _update() { |
| 168 this.detachChildWidgets(); |
| 169 this.domStorage.getItems(this._showDOMStorageItems.bind(this)); |
| 170 } |
| 171 |
| 172 _showDOMStorageItems(error, items) { |
| 173 if (error) |
| 174 return; |
| 175 |
| 176 this._dataGrid = this._dataGridForDOMStorageItems(items); |
| 177 this._dataGrid.asWidget().show(this.element); |
| 178 this.deleteButton.setVisible(this._dataGrid.rootNode().children.length > 1); |
| 179 } |
| 180 |
| 181 _dataGridForDOMStorageItems(items) { |
| 182 var columns = /** @type {!Array<!WebInspector.DataGrid.ColumnDescriptor>} */
([ |
| 183 {id: 'key', title: WebInspector.UIString('Key'), sortable: false, editable
: true, weight: 50}, |
| 184 {id: 'value', title: WebInspector.UIString('Value'), sortable: false, edit
able: true, weight: 50} |
| 185 ]); |
| 186 |
| 187 var nodes = []; |
| 188 |
| 189 var keys = []; |
| 190 var length = items.length; |
| 191 for (var i = 0; i < items.length; i++) { |
| 192 var key = items[i][0]; |
| 193 var value = items[i][1]; |
| 194 var node = new WebInspector.DataGridNode({key: key, value: value}, false); |
| 195 node.selectable = true; |
| 196 nodes.push(node); |
| 197 keys.push(key); |
| 198 } |
| 199 |
| 200 var dataGrid = |
| 201 new WebInspector.DataGrid(columns, this._editingCallback.bind(this), thi
s._deleteCallback.bind(this)); |
| 202 dataGrid.setName('DOMStorageItemsView'); |
| 203 length = nodes.length; |
| 204 for (var i = 0; i < length; ++i) |
| 205 dataGrid.rootNode().appendChild(nodes[i]); |
| 206 dataGrid.addCreationNode(false); |
| 207 if (length > 0) |
| 208 nodes[0].selected = true; |
| 209 return dataGrid; |
| 210 } |
| 211 |
| 212 _deleteButtonClicked(event) { |
| 213 if (!this._dataGrid || !this._dataGrid.selectedNode) |
| 214 return; |
| 215 |
| 216 this._deleteCallback(this._dataGrid.selectedNode); |
| 217 } |
| 218 |
| 219 _refreshButtonClicked(event) { |
| 220 this._update(); |
| 221 } |
| 222 |
| 223 _editingCallback(editingNode, columnIdentifier, oldText, newText) { |
| 224 var domStorage = this.domStorage; |
| 225 if (columnIdentifier === 'key') { |
| 226 if (typeof oldText === 'string') |
| 227 domStorage.removeItem(oldText); |
| 228 domStorage.setItem(newText, editingNode.data.value || ''); |
| 229 this._removeDupes(editingNode); |
| 230 } else |
| 231 domStorage.setItem(editingNode.data.key || '', newText); |
| 232 } |
| 233 |
| 234 /** |
| 235 * @param {!WebInspector.DataGridNode} masterNode |
| 236 */ |
| 237 _removeDupes(masterNode) { |
| 238 var rootNode = this._dataGrid.rootNode(); |
| 239 var children = rootNode.children; |
| 240 for (var i = children.length - 1; i >= 0; --i) { |
| 241 var childNode = children[i]; |
| 242 if ((childNode.data.key === masterNode.data.key) && (masterNode !== childN
ode)) |
| 243 rootNode.removeChild(childNode); |
| 244 } |
| 245 } |
| 246 |
| 247 _deleteCallback(node) { |
| 248 if (!node || node.isCreationNode) |
| 249 return; |
| 250 |
| 251 if (this.domStorage) |
| 252 this.domStorage.removeItem(node.data.key); |
| 253 } |
| 50 }; | 254 }; |
| 51 | |
| 52 WebInspector.DOMStorageItemsView.prototype = { | |
| 53 /** | |
| 54 * @override | |
| 55 * @return {!Array.<!WebInspector.ToolbarItem>} | |
| 56 */ | |
| 57 syncToolbarItems: function() | |
| 58 { | |
| 59 return [this.refreshButton, this.deleteButton]; | |
| 60 }, | |
| 61 | |
| 62 wasShown: function() | |
| 63 { | |
| 64 this._update(); | |
| 65 }, | |
| 66 | |
| 67 willHide: function() | |
| 68 { | |
| 69 this.deleteButton.setVisible(false); | |
| 70 }, | |
| 71 | |
| 72 /** | |
| 73 * @param {!WebInspector.Event} event | |
| 74 */ | |
| 75 _domStorageItemsCleared: function(event) | |
| 76 { | |
| 77 if (!this.isShowing() || !this._dataGrid) | |
| 78 return; | |
| 79 | |
| 80 this._dataGrid.rootNode().removeChildren(); | |
| 81 this._dataGrid.addCreationNode(false); | |
| 82 this.deleteButton.setVisible(false); | |
| 83 event.consume(true); | |
| 84 }, | |
| 85 | |
| 86 /** | |
| 87 * @param {!WebInspector.Event} event | |
| 88 */ | |
| 89 _domStorageItemRemoved: function(event) | |
| 90 { | |
| 91 if (!this.isShowing() || !this._dataGrid) | |
| 92 return; | |
| 93 | |
| 94 var storageData = event.data; | |
| 95 var rootNode = this._dataGrid.rootNode(); | |
| 96 var children = rootNode.children; | |
| 97 | |
| 98 event.consume(true); | |
| 99 | |
| 100 for (var i = 0; i < children.length; ++i) { | |
| 101 var childNode = children[i]; | |
| 102 if (childNode.data.key === storageData.key) { | |
| 103 rootNode.removeChild(childNode); | |
| 104 this.deleteButton.setVisible(children.length > 1); | |
| 105 return; | |
| 106 } | |
| 107 } | |
| 108 }, | |
| 109 | |
| 110 /** | |
| 111 * @param {!WebInspector.Event} event | |
| 112 */ | |
| 113 _domStorageItemAdded: function(event) | |
| 114 { | |
| 115 if (!this.isShowing() || !this._dataGrid) | |
| 116 return; | |
| 117 | |
| 118 var storageData = event.data; | |
| 119 var rootNode = this._dataGrid.rootNode(); | |
| 120 var children = rootNode.children; | |
| 121 | |
| 122 event.consume(true); | |
| 123 this.deleteButton.setVisible(true); | |
| 124 | |
| 125 for (var i = 0; i < children.length; ++i) | |
| 126 if (children[i].data.key === storageData.key) | |
| 127 return; | |
| 128 | |
| 129 var childNode = new WebInspector.DataGridNode({key: storageData.key, val
ue: storageData.value}, false); | |
| 130 rootNode.insertChild(childNode, children.length - 1); | |
| 131 }, | |
| 132 | |
| 133 /** | |
| 134 * @param {!WebInspector.Event} event | |
| 135 */ | |
| 136 _domStorageItemUpdated: function(event) | |
| 137 { | |
| 138 if (!this.isShowing() || !this._dataGrid) | |
| 139 return; | |
| 140 | |
| 141 var storageData = event.data; | |
| 142 var rootNode = this._dataGrid.rootNode(); | |
| 143 var children = rootNode.children; | |
| 144 | |
| 145 event.consume(true); | |
| 146 | |
| 147 var keyFound = false; | |
| 148 for (var i = 0; i < children.length; ++i) { | |
| 149 var childNode = children[i]; | |
| 150 if (childNode.data.key === storageData.key) { | |
| 151 if (keyFound) { | |
| 152 rootNode.removeChild(childNode); | |
| 153 return; | |
| 154 } | |
| 155 keyFound = true; | |
| 156 if (childNode.data.value !== storageData.value) { | |
| 157 childNode.data.value = storageData.value; | |
| 158 childNode.refresh(); | |
| 159 childNode.select(); | |
| 160 childNode.reveal(); | |
| 161 } | |
| 162 this.deleteButton.setVisible(true); | |
| 163 } | |
| 164 } | |
| 165 }, | |
| 166 | |
| 167 _update: function() | |
| 168 { | |
| 169 this.detachChildWidgets(); | |
| 170 this.domStorage.getItems(this._showDOMStorageItems.bind(this)); | |
| 171 }, | |
| 172 | |
| 173 _showDOMStorageItems: function(error, items) | |
| 174 { | |
| 175 if (error) | |
| 176 return; | |
| 177 | |
| 178 this._dataGrid = this._dataGridForDOMStorageItems(items); | |
| 179 this._dataGrid.asWidget().show(this.element); | |
| 180 this.deleteButton.setVisible(this._dataGrid.rootNode().children.length >
1); | |
| 181 }, | |
| 182 | |
| 183 _dataGridForDOMStorageItems: function(items) | |
| 184 { | |
| 185 var columns = /** @type {!Array<!WebInspector.DataGrid.ColumnDescriptor>
} */ ([ | |
| 186 {id: "key", title: WebInspector.UIString("Key"), sortable: false, ed
itable: true, weight: 50}, | |
| 187 {id: "value", title: WebInspector.UIString("Value"), sortable: false
, editable: true, weight: 50} | |
| 188 ]); | |
| 189 | |
| 190 var nodes = []; | |
| 191 | |
| 192 var keys = []; | |
| 193 var length = items.length; | |
| 194 for (var i = 0; i < items.length; i++) { | |
| 195 var key = items[i][0]; | |
| 196 var value = items[i][1]; | |
| 197 var node = new WebInspector.DataGridNode({key: key, value: value}, f
alse); | |
| 198 node.selectable = true; | |
| 199 nodes.push(node); | |
| 200 keys.push(key); | |
| 201 } | |
| 202 | |
| 203 var dataGrid = new WebInspector.DataGrid(columns, this._editingCallback.
bind(this), this._deleteCallback.bind(this)); | |
| 204 dataGrid.setName("DOMStorageItemsView"); | |
| 205 length = nodes.length; | |
| 206 for (var i = 0; i < length; ++i) | |
| 207 dataGrid.rootNode().appendChild(nodes[i]); | |
| 208 dataGrid.addCreationNode(false); | |
| 209 if (length > 0) | |
| 210 nodes[0].selected = true; | |
| 211 return dataGrid; | |
| 212 }, | |
| 213 | |
| 214 _deleteButtonClicked: function(event) | |
| 215 { | |
| 216 if (!this._dataGrid || !this._dataGrid.selectedNode) | |
| 217 return; | |
| 218 | |
| 219 this._deleteCallback(this._dataGrid.selectedNode); | |
| 220 }, | |
| 221 | |
| 222 _refreshButtonClicked: function(event) | |
| 223 { | |
| 224 this._update(); | |
| 225 }, | |
| 226 | |
| 227 _editingCallback: function(editingNode, columnIdentifier, oldText, newText) | |
| 228 { | |
| 229 var domStorage = this.domStorage; | |
| 230 if (columnIdentifier === "key") { | |
| 231 if (typeof oldText === "string") | |
| 232 domStorage.removeItem(oldText); | |
| 233 domStorage.setItem(newText, editingNode.data.value || ""); | |
| 234 this._removeDupes(editingNode); | |
| 235 } else | |
| 236 domStorage.setItem(editingNode.data.key || "", newText); | |
| 237 }, | |
| 238 | |
| 239 /** | |
| 240 * @param {!WebInspector.DataGridNode} masterNode | |
| 241 */ | |
| 242 _removeDupes: function(masterNode) | |
| 243 { | |
| 244 var rootNode = this._dataGrid.rootNode(); | |
| 245 var children = rootNode.children; | |
| 246 for (var i = children.length - 1; i >= 0; --i) { | |
| 247 var childNode = children[i]; | |
| 248 if ((childNode.data.key === masterNode.data.key) && (masterNode !==
childNode)) | |
| 249 rootNode.removeChild(childNode); | |
| 250 } | |
| 251 }, | |
| 252 | |
| 253 _deleteCallback: function(node) | |
| 254 { | |
| 255 if (!node || node.isCreationNode) | |
| 256 return; | |
| 257 | |
| 258 if (this.domStorage) | |
| 259 this.domStorage.removeItem(node.data.key); | |
| 260 }, | |
| 261 | |
| 262 __proto__: WebInspector.SimpleView.prototype | |
| 263 }; | |
| OLD | NEW |