third_party/WebKit/Source/devtools/front_end/resources/DOMStorageItemsView.js

   1 /*
   2  * Copyright (C) 2008 Nokia Inc.  All rights reserved.
   3  * Copyright (C) 2013 Samsung Electronics. All rights reserved.
   4  *
   5  * Redistribution and use in source and binary forms, with or without
   6  * modification, are permitted provided that the following conditions
   7  * are met:
   8  * 1. Redistributions of source code must retain the above copyright
   9  *    notice, this list of conditions and the following disclaimer.
  10  * 2. Redistributions in binary form must reproduce the above copyright
  11  *    notice, this list of conditions and the following disclaimer in the
  12  *    documentation and/or other materials provided with the distribution.
  13  *
  14  * THIS SOFTWARE IS PROVIDED ``AS IS'' AND ANY
  15  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
  16  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
  17  * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
  18  * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
  19  * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
  20  * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
  21  * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
  22  * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  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.
  25  */
  26
  27 /**
  28  * @constructor
  29  * @extends {WebInspector.VBox}
  30  */
  31 WebInspector.DOMStorageItemsView = function(domStorage)
  32 {
  33     WebInspector.VBox.call(this);
  34
  35     this.domStorage = domStorage;
  36
  37     this.element.classList.add("storage-view", "table");
  38
  39     this.deleteButton = new WebInspector.ToolbarButton(WebInspector.UIString("Delete"), "delete-toolbar-item");
  40     this.deleteButton.setVisible(false);
  41     this.deleteButton.addEventListener("click", this._deleteButtonClicked, this);
  42
  43     this.refreshButton = new WebInspector.ToolbarButton(WebInspector.UIString("Refresh"), "refresh-toolbar-item");
  44     this.refreshButton.addEventListener("click", this._refreshButtonClicked, this);
  45
  46     this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageItemsCleared, this._domStorageItemsCleared, this);
  47     this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageItemRemoved, this._domStorageItemRemoved, this);
  48     this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageItemAdded, this._domStorageItemAdded, this);
  49     this.domStorage.addEventListener(WebInspector.DOMStorage.Events.DOMStorageItemUpdated, this._domStorageItemUpdated, this);
  50 }
  51
  52 WebInspector.DOMStorageItemsView.prototype = {
  53     /**
  54      * @return {!Array.<!WebInspector.ToolbarItem>}
  55      */
  56     toolbarItems: function()
  57     {
  58         return [this.refreshButton, this.deleteButton];
  59     },
  60
  61     wasShown: function()
  62     {
  63         this._update();
  64     },
  65
  66     willHide: function()
  67     {
  68         this.deleteButton.setVisible(false);
  69     },
  70
  71     /**
  72      * @param {!WebInspector.Event} event
  73      */
  74     _domStorageItemsCleared: function(event)
  75     {
  76         if (!this.isShowing() || !this._dataGrid)
  77             return;
  78
  79         this._dataGrid.rootNode().removeChildren();
  80         this._dataGrid.addCreationNode(false);
  81         this.deleteButton.setVisible(false);
  82         event.consume(true);
  83     },
  84
  85     /**
  86      * @param {!WebInspector.Event} event
  87      */
  88     _domStorageItemRemoved: function(event)
  89     {
  90         if (!this.isShowing() || !this._dataGrid)
  91             return;
  92
  93         var storageData = event.data;
  94         var rootNode = this._dataGrid.rootNode();
  95         var children = rootNode.children;
  96
  97         event.consume(true);
  98
  99         for (var i = 0; i < children.length; ++i) {
 100             var childNode = children[i];
 101             if (childNode.data.key === storageData.key) {
 102                 rootNode.removeChild(childNode);
 103                 this.deleteButton.setVisible(children.length > 1);
 104                 return;
 105             }
 106         }
 107     },
 108
 109     /**
 110      * @param {!WebInspector.Event} event
 111      */
 112     _domStorageItemAdded: function(event)
 113     {
 114         if (!this.isShowing() || !this._dataGrid)
 115             return;
 116
 117         var storageData = event.data;
 118         var rootNode = this._dataGrid.rootNode();
 119         var children = rootNode.children;
 120
 121         event.consume(true);
 122         this.deleteButton.setVisible(true);
 123
 124         for (var i = 0; i < children.length; ++i)
 125             if (children[i].data.key === storageData.key)
 126                 return;
 127
 128         var childNode = new WebInspector.DataGridNode({key: storageData.key, value: storageData.value}, false);
 129         rootNode.insertChild(childNode, children.length - 1);
 130     },
 131
 132     /**
 133      * @param {!WebInspector.Event} event
 134      */
 135     _domStorageItemUpdated: function(event)
 136     {
 137         if (!this.isShowing() || !this._dataGrid)
 138             return;
 139
 140         var storageData = event.data;
 141         var rootNode = this._dataGrid.rootNode();
 142         var children = rootNode.children;
 143
 144         event.consume(true);
 145
 146         var keyFound = false;
 147         for (var i = 0; i < children.length; ++i) {
 148             var childNode = children[i];
 149             if (childNode.data.key === storageData.key) {
 150                 if (keyFound) {
 151                     rootNode.removeChild(childNode);
 152                     return;
 153                 }
 154                 keyFound = true;
 155                 if (childNode.data.value !== storageData.value) {
 156                     childNode.data.value = storageData.value;
 157                     childNode.refresh();
 158                     childNode.select();
 159                     childNode.reveal();
 160                 }
 161                 this.deleteButton.setVisible(true);
 162             }
 163         }
 164     },
 165
 166     _update: function()
 167     {
 168         this.detachChildWidgets();
 169         this.domStorage.getItems(this._showDOMStorageItems.bind(this));
 170     },
 171
 172     _showDOMStorageItems: function(error, items)
 173     {
 174         if (error)
 175             return;
 176
 177         this._dataGrid = this._dataGridForDOMStorageItems(items);
 178         this._dataGrid.show(this.element);
 179         this.deleteButton.setVisible(this._dataGrid.rootNode().children.length > 1);
 180     },
 181
 182     _dataGridForDOMStorageItems: function(items)
 183     {
 184         var columns = [
 185             {id: "key", title: WebInspector.UIString("Key"), editable: true, weight: 50},
 186             {id: "value", title: WebInspector.UIString("Value"), editable: true, weight: 50}
 187         ];
 188
 189         var nodes = [];
 190
 191         var keys = [];
 192         var length = items.length;
 193         for (var i = 0; i < items.length; i++) {
 194             var key = items[i][0];
 195             var value = items[i][1];
 196             var node = new WebInspector.DataGridNode({key: key, value: value}, false);
 197             node.selectable = true;
 198             nodes.push(node);
 199             keys.push(key);
 200         }
 201
 202         var dataGrid = new WebInspector.DataGrid(columns, this._editingCallback.bind(this), this._deleteCallback.bind(this));
 203         dataGrid.setName("DOMStorageItemsView");
 204         length = nodes.length;
 205         for (var i = 0; i < length; ++i)
 206             dataGrid.rootNode().appendChild(nodes[i]);
 207         dataGrid.addCreationNode(false);
 208         if (length > 0)
 209             nodes[0].selected = true;
 210         return dataGrid;
 211     },
 212
 213     _deleteButtonClicked: function(event)
 214     {
 215         if (!this._dataGrid || !this._dataGrid.selectedNode)
 216             return;
 217
 218         this._deleteCallback(this._dataGrid.selectedNode);
 219         this._dataGrid.changeNodeAfterDeletion();
 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 ("key" === columnIdentifier) {
 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.VBox.prototype
 263 }