[DevTools] Group options in network presets select.

Added ability to reveal a setting in settings screen for "Edit" option.

BUG=520239

Review URL: https://codereview.chromium.org/1292673002

git-svn-id: svn://svn.chromium.org/blink/trunk@200789 bbb929c8-8fbe-4397-9dbb-9b2b20218538

third_party/WebKit/Source/devtools/front_end/components/NetworkConditionsSelector.js

@@ -64,36 +64,63 @@ WebInspector.NetworkConditionsSelector._networkConditionsPresets = [
     {title: "Good 3G", value: {throughput: 1.5 * 1024 * 1024 / 8, latency: 40}},
     {title: "Regular 4G", value: {throughput: 4 * 1024 * 1024 / 8, latency: 20}},
     {title: "DSL", value: {throughput: 2 * 1024 * 1024 / 8, latency: 5}},
-    {title: "WiFi", value: {throughput: 30 * 1024 * 1024 / 8, latency: 2}},
-    {title: "No throttling", value: {throughput: -1, latency: 0}}
+    {title: "WiFi", value: {throughput: 30 * 1024 * 1024 / 8, latency: 2}}
 ];
 
+/** @type {!WebInspector.NetworkConditionsProfile} */
+WebInspector.NetworkConditionsSelector._disabledPreset = {title: "No throttling", value: {throughput: -1, latency: 0}};
+
 WebInspector.NetworkConditionsSelector.prototype = {
     _populateOptions: function()
     {
         this._selectElement.removeChildren();
-        var presets = this._customSetting.get().concat(WebInspector.NetworkConditionsSelector._networkConditionsPresets);
+
+        var customGroup = this._addGroup(this._customSetting.get(), WebInspector.UIString("Custom"));
+        customGroup.insertBefore(new Option(WebInspector.UIString("Add\u2026"), WebInspector.UIString("Add\u2026")), customGroup.firstChild);
+
+        this._addGroup(WebInspector.NetworkConditionsSelector._networkConditionsPresets, WebInspector.UIString("Presets"));
+        this._addGroup([WebInspector.NetworkConditionsSelector._disabledPreset], WebInspector.UIString("Disabled"));
+
+        this._settingChanged();
+    },
+
+    /**
+     * @param {!Array.<!WebInspector.NetworkConditionsProfile>} presets
+     * @param {string} groupName
+     * @return {!Element}
+     */
+    _addGroup: function(presets, groupName)
+    {
+        var groupElement = this._selectElement.createChild("optgroup");
+        groupElement.label = groupName;
         for (var i = 0; i < presets.length; ++i) {
             var preset = presets[i];
             var throughputInKbps = preset.value.throughput / (1024 / 8);
             var isThrottling = (throughputInKbps > 0) || preset.value.latency;
             var option;
+            var presetTitle = WebInspector.UIString(preset.title);
             if (!isThrottling) {
-                option = new Option(preset.title, preset.title);
+                option = new Option(presetTitle, presetTitle);
             } else {
                 var throughputText = WebInspector.NetworkConditionsSelector.throughputText(preset.value);
-                var title = WebInspector.UIString("%s (%s %dms RTT)", preset.title, throughputText, preset.value.latency);
-                option = new Option(title, preset.title);
+                var title = WebInspector.UIString("%s (%s %dms RTT)", presetTitle, throughputText, preset.value.latency);
+                option = new Option(title, presetTitle);
                 option.title = WebInspector.UIString("Maximum download throughput: %s.\r\nMinimum round-trip time: %dms.", throughputText, preset.value.latency);
             }
             option.settingValue = preset.value;
-            this._selectElement.appendChild(option);
+            groupElement.appendChild(option);
         }
-        this._settingChanged();
+        return groupElement;
     },
 
     _optionSelected: function()
     {
+        if (this._selectElement.selectedIndex === 0) {
+            WebInspector.Revealer.reveal(this._customSetting);
+            this._settingChanged();
+            return;
+        }
+
         this._setting.removeChangeListener(this._settingChanged, this);
         this._setting.set(this._selectElement.options[this._selectElement.selectedIndex].settingValue);
         this._setting.addChangeListener(this._settingChanged, this);
@@ -103,7 +130,7 @@ WebInspector.NetworkConditionsSelector.prototype = {
     {
         var value = this._setting.get();
         var options = this._selectElement.options;
-        for (var index = 0; index < options.length; ++index) {
+        for (var index = 1; index < options.length; ++index) {
             var option = options[index];
             if (option.settingValue.throughput === value.throughput && option.settingValue.latency === value.latency)
                 this._selectElement.selectedIndex = index;

third_party/WebKit/Source/devtools/front_end/components/module.json

@@ -25,7 +25,10 @@
             "name": "network-conditions",
             "title": "Throttling",
             "order": "35",
-            "className": "WebInspector.NetworkConditionsSettingsTab"
+            "className": "WebInspector.NetworkConditionsSettingsTab",
+            "settings": [
+                "networkConditionsCustomProfiles"
+            ]
         }
     ],
     "dependencies": [

third_party/WebKit/Source/devtools/front_end/emulation/module.json

@@ -40,7 +40,11 @@
             "name": "devices",
             "title": "Devices",
             "order": "30",
-            "className": "WebInspector.DevicesSettingsTab"
+            "className": "WebInspector.DevicesSettingsTab",
+            "settings": [
+                "standardEmulatedDeviceList",
+                "customEmulatedDeviceList"
+            ]
         }
     ],
     "dependencies": [

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

@@ -201,18 +201,29 @@ WebInspector.GenericSettingsTab = function()
     }
 }
 
+/**
+ * @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);
@@ -606,6 +617,70 @@ 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");
+                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");
+                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}

third_party/WebKit/Source/devtools/front_end/settings/module.json

@@ -23,7 +23,16 @@
         {
             "type": "@WebInspector.SettingUI",
             "category": "Sources",
-            "className": "WebInspector.SettingsScreen.SkipStackFramePatternSettingUI"
+            "className": "WebInspector.SettingsScreen.SkipStackFramePatternSettingUI",
+            "settings": [
+                "skipContentScripts",
+                "skipStackFramesPattern"
+            ]
+        },
+        {
+            "type": "@WebInspector.Revealer",
+            "contextTypes": ["WebInspector.Setting"],
+            "className": "WebInspector.SettingsController.Revealer"
         },
         {
             "type": "context-menu-item",