third_party/WebKit/Source/devtools/front_end/settings/EditFileSystemDialog.js

   1 /*
   2  * Copyright (C) 2013 Google Inc. All rights reserved.
   3  *
   4  * Redistribution and use in source and binary forms, with or without
   5  * modification, are permitted provided that the following conditions are
   6  * met:
   7  *
   8  *     * Redistributions of source code must retain the above copyright
   9  * notice, this list of conditions and the following disclaimer.
  10  *     * Redistributions in binary form must reproduce the above
  11  * copyright notice, this list of conditions and the following disclaimer
  12  * in the documentation and/or other materials provided with the
  13  * distribution.
  14  *     * Neither the name of Google Inc. nor the names of its
  15  * contributors may be used to endorse or promote products derived from
  16  * this software without specific prior written permission.
  17  *
  18  * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
  19  * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
  20  * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
  21  * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
  22  * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
  23  * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
  24  * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
  25  * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
  26  * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  27  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  28  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  29  */
  30
  31 /**
  32  * @constructor
  33  * @extends {WebInspector.DialogDelegate}
  34  * @param {string} fileSystemPath
  35  */
  36 WebInspector.EditFileSystemDialog = function(fileSystemPath)
  37 {
  38     WebInspector.DialogDelegate.call(this);
  39     this.element.classList.add("dialog-contents");
  40     this._fileSystemPath = fileSystemPath;
  41
  42     var header = this.element.createChild("div", "header");
  43     var headerText = header.createChild("span");
  44     headerText.textContent = WebInspector.UIString("Edit file system");
  45
  46     var closeButton = header.createChild("div", "done-button", "dt-close-button");
  47     closeButton.gray = true;
  48     closeButton.addEventListener("click", this._onDoneClick.bind(this), false);
  49
  50     var contents = this.element.createChild("div", "contents");
  51
  52     WebInspector.isolatedFileSystemManager.mapping().addEventListener(WebInspector.FileSystemMapping.Events.FileMappingAdded, this._fileMappingAdded, this);
  53     WebInspector.isolatedFileSystemManager.mapping().addEventListener(WebInspector.FileSystemMapping.Events.FileMappingRemoved, this._fileMappingRemoved, this);
  54     WebInspector.isolatedFileSystemManager.excludedFolderManager().addEventListener(WebInspector.ExcludedFolderManager.Events.ExcludedFolderAdded, this._excludedFolderAdded, this);
  55     WebInspector.isolatedFileSystemManager.excludedFolderManager().addEventListener(WebInspector.ExcludedFolderManager.Events.ExcludedFolderRemoved, this._excludedFolderRemoved, this);
  56
  57     var blockHeader = contents.createChild("div", "block-header");
  58     blockHeader.textContent = WebInspector.UIString("Mappings");
  59     this._fileMappingsSection = contents.createChild("div", "section");
  60     this._fileMappingsListContainer = this._fileMappingsSection.createChild("div", "settings-list-container");
  61     var entries = WebInspector.isolatedFileSystemManager.mapping().mappingEntries(this._fileSystemPath);
  62
  63     var urlColumn = { id: "url", placeholder: WebInspector.UIString("URL prefix") };
  64     var pathColumn = { id: "path", placeholder: WebInspector.UIString("Folder path") };
  65
  66     this._fileMappingsList = new WebInspector.EditableSettingsList([urlColumn, pathColumn], this._fileMappingValuesProvider.bind(this), this._fileMappingValidate.bind(this), this._fileMappingEdit.bind(this));
  67     this._fileMappingsList.addEventListener(WebInspector.SettingsList.Events.Removed, this._fileMappingRemovedfromList.bind(this));
  68
  69     this._fileMappingsList.element.classList.add("file-mappings-list");
  70     this._fileMappingsListContainer.appendChild(this._fileMappingsList.element);
  71
  72     this._entries = {};
  73     for (var i = 0; i < entries.length; ++i)
  74         this._addMappingRow(entries[i]);
  75
  76     blockHeader = contents.createChild("div", "block-header");
  77     blockHeader.textContent = WebInspector.UIString("Excluded folders");
  78     this._excludedFolderListSection = contents.createChild("div", "section excluded-folders-section");
  79     this._excludedFolderListContainer = this._excludedFolderListSection.createChild("div", "settings-list-container");
  80     var excludedFolderEntries = WebInspector.isolatedFileSystemManager.excludedFolderManager().excludedFolders(fileSystemPath);
  81
  82     this._excludedFolderList = new WebInspector.EditableSettingsList([pathColumn], this._excludedFolderValueProvider.bind(this), this._excludedFolderValidate.bind(this), this._excludedFolderEdit.bind(this));
  83     this._excludedFolderList.addEventListener(WebInspector.SettingsList.Events.Removed, this._excludedFolderRemovedfromList.bind(this));
  84     this._excludedFolderList.element.classList.add("excluded-folders-list");
  85     this._excludedFolderListContainer.appendChild(this._excludedFolderList.element);
  86     this._excludedFolderEntries = new Map();
  87     for (var i = 0; i < excludedFolderEntries.length; ++i)
  88         this._addExcludedFolderRow(excludedFolderEntries[i]);
  89
  90     this.element.tabIndex = 0;
  91     this._hasMappingChanges = false;
  92 }
  93
  94 WebInspector.EditFileSystemDialog.show = function(element, fileSystemPath)
  95 {
  96     var dialog = new WebInspector.EditFileSystemDialog(fileSystemPath);
  97     WebInspector.Dialog.show(element, dialog);
  98     var glassPane = dialog.element.ownerDocument.getElementById("glass-pane");
  99     glassPane.classList.add("settings-glass-pane");
 100 }
 101
 102 WebInspector.EditFileSystemDialog.prototype = {
 103     /**
 104      * @override
 105      * @param {!Element} element
 106      */
 107     show: function(element)
 108     {
 109         this._dialogElement = element;
 110         element.appendChild(this.element);
 111         element.classList.add("settings-dialog", "settings-tab");
 112     },
 113
 114     _resize: function()
 115     {
 116         if (!this._dialogElement || !this._relativeToElement)
 117             return;
 118
 119         const minWidth = 200;
 120         const minHeight = 150;
 121         var maxHeight = this._relativeToElement.offsetHeight - 10;
 122         maxHeight = Math.max(minHeight, maxHeight);
 123         var maxWidth = Math.min(540, this._relativeToElement.offsetWidth - 10);
 124         maxWidth = Math.max(minWidth, maxWidth);
 125         this._dialogElement.style.maxHeight = maxHeight + "px";
 126         this._dialogElement.style.width = maxWidth + "px";
 127
 128         WebInspector.DialogDelegate.prototype.position(this._dialogElement, this._relativeToElement);
 129     },
 130
 131     /**
 132      * @override
 133      * @param {!Element} element
 134      * @param {!Element} relativeToElement
 135      */
 136     position: function(element, relativeToElement)
 137     {
 138         this._relativeToElement = relativeToElement;
 139         this._resize();
 140     },
 141
 142     willHide: function(event)
 143     {
 144         if (!this._hasMappingChanges)
 145             return;
 146         if (window.confirm(WebInspector.UIString("It is recommended to restart DevTools after making these changes. Would you like to restart it?")))
 147             WebInspector.reload();
 148     },
 149
 150     _fileMappingAdded: function(event)
 151     {
 152         var entry = /** @type {!WebInspector.FileSystemMapping.Entry} */ (event.data);
 153         this._addMappingRow(entry);
 154     },
 155
 156     _fileMappingRemoved: function(event)
 157     {
 158         var entry = /** @type {!WebInspector.FileSystemMapping.Entry} */ (event.data);
 159         if (this._fileSystemPath !== entry.fileSystemPath)
 160             return;
 161         delete this._entries[entry.urlPrefix];
 162         if (this._fileMappingsList.itemForId(entry.urlPrefix))
 163             this._fileMappingsList.removeItem(entry.urlPrefix);
 164         this._resize();
 165     },
 166
 167     /**
 168      * @param {string} itemId
 169      * @param {string} columnId
 170      * @return {string}
 171      */
 172     _fileMappingValuesProvider: function(itemId, columnId)
 173     {
 174         if (!itemId)
 175             return "";
 176         var entry = this._entries[itemId];
 177         switch (columnId) {
 178         case "url":
 179             return entry.urlPrefix;
 180         case "path":
 181             return entry.pathPrefix;
 182         default:
 183             console.assert("Should not be reached.");
 184         }
 185         return "";
 186     },
 187
 188     /**
 189      * @param {?string} itemId
 190      * @param {!Object} data
 191      */
 192     _fileMappingValidate: function(itemId, data)
 193     {
 194         var oldPathPrefix = itemId ? this._entries[itemId].pathPrefix : null;
 195         return this._validateMapping(data["url"], itemId, data["path"], oldPathPrefix);
 196     },
 197
 198     /**
 199      * @param {?string} itemId
 200      * @param {!Object} data
 201      */
 202     _fileMappingEdit: function(itemId, data)
 203     {
 204         if (itemId) {
 205             var urlPrefix = itemId;
 206             var pathPrefix = this._entries[itemId].pathPrefix;
 207             var fileSystemPath = this._entries[itemId].fileSystemPath;
 208             WebInspector.isolatedFileSystemManager.mapping().removeFileMapping(fileSystemPath, urlPrefix, pathPrefix);
 209         }
 210         this._addFileMapping(data["url"], data["path"]);
 211     },
 212
 213     /**
 214      * @param {string} urlPrefix
 215      * @param {?string} allowedURLPrefix
 216      * @param {string} path
 217      * @param {?string} allowedPathPrefix
 218      */
 219     _validateMapping: function(urlPrefix, allowedURLPrefix, path, allowedPathPrefix)
 220     {
 221         var columns = [];
 222         if (!this._checkURLPrefix(urlPrefix, allowedURLPrefix))
 223             columns.push("url");
 224         if (!this._checkPathPrefix(path, allowedPathPrefix))
 225             columns.push("path");
 226         return columns;
 227     },
 228
 229     /**
 230      * @param {!WebInspector.Event} event
 231      */
 232     _fileMappingRemovedfromList: function(event)
 233     {
 234         var urlPrefix = /** @type{?string} */ (event.data);
 235         if (!urlPrefix)
 236             return;
 237
 238         var entry = this._entries[urlPrefix];
 239         WebInspector.isolatedFileSystemManager.mapping().removeFileMapping(entry.fileSystemPath, entry.urlPrefix, entry.pathPrefix);
 240         this._hasMappingChanges = true;
 241     },
 242
 243     /**
 244      * @param {string} urlPrefix
 245      * @param {string} pathPrefix
 246      * @return {boolean}
 247      */
 248     _addFileMapping: function(urlPrefix, pathPrefix)
 249     {
 250         var normalizedURLPrefix = this._normalizePrefix(urlPrefix);
 251         var normalizedPathPrefix = this._normalizePrefix(pathPrefix);
 252         WebInspector.isolatedFileSystemManager.mapping().addFileMapping(this._fileSystemPath, normalizedURLPrefix, normalizedPathPrefix);
 253         this._hasMappingChanges = true;
 254         this._fileMappingsList.selectItem(normalizedURLPrefix);
 255         return true;
 256     },
 257
 258     /**
 259      * @param {string} prefix
 260      * @return {string}
 261      */
 262     _normalizePrefix: function(prefix)
 263     {
 264         if (!prefix)
 265             return "";
 266         return prefix + (prefix[prefix.length - 1] === "/" ? "" : "/");
 267     },
 268
 269     _addMappingRow: function(entry)
 270     {
 271         var fileSystemPath = entry.fileSystemPath;
 272         var urlPrefix = entry.urlPrefix;
 273         if (!this._fileSystemPath || this._fileSystemPath !== fileSystemPath)
 274             return;
 275
 276         this._entries[urlPrefix] = entry;
 277         this._fileMappingsList.addItem(urlPrefix, null);
 278         this._resize();
 279     },
 280
 281     _excludedFolderAdded: function(event)
 282     {
 283         var entry = /** @type {!WebInspector.ExcludedFolderManager.Entry} */ (event.data);
 284         this._addExcludedFolderRow(entry);
 285     },
 286
 287     _excludedFolderRemoved: function(event)
 288     {
 289         var entry = /** @type {!WebInspector.ExcludedFolderManager.Entry} */ (event.data);
 290         var fileSystemPath = entry.fileSystemPath;
 291         if (!fileSystemPath || this._fileSystemPath !== fileSystemPath)
 292             return;
 293         delete this._excludedFolderEntries[entry.path];
 294         if (this._excludedFolderList.itemForId(entry.path))
 295             this._excludedFolderList.removeItem(entry.path);
 296     },
 297
 298     /**
 299      * @param {string} itemId
 300      * @param {string} columnId
 301      * @return {string}
 302      */
 303     _excludedFolderValueProvider: function(itemId, columnId)
 304     {
 305         return itemId;
 306     },
 307
 308     /**
 309      * @param {?string} itemId
 310      * @param {!Object} data
 311      */
 312     _excludedFolderValidate: function(itemId, data)
 313     {
 314         var columns = [];
 315         if (!this._validateExcludedFolder(data["path"], itemId))
 316             columns.push("path");
 317         return columns;
 318     },
 319
 320     /**
 321      * @param {string} path
 322      * @param {?string} allowedPath
 323      * @return {boolean}
 324      */
 325     _validateExcludedFolder: function(path, allowedPath)
 326     {
 327         return !!path && (path === allowedPath || !this._excludedFolderEntries.has(path));
 328     },
 329
 330     /**
 331      * @param {?string} itemId
 332      * @param {!Object} data
 333      */
 334     _excludedFolderEdit: function(itemId, data)
 335     {
 336         var fileSystemPath = this._fileSystemPath;
 337         if (itemId)
 338             WebInspector.isolatedFileSystemManager.excludedFolderManager().removeExcludedFolder(fileSystemPath, itemId);
 339         var excludedFolderPath = data["path"];
 340         WebInspector.isolatedFileSystemManager.excludedFolderManager().addExcludedFolder(fileSystemPath, excludedFolderPath);
 341     },
 342
 343     /**
 344      * @param {!WebInspector.Event} event
 345      */
 346     _excludedFolderRemovedfromList: function(event)
 347     {
 348         var itemId = /** @type{?string} */ (event.data);
 349         if (!itemId)
 350             return;
 351         WebInspector.isolatedFileSystemManager.excludedFolderManager().removeExcludedFolder(this._fileSystemPath, itemId);
 352     },
 353
 354     /**
 355      * @param {!WebInspector.ExcludedFolderManager.Entry} entry
 356      */
 357     _addExcludedFolderRow: function(entry)
 358     {
 359         var fileSystemPath = entry.fileSystemPath;
 360         if (!fileSystemPath || this._fileSystemPath !== fileSystemPath)
 361             return;
 362         var path = entry.path;
 363         this._excludedFolderEntries.set(path, entry);
 364         this._excludedFolderList.addItem(path, null);
 365         this._resize();
 366     },
 367
 368     /**
 369      * @param {string} value
 370      * @param {?string} allowedPrefix
 371      * @return {boolean}
 372      */
 373     _checkURLPrefix: function(value, allowedPrefix)
 374     {
 375         var prefix = this._normalizePrefix(value);
 376         return !!prefix && (prefix === allowedPrefix || !this._entries[prefix]);
 377     },
 378
 379     /**
 380      * @param {string} value
 381      * @param {?string} allowedPrefix
 382      * @return {boolean}
 383      */
 384     _checkPathPrefix: function(value, allowedPrefix)
 385     {
 386         var prefix = this._normalizePrefix(value);
 387         if (!prefix)
 388             return false;
 389         if (prefix === allowedPrefix)
 390             return true;
 391         for (var urlPrefix in this._entries) {
 392             var entry = this._entries[urlPrefix];
 393             if (urlPrefix && entry.pathPrefix === prefix)
 394                 return false;
 395         }
 396         return true;
 397     },
 398
 399     focus: function()
 400     {
 401         WebInspector.setCurrentFocusElement(this.element);
 402     },
 403
 404     _onDoneClick: function()
 405     {
 406         WebInspector.Dialog.hide();
 407     },
 408
 409     onEnter: function()
 410     {
 411     },
 412
 413     __proto__: WebInspector.DialogDelegate.prototype
 414 }