[DevTools] Group options in network presets select.

Source/devtools/front_end/settings/SettingsScreen.js

Index: Source/devtools/front_end/settings/SettingsScreen.js
diff --git a/Source/devtools/front_end/settings/SettingsScreen.js b/Source/devtools/front_end/settings/SettingsScreen.js
index 800320b99bcf8015a986320a37d0e9f77b7b0e85..c0c242df9e23f0310015808f0b8cf6bb423b1016 100644
--- a/Source/devtools/front_end/settings/SettingsScreen.js
+++ b/Source/devtools/front_end/settings/SettingsScreen.js
@@ -180,6 +180,7 @@ WebInspector.SettingsTab.prototype = {
 WebInspector.GenericSettingsTab = function()
 {
     WebInspector.SettingsTab.call(this, WebInspector.UIString("General"), "general-tab-content");
+    WebInspector.GenericSettingsTab._instance = this;
 
     /** @const */
     var explicitSectionOrder = ["", "Appearance", "Elements", "Sources", "Network", "Profiler", "Console", "Extensions"];
@@ -201,18 +202,32 @@ WebInspector.GenericSettingsTab = function()
     }
 }
 
+/** @type {?WebInspector.GenericSettingsTab} */
+WebInspector.GenericSettingsTab._instance;
+
+/**
+ * @param {!Runtime.Extension} extension
+ * @return {boolean}
+ */
+WebInspector.GenericSettingsTab.isSettingVisible = function(extension)
+{
+    var descriptor = extension.descriptor();
+    if (!("title" in descriptor))
+        return false;
+    if (!(("category" in descriptor) || ("parentSettingName" in descriptor)))
+        return false;
+    return true;
+}
+
 WebInspector.GenericSettingsTab.prototype = {
     /**
      * @param {!Runtime.Extension} extension
      */
     _addSetting: function(extension)
     {
-        var descriptor = extension.descriptor();
-        if (!("title" in descriptor))
-            return;
-        if (!(("category" in descriptor) || ("parentSettingName" in descriptor)))
+        if (!WebInspector.GenericSettingsTab.isSettingVisible(extension))
             return;
-
+        var descriptor = extension.descriptor();
         var sectionName = descriptor["category"];
         var settingName = descriptor["settingName"];
         var setting = WebInspector.moduleSetting(settingName);
@@ -272,8 +287,18 @@ WebInspector.GenericSettingsTab.prototype = {
         {
             var settingUI = /** @type {!WebInspector.SettingUI} */ (object);
             var element = settingUI.settingElement();
-            if (element)
-                this._sectionElement(sectionName).appendChild(element);
+            if (!element)
+                return;
+            this._sectionElement(sectionName).appendChild(element);
+
+            var settingsList = descriptor["settings"];
+            if (!settingsList)
+                return;
+            for (var settingName of settingsList) {
+                this._nameToSettingElement.set(settingName, element);
+                if (settingName === this._highlightedSettingName)
+                    this._highlight();
+            }
         }
     },
 
@@ -292,6 +317,51 @@ WebInspector.GenericSettingsTab.prototype = {
         return sectionElement;
     },
 
+    wasShown: function()
+    {
+        this._highlight();
+    },
+
+    willHide: function()
+    {
+        this._hideHighlight();
+    },
+
+    _hideHighlight: function()
+    {
+        var element = this._highlightedSettingElement();
+        if (element)
+            element.classList.remove("highlighted-setting");
+        delete this._highlightedSettingName;
+    },
+
+    /**
+     * @return {?Element}
+     */
+    _highlightedSettingElement: function()
+    {
+        return this._highlightedSettingName ? (this._nameToSettingElement.get(this._highlightedSettingName) || null) : null;
+    },
+
+    _highlight: function()
+    {
+        var element = this._highlightedSettingElement();
+        if (element) {
+            element.classList.add("highlighted-setting");
+            element.scrollIntoView();
+        }
+    },
+
+    /**
+     * @param {!WebInspector.Setting} setting
+     */
+    highlightSetting: function(setting)
+    {
+        this._hideHighlight();
+        this._highlightedSettingName = setting.name;

[pfeldman, 2015/08/13 23:33:13]

Lets highlight it when we know that it is on screen and not store this state.

+        this._highlight();
+    },
+
     __proto__: WebInspector.SettingsTab.prototype
 }
 
@@ -608,6 +678,72 @@ WebInspector.SettingsController.ActionDelegate.prototype = {
 
 /**
  * @constructor
+ * @implements {WebInspector.Revealer}
+ */
+WebInspector.SettingsController.Revealer = function() { }
+
+WebInspector.SettingsController.Revealer.prototype = {
+    /**
+     * @override
+     * @param {!Object} object
+     * @param {number=} lineNumber
+     * @return {!Promise}
+     */
+    reveal: function(object, lineNumber)
+    {
+        console.assert(object instanceof WebInspector.Setting);
+        var setting = /** @type {!WebInspector.Setting} */ (object);
+        var success = false;
+
+        self.runtime.extensions("setting").forEach(revealModuleSetting);
+        self.runtime.extensions(WebInspector.SettingUI).forEach(revealSettingUI);
+        self.runtime.extensions("settings-view").forEach(revealSettingsView);
+
+        return success ? Promise.resolve() : Promise.reject();
+
+        /**
+         * @param {!Runtime.Extension} extension
+         */
+        function revealModuleSetting(extension)
+        {
+            if (!WebInspector.GenericSettingsTab.isSettingVisible(extension))
+                return;
+            if (extension.descriptor()["settingName"] === setting.name) {
+                WebInspector._settingsController.showSettingsScreen("general");
+                WebInspector.GenericSettingsTab._instance.highlightSetting(setting);
+                success = true;
+            }
+        }
+
+        /**
+         * @param {!Runtime.Extension} extension
+         */
+        function revealSettingUI(extension)
+        {
+            var settings = extension.descriptor()["settings"];
+            if (settings && settings.indexOf(setting.name) !== -1) {
+                WebInspector._settingsController.showSettingsScreen("general");
+                WebInspector.GenericSettingsTab._instance.highlightSetting(setting);
+                success = true;
+            }
+        }
+
+        /**
+         * @param {!Runtime.Extension} extension
+         */
+        function revealSettingsView(extension)
+        {
+            var settings = extension.descriptor()["settings"];
+            if (settings && settings.indexOf(setting.name) !== -1) {
+                WebInspector._settingsController.showSettingsScreen(extension.descriptor()["name"]);
+                success = true;
+            }
+        }
+    }
+}
+
+/**
+ * @constructor
  * @extends {WebInspector.Object}
  * @param {!Array.<{id: string, placeholder: (string|undefined), options: (!Array.<string>|undefined)}>} columns
  * @param {function(!Element, {id: string, placeholder: (string|undefined), options: (!Array.<string>|undefined)}, ?string)} itemRenderer