DevTools: Migrate General tab settings to extensions

Source/devtools/front_end/SettingsScreen.js

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 44 matching lines @@
     this._tabbedPane.appendTab(WebInspector.SettingsScreen.Tabs.Shortcuts, WebInspector.UIString("Shortcuts"), WebInspector.shortcutsScreen.createShortcutsTabView());
     this._tabbedPane.shrinkableTabs = false;
     this._tabbedPane.verticalTabLayout = true;
 
     this._lastSelectedTabSetting = WebInspector.settings.createSetting("lastSelectedSettingsTab", WebInspector.SettingsScreen.Tabs.General);
     this.selectTab(this._lastSelectedTabSetting.get());
     this._tabbedPane.addEventListener(WebInspector.TabbedPane.EventTypes.TabSelected, this._tabSelected, this);
 }
 
 /**
- * @param {string} text
- * @return {?string}
- */
-WebInspector.SettingsScreen.regexValidator = function(text)
-{
-    var regex;
-    try {
-        regex = new RegExp(text);
-    } catch (e) {
-    }
-    return regex ? null : WebInspector.UIString("Invalid pattern");
-}
-
-/**
  * @param {number} min
  * @param {number} max
  * @param {string} text
  * @return {?string}
  */
 WebInspector.SettingsScreen.integerValidator = function(min, max, text)
 {
     var value = Number(text);
     if (isNaN(value))
         return WebInspector.UIString("Invalid number format");
@@ skipping 131 matching lines @@
         labelElement.textContent = label;
         var inputElement = p.createChild("input");
         inputElement.value = setting.get();
         inputElement.type = "text";
         if (numeric)
             inputElement.className = "numeric";
         if (maxLength)
             inputElement.maxLength = maxLength;
         if (width)
             inputElement.style.width = width;
+
+        var errorMessageLabel;
         if (validatorCallback) {
-            var errorMessageLabel = p.createChild("div");
+            errorMessageLabel = p.createChild("div");
             errorMessageLabel.classList.add("field-error-message");
-            errorMessageLabel.style.color = "DarkRed";
-            inputElement.oninput = function()
-            {
-                var error = validatorCallback(inputElement.value);
-                if (!error)
-                    error = "";
-                errorMessageLabel.textContent = error;
-            };
+            inputElement.oninput = onInput;
+            onInput();
+        }
+
+        function onInput()
+        {
+            var error = validatorCallback(inputElement.value);
+            if (!error)
+                error = "";
+            errorMessageLabel.textContent = error;
         }
 
         function onBlur()
         {
             setting.set(numeric ? Number(inputElement.value) : inputElement.value);
         }
         inputElement.addEventListener("blur", onBlur, false);
 
         return p;
     },
@@ skipping 12 matching lines @@
 }
 
 /**
  * @constructor
  * @extends {WebInspector.SettingsTab}
  */
 WebInspector.GenericSettingsTab = function()
 {
     WebInspector.SettingsTab.call(this, WebInspector.UIString("General"), "general-tab-content");
 
-    var p = this._appendSection();
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Disable cache (while DevTools is open)"), WebInspector.settings.cacheDisabled));
-    var disableJSElement = WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Disable JavaScript"), WebInspector.settings.javaScriptDisabled);
-    p.appendChild(disableJSElement);
-    WebInspector.settings.javaScriptDisabled.addChangeListener(this._javaScriptDisabledChanged, this);
-    this._disableJSCheckbox = disableJSElement.getElementsByTagName("input")[0];
-    var disableJSInfoParent = this._disableJSCheckbox.parentElement.createChild("span", "monospace");
-    this._disableJSInfo = disableJSInfoParent.createChild("span", "object-info-state-note hidden");
-    this._disableJSInfo.title = WebInspector.UIString("JavaScript is blocked on the inspected page (may be disabled in browser settings).");
-
-    WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.MainFrameNavigated, this._updateScriptDisabledCheckbox, this);
-    this._updateScriptDisabledCheckbox();
-
-    p = this._appendSection(WebInspector.UIString("Appearance"));
-    var splitVerticallyTitle = WebInspector.UIString("Split panels vertically when docked to %s", WebInspector.experimentsSettings.dockToLeft.isEnabled() ? "left or right" : "right");
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(splitVerticallyTitle, WebInspector.settings.splitVerticallyWhenDockedToRight));
-    var panelShortcutTitle = WebInspector.UIString("Enable %s + 1-9 shortcut to switch panels", WebInspector.isMac() ? "Cmd" : "Ctrl");
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(panelShortcutTitle, WebInspector.settings.shortcutPanelSwitch));
-
-    p = this._appendSection(WebInspector.UIString("Elements"));
-    var colorFormatElement = this._createSelectSetting(WebInspector.UIString("Color format"), [
-            [ WebInspector.UIString("As authored"), WebInspector.Color.Format.Original ],
-            [ "HEX: #DAC0DE", WebInspector.Color.Format.HEX ],
-            [ "RGB: rgb(128, 255, 255)", WebInspector.Color.Format.RGB ],
-            [ "HSL: hsl(300, 80%, 90%)", WebInspector.Color.Format.HSL ]
-        ], WebInspector.settings.colorFormat);
-    p.appendChild(colorFormatElement);
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Show user agent styles"), WebInspector.settings.showUserAgentStyles));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Show user agent shadow DOM"), WebInspector.settings.showUAShadowDOM));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Word wrap"), WebInspector.settings.domWordWrap));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Show rulers"), WebInspector.settings.showMetricsRulers));
-
-    p = this._appendSection(WebInspector.UIString("Sources"));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Search in content scripts"), WebInspector.settings.searchInContentScripts));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Enable JavaScript source maps"), WebInspector.settings.jsSourceMapsEnabled));
-
-    var checkbox = WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Enable CSS source maps"), WebInspector.settings.cssSourceMapsEnabled);
-    p.appendChild(checkbox);
-    var fieldset = WebInspector.SettingsUI.createSettingFieldset(WebInspector.settings.cssSourceMapsEnabled);
-    var autoReloadCSSCheckbox = fieldset.createChild("input");
-    fieldset.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Auto-reload generated CSS"), WebInspector.settings.cssReloadEnabled, false, autoReloadCSSCheckbox));
-    checkbox.appendChild(fieldset);
-
-    var indentationElement = this._createSelectSetting(WebInspector.UIString("Default indentation"), [
-            [ WebInspector.UIString("2 spaces"), WebInspector.TextUtils.Indent.TwoSpaces ],
-            [ WebInspector.UIString("4 spaces"), WebInspector.TextUtils.Indent.FourSpaces ],
-            [ WebInspector.UIString("8 spaces"), WebInspector.TextUtils.Indent.EightSpaces ],
-            [ WebInspector.UIString("Tab character"), WebInspector.TextUtils.Indent.TabCharacter ]
-        ], WebInspector.settings.textEditorIndent);
-    p.appendChild(indentationElement);
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Detect indentation"), WebInspector.settings.textEditorAutoDetectIndent));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Autocompletion"), WebInspector.settings.textEditorAutocompletion));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Bracket matching"), WebInspector.settings.textEditorBracketMatching));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Show whitespace characters"), WebInspector.settings.showWhitespacesInEditor));
-    if (WebInspector.experimentsSettings.frameworksDebuggingSupport.isEnabled()) {
-        checkbox = WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Skip stepping through sources with particular names"), WebInspector.settings.skipStackFramesSwitch);
-        fieldset = WebInspector.SettingsUI.createSettingFieldset(WebInspector.settings.skipStackFramesSwitch);
-        fieldset.appendChild(this._createInputSetting(WebInspector.UIString("Pattern"), WebInspector.settings.skipStackFramesPattern, false, 1000, "100px", WebInspector.SettingsScreen.regexValidator));
-        checkbox.appendChild(fieldset);
-        p.appendChild(checkbox);
-    }
-    WebInspector.settings.skipStackFramesSwitch.addChangeListener(this._skipStackFramesSwitchOrPatternChanged, this);
-    WebInspector.settings.skipStackFramesPattern.addChangeListener(this._skipStackFramesSwitchOrPatternChanged, this);
-
-    p = this._appendSection(WebInspector.UIString("Profiler"));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Show advanced heap snapshot properties"), WebInspector.settings.showAdvancedHeapSnapshotProperties));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("High resolution CPU profiling"), WebInspector.settings.highResolutionCpuProfiling));
-
-    p = this._appendSection(WebInspector.UIString("Console"));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Log XMLHttpRequests"), WebInspector.settings.monitoringXHREnabled));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Preserve log upon navigation"), WebInspector.settings.preserveConsoleLog));
-    p.appendChild(WebInspector.SettingsUI.createSettingCheckbox(WebInspector.UIString("Show timestamps"), WebInspector.settings.consoleTimestampsEnabled));
+    this._populateSectionsFromExtensions();
 
     if (WebInspector.openAnchorLocationRegistry.handlerNames.length > 0) {
         var handlerSelector = new WebInspector.HandlerSelector(WebInspector.openAnchorLocationRegistry);
-        p = this._appendSection(WebInspector.UIString("Extensions"));
-        p.appendChild(this._createCustomSetting(WebInspector.UIString("Open links in"), handlerSelector.element));
+        this._appendSection(WebInspector.UIString("Extensions")).appendChild(this._createCustomSetting(WebInspector.UIString("Open links in"), handlerSelector.element));
     }
 
-    p = this._appendSection();
-
-    var restoreDefaults = p.createChild("input", "settings-tab-text-button");
+    var restoreDefaults = this._appendSection().createChild("input", "settings-tab-text-button");
     restoreDefaults.type = "button";
     restoreDefaults.value = WebInspector.UIString("Restore defaults and reload");
     restoreDefaults.addEventListener("click", restoreAndReload);
 
     function restoreAndReload()
     {
         if (window.localStorage)
             window.localStorage.clear();
         WebInspector.reload();
     }
 }
 
 WebInspector.GenericSettingsTab.prototype = {
-    _updateScriptDisabledCheckbox: function()
+    _populateSectionsFromExtensions: function()
     {
+        var explicitSectionOrder = ["", "Appearance", "Elements", "Sources", "Profiler", "Console"];
+
+        var allExtensions = WebInspector.moduleManager.extensions(WebInspector.UISettingDelegate);
+        /** @type {!StringMap.<!Array.<!WebInspector.ModuleManager.Extension>>} */
+        var extensionsBySectionId = new StringMap();
+        /** @type {!StringMap.<!Array.<!WebInspector.ModuleManager.Extension>>} */
+        var childSettingExtensionsByParentName = new StringMap();
+
         /**
-         * @param {?Protocol.Error} error
-         * @param {string} status
-         * @this {WebInspector.GenericSettingsTab}
+         * @param {!StringMap.<T>} map
+         * @param {string} key
+         * @param {T} value
+         * @template T
          */
-        function executionStatusCallback(error, status)
-        {
-            if (error || !status)
-                return;
-
-            var forbidden = (status === "forbidden");
-            var disabled = forbidden || (status === "disabled");
-
-            this._disableJSInfo.classList.toggle("hidden", !forbidden);
-            this._disableJSCheckbox.checked = disabled;
-            this._disableJSCheckbox.disabled = forbidden;
+        function appendToListByKey(map, key, value) {
+            var list = map.get(key);
+            if (!list) {
+                list = [];
+                map.put(key, list);
+            }
+            list.push(value);
         }
 
-        PageAgent.getScriptExecutionStatus(executionStatusCallback.bind(this));
-    },
+        allExtensions.forEach(function(extension) {
+            var descriptor = extension.descriptor();
+            var sectionName = descriptor["sectionName"] || "";
+            if (!sectionName && descriptor["parentSettingName"]) {
+                appendToListByKey(childSettingExtensionsByParentName, descriptor["parentSettingName"], extension);
+                return;
+            }
+            appendToListByKey(extensionsBySectionId, sectionName, extension);
+        });
 
-    _javaScriptDisabledChanged: function()
-    {
-        // We need to manually update the checkbox state, since enabling JavaScript in the page can actually uncover the "forbidden" state.
-        PageAgent.setScriptExecutionDisabled(WebInspector.settings.javaScriptDisabled.get(), this._updateScriptDisabledCheckbox.bind(this));
-    },
-
-    _skipStackFramesSwitchOrPatternChanged: function()
-    {
-        WebInspector.debuggerModel.applySkipStackFrameSettings();
+        var sectionIds = extensionsBySectionId.keys();
+        var explicitlyOrderedSections = {};
+        for (var i = 0; i < explicitSectionOrder.length; ++i) {
+            explicitlyOrderedSections[explicitSectionOrder[i]] = true;
+            var extensions = /** @type {!Array.<!WebInspector.ModuleManager.Extension>} */ (extensionsBySectionId.get(explicitSectionOrder[i]));
+            if (!extensions)
+                continue;
+            this._addSectionWithExtensionProvidedSettings(sectionIds[i], extensions, childSettingExtensionsByParentName);
+        }
+        for (var i = 0; i < sectionIds.length; ++i) {
+            if (explicitlyOrderedSections[sectionIds[i]])
+                continue;
+            this._addSectionWithExtensionProvidedSettings(sectionIds[i], /** @type {!Array.<!WebInspector.ModuleManager.Extension>} */ (extensionsBySectionId.get(sectionIds[i])), childSettingExtensionsByParentName);
+        }
     },
 
     /**
+     * @param {string} sectionName
+     * @param {!Array.<!WebInspector.ModuleManager.Extension>} extensions
+     * @param {!StringMap.<!Array.<!WebInspector.ModuleManager.Extension>>} childSettingExtensionsByParentName
+     */
+    _addSectionWithExtensionProvidedSettings: function(sectionName, extensions, childSettingExtensionsByParentName)
+    {
+        var uiSectionName = sectionName && WebInspector.UIString(sectionName);
+        var sectionElement = this._appendSection(uiSectionName);
+        extensions.forEach(processSetting.bind(this, null));
+
+        /**
+         * @param {?Element} parentFieldset
+         * @param {!WebInspector.ModuleManager.Extension} extension
+         * @this {WebInspector.GenericSettingsTab}
+         */
+        function processSetting(parentFieldset, extension)
+        {
+            var descriptor = extension.descriptor();
+            var experimentName = descriptor["experiment"];
+            if (experimentName && (!WebInspector.experimentsSettings[experimentName] || !WebInspector.experimentsSettings[experimentName].isEnabled()))
+                return;
+
+            var settingName = descriptor["settingName"];
+            var setting = WebInspector.settings[settingName];
+            var instance = extension.instance();
+            if (instance)
+                setting.addChangeListener(instance.settingChanged, instance);
+            var titleFormatArgs = [descriptor["title"]];
+            titleFormatArgs.push.apply(titleFormatArgs, instance ? (instance.titleTemplateArguments() || []) : []);
+            var uiTitle = WebInspector.UIString.apply(WebInspector, titleFormatArgs);
+            var settingControl;
+            switch (descriptor["settingType"]) {
+            case "checkbox":
+                settingControl = WebInspector.SettingsUI.createSettingCheckbox(uiTitle, setting);
+                break;
+            case "select":
+                console.assert(instance instanceof WebInspector.SelectUISettingDelegate);
+                settingControl = this._createSelectSetting(uiTitle, /** @type {!WebInspector.SelectUISettingDelegate} */ (instance).settingOptions(), setting);
+                break;
+            case "input":
+                console.assert(instance instanceof WebInspector.InputUISettingDelegate);
+                settingControl = this._createInputSetting(uiTitle, setting, descriptor["isNumeric"] || false, descriptor["maxLength"], descriptor["width"], instance.validateInput.bind(instance));
+            }
+            var childSettings = childSettingExtensionsByParentName.get(settingName);
+            if (childSettings) {
+                var fieldSet = WebInspector.SettingsUI.createSettingFieldset(setting);
+                settingControl.appendChild(fieldSet);
+                for (var i = 0; i < childSettings.length; ++i)
+                    processSetting.call(this, fieldSet, childSettings[i]);
+            }
+            var containerElement = parentFieldset || sectionElement;
+            containerElement.appendChild(settingControl);
+            if (descriptor["configurable"]) {
+                console.assert(instance);
+                /** @type {!WebInspector.ConfigurableUISettingDelegate} */ (instance).configure(settingControl, containerElement);
+            }
+        }
+    },
+
+    /**
      * @param {?Element} p
      */
     _appendDrawerNote: function(p)
     {
         var noteElement = p.createChild("div", "help-field-note");
         noteElement.createTextChild("Hit ");
         noteElement.createChild("span", "help-key").textContent = "Esc";
         noteElement.createTextChild(WebInspector.UIString(" or click the"));
         noteElement.appendChild(new WebInspector.StatusBarButton(WebInspector.UIString("Drawer"), "console-status-bar-item").element);
         noteElement.createTextChild(WebInspector.UIString("toolbar item"));
     },
 
     __proto__: WebInspector.SettingsTab.prototype
 }
 
 /**
  * @constructor
  * @extends {WebInspector.SettingsTab}
  */
 WebInspector.WorkspaceSettingsTab = function()
 {
     WebInspector.SettingsTab.call(this, WebInspector.UIString("Workspace"), "workspace-tab-content");
     WebInspector.isolatedFileSystemManager.addEventListener(WebInspector.IsolatedFileSystemManager.Events.FileSystemAdded, this._fileSystemAdded, this);
     WebInspector.isolatedFileSystemManager.addEventListener(WebInspector.IsolatedFileSystemManager.Events.FileSystemRemoved, this._fileSystemRemoved, this);
 
     this._commonSection = this._appendSection(WebInspector.UIString("Common"));
-    var folderExcludePatternInput = this._createInputSetting(WebInspector.UIString("Folder exclude pattern"), WebInspector.settings.workspaceFolderExcludePattern, false, 0, "270px", WebInspector.SettingsScreen.regexValidator);
+    var folderExcludePatternInput = this._createInputSetting(WebInspector.UIString("Folder exclude pattern"), WebInspector.settings.workspaceFolderExcludePattern, false, 0, "270px", WebInspector.SettingsUI.regexValidator);
     this._commonSection.appendChild(folderExcludePatternInput);
 
     this._fileSystemsSection = this._appendSection(WebInspector.UIString("Folders"));
     this._fileSystemsListContainer = this._fileSystemsSection.createChild("p", "settings-list-container");
 
     this._addFileSystemRowElement = this._fileSystemsSection.createChild("div");
     var addFileSystemButton = this._addFileSystemRowElement.createChild("input", "settings-tab-text-button");
     addFileSystemButton.type = "button";
     addFileSystemButton.value = WebInspector.UIString("Add folder\u2026");
     addFileSystemButton.addEventListener("click", this._addFileSystemClicked.bind(this));
@@ skipping 680 matching lines @@
             var inputElement = this._addInputElements[columnId];
             inputElement.value = "";
         }
     },
 
     __proto__: WebInspector.SettingsList.prototype
 }
 
 /** @type {!WebInspector.SettingsController} */
 WebInspector.settingsController;