DevTools: Extract SourcesEditor from SourcesPanel.

Source/devtools/front_end/SourcesEditor.js

Index: Source/devtools/front_end/SourcesEditor.js
diff --git a/Source/devtools/front_end/SourcesEditor.js b/Source/devtools/front_end/SourcesEditor.js
new file mode 100644
index 0000000000000000000000000000000000000000..23e9de9adcfe1954800fdd198b213f7740512bd9
--- /dev/null
+++ b/Source/devtools/front_end/SourcesEditor.js
@@ -0,0 +1,708 @@
+// Copyright 2014 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * @constructor
+ * @implements {WebInspector.TabbedEditorContainerDelegate}
+ * @implements {WebInspector.Searchable}
+ * @implements {WebInspector.Replaceable}
+ * @extends {WebInspector.Object}
+ * @param {!WebInspector.Workspace} workspace
+ * @param {!WebInspector.SourcesPanel} sourcesPanel
+ */
+WebInspector.SourcesEditor = function(workspace, sourcesPanel)

[lushnikov, 2014/03/20 13:13:43]

it would be great to remove this sourcesPanel dependency in future

+{
+    this._workspace = workspace;
+    this._sourcesPanel = sourcesPanel;
+
+    this._sourcesView = new WebInspector.SourcesView();
+
+    this._searchableView = new WebInspector.SearchableView(this);
+    this._searchableView.setMinimalSearchQuerySize(0);
+    this._searchableView.show(this._sourcesView.element);
+
+    /** @type {!Map.<!WebInspector.UISourceCode, !WebInspector.SourceFrame>} */
+    this._sourceFramesByUISourceCode = new Map();
+
+    var tabbedEditorPlaceholderText = WebInspector.isMac() ? WebInspector.UIString("Hit Cmd+O to open a file") : WebInspector.UIString("Hit Ctrl+O to open a file");
+    this._editorContainer = new WebInspector.TabbedEditorContainer(this, "previouslyViewedFiles", tabbedEditorPlaceholderText);
+    this._editorContainer.show(this._searchableView.element);
+    this._editorContainer.addEventListener(WebInspector.TabbedEditorContainer.Events.EditorSelected, this._editorSelected, this);
+    this._editorContainer.addEventListener(WebInspector.TabbedEditorContainer.Events.EditorClosed, this._editorClosed, this);
+
+    this._historyManager = new WebInspector.EditingLocationHistoryManager(this, this.currentSourceFrame.bind(this));
+
+    this._scriptViewStatusBarItemsContainer = document.createElement("div");
+    this._scriptViewStatusBarItemsContainer.className = "inline-block";
+
+    this._scriptViewStatusBarTextContainer = document.createElement("div");
+    this._scriptViewStatusBarTextContainer.className = "hbox";
+
+    this._statusBarContainerElement = this._sourcesView.element.createChild("div", "sources-status-bar");
+
+    /**
+     * @this {WebInspector.SourcesEditor}
+     * @param {!WebInspector.SourcesEditor.EditorAction} EditorAction
+     */
+    function appendButtonForExtension(EditorAction)
+    {
+        this._statusBarContainerElement.appendChild(EditorAction.button(this));
+    }
+    var editorActions = /** @type {!Array.<!WebInspector.SourcesEditor.EditorAction>} */ (WebInspector.moduleManager.instances(WebInspector.SourcesEditor.EditorAction));
+    editorActions.forEach(appendButtonForExtension.bind(this));
+
+    this._statusBarContainerElement.appendChild(this._scriptViewStatusBarItemsContainer);
+    this._statusBarContainerElement.appendChild(this._scriptViewStatusBarTextContainer);
+
+    WebInspector.startBatchUpdate();
+    this._workspace.uiSourceCodes().forEach(this._addUISourceCode.bind(this));
+    WebInspector.endBatchUpdate();
+
+    this._workspace.addEventListener(WebInspector.Workspace.Events.UISourceCodeAdded, this._uiSourceCodeAdded, this);
+    this._workspace.addEventListener(WebInspector.Workspace.Events.UISourceCodeRemoved, this._uiSourceCodeRemoved, this);
+    this._workspace.addEventListener(WebInspector.Workspace.Events.ProjectWillReset, this._projectWillReset.bind(this), this);
+
+    function handleBeforeUnload(event)
+    {
+        if (event.returnValue)
+            return;
+        var unsavedSourceCodes = WebInspector.workspace.unsavedSourceCodes();
+        if (!unsavedSourceCodes.length)
+            return;
+
+        event.returnValue = WebInspector.UIString("DevTools have unsaved changes that will be permanently lost.");
+        WebInspector.inspectorView.showPanel("sources");
+        for (var i = 0; i < unsavedSourceCodes.length; ++i)
+            WebInspector.panels.sources.showUISourceCode(unsavedSourceCodes[i]);
+    }
+    window.addEventListener("beforeunload", handleBeforeUnload, true);
+}
+
+WebInspector.SourcesEditor.Events = {
+    EditorClosed: "EditorClosed",
+    EditorSelected: "EditorSelected",
+}
+
+WebInspector.SourcesEditor.prototype = {
+    /**
+     * @param {function(!Array.<!WebInspector.KeyboardShortcut.Descriptor>, function(?Event=):boolean)} registerShortcutDelegate
+     */
+    registerShortcuts: function(registerShortcutDelegate)
+    {
+        registerShortcutDelegate(WebInspector.ShortcutsScreen.SourcesPanelShortcuts.JumpToPreviousLocation, this._onJumpToPreviousLocation.bind(this));
+        registerShortcutDelegate(WebInspector.ShortcutsScreen.SourcesPanelShortcuts.JumpToNextLocation, this._onJumpToNextLocation.bind(this));
+        registerShortcutDelegate(WebInspector.ShortcutsScreen.SourcesPanelShortcuts.CloseEditorTab, this._onCloseEditorTab.bind(this));
+        registerShortcutDelegate(WebInspector.ShortcutsScreen.SourcesPanelShortcuts.GoToLine, this._showGoToLineDialog.bind(this));
+        registerShortcutDelegate(WebInspector.ShortcutsScreen.SourcesPanelShortcuts.GoToMember, this._showOutlineDialog.bind(this));
+        registerShortcutDelegate(WebInspector.ShortcutsScreen.SourcesPanelShortcuts.ToggleBreakpoint, this._toggleBreakpoint.bind(this));
+    },
+
+    /**
+     * @return {!Element}
+     */
+    statusBarContainerElement: function()
+    {
+        return this._statusBarContainerElement;
+    },
+
+    /**
+     * @return {!Element}
+     */
+    defaultFocusedElement: function()
+    {
+        return this._editorContainer.view.defaultFocusedElement();
+    },
+
+    /**
+     * @return {!WebInspector.SearchableView}
+     */
+    searchableView: function()
+    {
+        return this._searchableView;
+    },
+
+    /**
+     * @return {!WebInspector.SourcesView}
+     */
+    sourcesView: function()
+    {
+        return this._sourcesView;
+    },
+
+    /**
+     * @return {!WebInspector.View}
+     */
+    visibleView: function()
+    {
+        return this._editorContainer.visibleView;
+    },
+
+    /**
+     * @return {?WebInspector.SourceFrame}
+     */
+    currentSourceFrame: function()
+    {
+        var view = this.visibleView();
+        if (!(view instanceof WebInspector.SourceFrame))
+            return null;
+        return /** @type {!WebInspector.SourceFrame} */ (view);
+    },
+
+    /**
+     * @return {?WebInspector.UISourceCode}
+     */
+    currentUISourceCode: function()
+    {
+        return this._currentUISourceCode;
+    },
+
+    /**
+     * @param {?Event=} event
+     */
+    _onCloseEditorTab: function(event)
+    {
+        var uiSourceCode = this.currentUISourceCode();
+        if (!uiSourceCode)
+            return false;
+        this._editorContainer.closeFile(uiSourceCode);
+        return true;
+    },
+
+    /**
+     * @param {?Event=} event
+     */
+    _onJumpToPreviousLocation: function(event)
+    {
+        this._historyManager.rollback();
+        return true;
+    },
+
+    /**
+     * @param {?Event=} event
+     */
+    _onJumpToNextLocation: function(event)
+    {
+        this._historyManager.rollover();
+        return true;
+    },
+
+    /**
+     * @param {!WebInspector.Event} event
+     */
+    _uiSourceCodeAdded: function(event)
+    {
+        var uiSourceCode = /** @type {!WebInspector.UISourceCode} */ (event.data);
+        this._addUISourceCode(uiSourceCode);
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     */
+    _addUISourceCode: function(uiSourceCode)
+    {
+        if (uiSourceCode.project().isServiceProject())
+            return;
+        this._editorContainer.addUISourceCode(uiSourceCode);
+        // Replace debugger script-based uiSourceCode with a network-based one.
+        var currentUISourceCode = this._currentUISourceCode;
+        if (currentUISourceCode && currentUISourceCode.project().isServiceProject() && currentUISourceCode !== uiSourceCode && currentUISourceCode.url === uiSourceCode.url) {
+            this._showFile(uiSourceCode);
+            this._editorContainer.removeUISourceCode(currentUISourceCode);
+        }
+    },
+
+    _uiSourceCodeRemoved: function(event)
+    {
+        var uiSourceCode = /** @type {!WebInspector.UISourceCode} */ (event.data);
+        this._removeUISourceCodes([uiSourceCode]);
+    },
+
+    /**
+     * @param {!Array.<!WebInspector.UISourceCode>} uiSourceCodes
+     */
+    _removeUISourceCodes: function(uiSourceCodes)
+    {
+        for (var i = 0; i < uiSourceCodes.length; ++i) {
+            this._removeSourceFrame(uiSourceCodes[i]);
+            this._historyManager.removeHistoryForSourceCode(uiSourceCodes[i]);
+        }
+        this._editorContainer.removeUISourceCodes(uiSourceCodes);
+    },
+
+    _projectWillReset: function(event)
+    {
+        var project = event.data;
+        var uiSourceCodes = project.uiSourceCodes();
+        this._removeUISourceCodes(uiSourceCodes);
+        if (project.type() === WebInspector.projectTypes.Network)
+            this._editorContainer.reset();
+    },
+
+    _updateScriptViewStatusBarItems: function()
+    {
+        this._scriptViewStatusBarItemsContainer.removeChildren();
+        this._scriptViewStatusBarTextContainer.removeChildren();
+        var sourceFrame = this.currentSourceFrame();
+        if (!sourceFrame)
+            return;
+
+        var statusBarItems = sourceFrame.statusBarItems() || [];
+        for (var i = 0; i < statusBarItems.length; ++i)
+            this._scriptViewStatusBarItemsContainer.appendChild(statusBarItems[i]);
+        var statusBarText = sourceFrame.statusBarText();
+        if (statusBarText)
+            this._scriptViewStatusBarTextContainer.appendChild(statusBarText);
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     * @param {number=} lineNumber
+     * @param {number=} columnNumber
+     * @param {boolean=} omitFocus
+     * @param {boolean=} omitHighlight
+     */
+    showSourceLocation: function(uiSourceCode, lineNumber, columnNumber, omitFocus, omitHighlight)
+    {
+        this._historyManager.updateCurrentState();
+        var sourceFrame = this._showFile(uiSourceCode);
+        if (typeof lineNumber === "number")
+            sourceFrame.revealPosition(lineNumber, columnNumber, !omitHighlight);
+        this._historyManager.pushNewState();
+        if (!omitFocus)
+            sourceFrame.focus();
+        WebInspector.notifications.dispatchEventToListeners(WebInspector.UserMetrics.UserAction, {
+            action: WebInspector.UserMetrics.UserActionNames.OpenSourceLink,
+            url: uiSourceCode.originURL(),
+            lineNumber: lineNumber
+        });
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     * @return {!WebInspector.SourceFrame}
+     */
+    _showFile: function(uiSourceCode)
+    {
+        var sourceFrame = this._getOrCreateSourceFrame(uiSourceCode);
+        if (this._currentUISourceCode === uiSourceCode)
+            return sourceFrame;
+
+        this._currentUISourceCode = uiSourceCode;
+        this._editorContainer.showFile(uiSourceCode);
+        this._updateScriptViewStatusBarItems();
+        return sourceFrame;
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     * @return {!WebInspector.SourceFrame}
+     */
+    _createSourceFrame: function(uiSourceCode)
+    {
+        var sourceFrame;
+        switch (uiSourceCode.contentType()) {
+        case WebInspector.resourceTypes.Script:
+            sourceFrame = new WebInspector.JavaScriptSourceFrame(this._sourcesPanel, uiSourceCode);
+            break;
+        case WebInspector.resourceTypes.Document:
+            sourceFrame = new WebInspector.JavaScriptSourceFrame(this._sourcesPanel, uiSourceCode);
+            break;
+        case WebInspector.resourceTypes.Stylesheet:
+            sourceFrame = new WebInspector.CSSSourceFrame(uiSourceCode);
+            break;
+        default:
+            sourceFrame = new WebInspector.UISourceCodeFrame(uiSourceCode);
+        break;
+        }
+        sourceFrame.setHighlighterType(uiSourceCode.highlighterType());
+        this._sourceFramesByUISourceCode.put(uiSourceCode, sourceFrame);
+        this._historyManager.trackSourceFrameCursorJumps(sourceFrame);
+        return sourceFrame;
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     * @return {!WebInspector.SourceFrame}
+     */
+    _getOrCreateSourceFrame: function(uiSourceCode)
+    {
+        return this._sourceFramesByUISourceCode.get(uiSourceCode) || this._createSourceFrame(uiSourceCode);
+    },
+
+    /**
+     * @param {!WebInspector.SourceFrame} sourceFrame
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     * @return {boolean}
+     */
+    _sourceFrameMatchesUISourceCode: function(sourceFrame, uiSourceCode)
+    {
+        switch (uiSourceCode.contentType()) {
+        case WebInspector.resourceTypes.Script:
+        case WebInspector.resourceTypes.Document:
+            return sourceFrame instanceof WebInspector.JavaScriptSourceFrame;
+        case WebInspector.resourceTypes.Stylesheet:
+            return sourceFrame instanceof WebInspector.CSSSourceFrame;
+        default:
+            return !(sourceFrame instanceof WebInspector.JavaScriptSourceFrame);
+        }
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     */
+    _recreateSourceFrameIfNeeded: function(uiSourceCode)
+    {
+        var oldSourceFrame = this._sourceFramesByUISourceCode.get(uiSourceCode);
+        if (!oldSourceFrame)
+            return;
+        if (this._sourceFrameMatchesUISourceCode(oldSourceFrame, uiSourceCode)) {
+            oldSourceFrame.setHighlighterType(uiSourceCode.highlighterType());
+        } else {
+            this._editorContainer.removeUISourceCode(uiSourceCode);
+            this._removeSourceFrame(uiSourceCode);
+        }
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     * @return {!WebInspector.SourceFrame}
+     */
+    viewForFile: function(uiSourceCode)
+    {
+        return this._getOrCreateSourceFrame(uiSourceCode);
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     */
+    _removeSourceFrame: function(uiSourceCode)
+    {
+        var sourceFrame = this._sourceFramesByUISourceCode.get(uiSourceCode);
+        if (!sourceFrame)
+            return;
+        this._sourceFramesByUISourceCode.remove(uiSourceCode);
+        sourceFrame.dispose();
+    },
+
+    clearCurrentExecutionLine: function()
+    {
+        if (this._executionSourceFrame)
+            this._executionSourceFrame.clearExecutionLine();
+        delete this._executionSourceFrame;
+    },
+
+    setExecutionLine: function(uiLocation)
+    {
+        var sourceFrame = this._getOrCreateSourceFrame(uiLocation.uiSourceCode);
+        sourceFrame.setExecutionLine(uiLocation.lineNumber);
+        this._executionSourceFrame = sourceFrame;
+    },
+
+    _editorClosed: function(event)
+    {
+        var uiSourceCode = /** @type {!WebInspector.UISourceCode} */ (event.data);
+        this._historyManager.removeHistoryForSourceCode(uiSourceCode);
+
+        var wasSelected = false;
+        if (this._currentUISourceCode === uiSourceCode) {
+            delete this._currentUISourceCode;
+            wasSelected = true;
+        }
+
+        // SourcesNavigator does not need to update on EditorClosed.
+        this._updateScriptViewStatusBarItems();
+        this._searchableView.resetSearch();
+
+        var data = {};
+        data.uiSourceCode = uiSourceCode;
+        data.wasSelected = wasSelected;
+        this.dispatchEventToListeners(WebInspector.SourcesEditor.Events.EditorClosed, data);
+    },
+
+    _editorSelected: function(event)
+    {
+        var uiSourceCode = /** @type {!WebInspector.UISourceCode} */ (event.data.currentFile);
+        var shouldUseHistoryManager = uiSourceCode !== this._currentUISourceCode && event.data.userGesture;
+        if (shouldUseHistoryManager)
+            this._historyManager.updateCurrentState();
+        var sourceFrame = this._showFile(uiSourceCode);
+        if (shouldUseHistoryManager)
+            this._historyManager.pushNewState();
+
+        this._searchableView.setReplaceable(!!sourceFrame && sourceFrame.canEditSource());
+        this._searchableView.resetSearch();
+
+        this.dispatchEventToListeners(WebInspector.SourcesEditor.Events.EditorSelected, uiSourceCode);
+    },
+
+    /**
+     * @param {!WebInspector.UISourceCode} uiSourceCode
+     */
+    sourceRenamed: function(uiSourceCode)
+    {
+        this._recreateSourceFrameIfNeeded(uiSourceCode);
+    },
+
+    searchCanceled: function()
+    {
+        if (this._searchView)
+            this._searchView.searchCanceled();
+
+        delete this._searchView;
+        delete this._searchQuery;
+    },
+
+    /**
+     * @param {string} query
+     * @param {boolean} shouldJump
+     */
+    performSearch: function(query, shouldJump)
+    {
+        this._searchableView.updateSearchMatchesCount(0);
+
+        var sourceFrame = this.currentSourceFrame();
+        if (!sourceFrame)
+            return;
+
+        this._searchView = sourceFrame;
+        this._searchQuery = query;
+
+        /**
+         * @param {!WebInspector.View} view
+         * @param {number} searchMatches
+         * @this {WebInspector.SourcesEditor}
+         */
+        function finishedCallback(view, searchMatches)
+        {
+            if (!searchMatches)
+                return;
+
+            this._searchableView.updateSearchMatchesCount(searchMatches);
+        }
+
+        /**
+         * @param {number} currentMatchIndex
+         * @this {WebInspector.SourcesEditor}
+         */
+        function currentMatchChanged(currentMatchIndex)
+        {
+            this._searchableView.updateCurrentMatchIndex(currentMatchIndex);
+        }
+
+        /**
+         * @this {WebInspector.SourcesEditor}
+         */
+        function searchResultsChanged()
+        {
+            this._searchableView.cancelSearch();
+        }
+
+        this._searchView.performSearch(query, shouldJump, finishedCallback.bind(this), currentMatchChanged.bind(this), searchResultsChanged.bind(this));
+    },
+
+    jumpToNextSearchResult: function()
+    {
+        if (!this._searchView)
+            return;
+
+        if (this._searchView !== this.currentSourceFrame()) {
+            this.performSearch(this._searchQuery, true);
+            return;
+        }
+
+        this._searchView.jumpToNextSearchResult();
+    },
+
+    jumpToPreviousSearchResult: function()
+    {
+        if (!this._searchView)
+            return;
+
+        if (this._searchView !== this.currentSourceFrame()) {
+            this.performSearch(this._searchQuery, true);
+            if (this._searchView)
+                this._searchView.jumpToLastSearchResult();
+            return;
+        }
+
+        this._searchView.jumpToPreviousSearchResult();
+    },
+
+    /**
+     * @param {string} text
+     */
+    replaceSelectionWith: function(text)
+    {
+        var sourceFrame = this.currentSourceFrame();
+        if (!sourceFrame) {
+            console.assert(sourceFrame);
+            return;
+        }
+        sourceFrame.replaceSelectionWith(text);
+    },
+
+    /**
+     * @param {string} query
+     * @param {string} text
+     */
+    replaceAllWith: function(query, text)
+    {
+        var sourceFrame = this.currentSourceFrame();
+        if (!sourceFrame) {
+            console.assert(sourceFrame);
+            return;
+        }
+        sourceFrame.replaceAllWith(query, text);
+    },
+
+    /**
+     * @param {?Event=} event
+     * @return {boolean}
+     */
+    _showOutlineDialog: function(event)
+    {
+        var uiSourceCode = this._editorContainer.currentFile();
+        if (!uiSourceCode)
+            return false;
+
+        switch (uiSourceCode.contentType()) {
+        case WebInspector.resourceTypes.Document:
+        case WebInspector.resourceTypes.Script:
+            WebInspector.JavaScriptOutlineDialog.show(this._sourcesView, uiSourceCode, this.showSourceLocation.bind(this, uiSourceCode));
+            return true;
+        case WebInspector.resourceTypes.Stylesheet:
+            WebInspector.StyleSheetOutlineDialog.show(this._sourcesView, uiSourceCode, this.showSourceLocation.bind(this, uiSourceCode));
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * @param {string=} query
+     */
+    showOpenResourceDialog: function(query)
+    {
+        var uiSourceCodes = this._editorContainer.historyUISourceCodes();
+        /** @type {!Map.<!WebInspector.UISourceCode, number>} */
+        var defaultScores = new Map();
+        for (var i = 1; i < uiSourceCodes.length; ++i) // Skip current element
+            defaultScores.put(uiSourceCodes[i], uiSourceCodes.length - i);
+        WebInspector.OpenResourceDialog.show(this, this._sourcesView.element, query, defaultScores);
+    },
+
+    /**
+     * @param {?Event=} event
+     * @return {boolean}
+     */
+    _showGoToLineDialog: function(event)
+    {
+        this.showOpenResourceDialog(":");
+        return true;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    _toggleBreakpoint: function()
+    {
+        var sourceFrame = this.currentSourceFrame();
+        if (!sourceFrame)
+            return false;
+
+        if (sourceFrame instanceof WebInspector.JavaScriptSourceFrame) {
+            var javaScriptSourceFrame = /** @type {!WebInspector.JavaScriptSourceFrame} */ (sourceFrame);
+            javaScriptSourceFrame.toggleBreakpointOnCurrentLine();
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * @param {boolean} active
+     */
+    toggleBreakpointsActiveState: function(active)
+    {
+        this._editorContainer.view.element.classList.toggle("breakpoints-deactivated", !active);
+    },
+
+    __proto__: WebInspector.Object.prototype
+}
+
+/**
+ * @constructor
+ * @extends {WebInspector.VBox}
+ */
+WebInspector.SourcesView = function()
+{
+    WebInspector.VBox.call(this);
+    this.registerRequiredCSS("sourcesView.css");
+    this.element.id = "sources-panel-sources-view";
+    this.element.addEventListener("dragenter", this._onDragEnter.bind(this), true);
+    this.element.addEventListener("dragover", this._onDragOver.bind(this), true);
+}
+
+WebInspector.SourcesView.dragAndDropFilesType = "Files";
+
+WebInspector.SourcesView.prototype = {
+    _onDragEnter: function (event)
+    {
+        if (event.dataTransfer.types.indexOf(WebInspector.SourcesView.dragAndDropFilesType) === -1)
+            return;
+        event.consume(true);
+    },
+
+    _onDragOver: function (event)
+    {
+        if (event.dataTransfer.types.indexOf(WebInspector.SourcesView.dragAndDropFilesType) === -1)
+            return;
+        event.consume(true);
+        if (this._dragMaskElement)
+            return;
+        this._dragMaskElement = this.element.createChild("div", "fill drag-mask");
+        this._dragMaskElement.addEventListener("drop", this._onDrop.bind(this), true);
+        this._dragMaskElement.addEventListener("dragleave", this._onDragLeave.bind(this), true);
+    },
+
+    _onDrop: function (event)
+    {
+        event.consume(true);
+        this._removeMask();
+        var items = /** @type {!Array.<!DataTransferItem>} */ (event.dataTransfer.items);
+        if (!items.length)
+            return;
+        var entry = items[0].webkitGetAsEntry();
+        if (!entry.isDirectory)
+            return;
+        InspectorFrontendHost.upgradeDraggedFileSystemPermissions(entry.filesystem);
+    },
+
+    _onDragLeave: function (event)
+    {
+        event.consume(true);
+        this._removeMask();
+    },
+
+    _removeMask: function ()
+    {
+        this._dragMaskElement.remove();
+        delete this._dragMaskElement;
+    },
+
+    __proto__: WebInspector.VBox.prototype
+}
+
+/**
+ * @interface
+ */
+WebInspector.SourcesEditor.EditorAction = function()
+{
+}
+
+WebInspector.SourcesEditor.EditorAction.prototype = {
+    /**
+     * @param {!WebInspector.SourcesEditor} sourcesEditor
+     * @return {!Element}
+     */
+    button: function(sourcesEditor) { }
+}