[DevTools] Add device type to custom device presets.

third_party/WebKit/Source/devtools/front_end/emulation/DevicesSettingsTab.js

 // Copyright 2015 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
  * @extends {WebInspector.VBox}
  * @implements {WebInspector.ListWidget.Delegate}
  */
 WebInspector.DevicesSettingsTab = function()
@@ skipping 136 matching lines @@
         device.title = editor.control("title").value.trim();
         device.vertical.width = editor.control("width").value ? parseInt(editor.control("width").value, 10) : 0;
         device.vertical.height = editor.control("height").value ? parseInt(editor.control("height").value, 10) : 0;
         device.horizontal.width = device.vertical.height;
         device.horizontal.height = device.vertical.width;
         device.deviceScaleFactor = editor.control("scale").value ? parseFloat(editor.control("scale").value) : 0;
         device.userAgent = editor.control("user-agent").value;
         device.modes = [];
         device.modes.push({title: "", orientation: WebInspector.EmulatedDevice.Vertical, insets: new Insets(0, 0, 0, 0), images: null});
         device.modes.push({title: "", orientation: WebInspector.EmulatedDevice.Horizontal, insets: new Insets(0, 0, 0, 0), images: null});
-
+        device.capabilities = [];
+        var uaType = editor.control("ua-type").value;
+        if (uaType === WebInspector.DeviceModeModel.UA.Mobile || uaType === WebInspector.DeviceModeModel.UA.MobileNoTouch)
+            device.capabilities.push(WebInspector.EmulatedDevice.Capability.Mobile);
+        if (uaType === WebInspector.DeviceModeModel.UA.Mobile || uaType === WebInspector.DeviceModeModel.UA.DesktopTouch)
+            device.capabilities.push(WebInspector.EmulatedDevice.Capability.Touch);
         if (isNew)
             this._emulatedDevicesList.addCustomDevice(device);
         else
             this._emulatedDevicesList.saveCustomDevices();
         this._addCustomButton.scrollIntoViewIfNeeded();
         this._addCustomButton.focus();
     },
 
     /**
      * @override
      * @param {*} item
      * @return {!WebInspector.ListWidget.Editor}
      */
     beginEdit: function(item)
     {
         var device = /** @type {!WebInspector.EmulatedDevice} */ (item);
         var editor = this._createEditor();
         editor.control("title").value = device.title;
         editor.control("width").value = this._toNumericInputValue(device.vertical.width);
         editor.control("height").value = this._toNumericInputValue(device.vertical.height);
         editor.control("scale").value = this._toNumericInputValue(device.deviceScaleFactor);
         editor.control("user-agent").value = device.userAgent;
+        var uaType;
+        if (device.mobile())
+            uaType = device.touch() ? WebInspector.DeviceModeModel.UA.Mobile : WebInspector.DeviceModeModel.UA.MobileNoTouch;
+        else
+            uaType = device.touch() ? WebInspector.DeviceModeModel.UA.DesktopTouch : WebInspector.DeviceModeModel.UA.Desktop;
+        editor.control("ua-type").value = uaType;
         return editor;
     },
 
     /**
      * @return {!WebInspector.ListWidget.Editor}
      */
     _createEditor: function()
     {
         if (this._editor)
             return this._editor;
 
         var editor = new WebInspector.ListWidget.Editor();
         this._editor = editor;
         var content = editor.contentElement();
 
         var fields = content.createChild("div", "devices-edit-fields");
-        fields.appendChild(editor.createInput("title", "text", WebInspector.UIString("Device name"), titleValidator));
+        fields.createChild("div", "hbox").appendChild(editor.createInput("title", "text", WebInspector.UIString("Device name"), titleValidator));
         var screen = fields.createChild("div", "hbox");
-        var width = editor.createInput("width", "text", WebInspector.UIString("Width"), sizeValidator);
-        width.classList.add("device-edit-small");
-        screen.appendChild(width);
-        var height = editor.createInput("height", "text", WebInspector.UIString("height"), sizeValidator);
-        height.classList.add("device-edit-small");
-        screen.appendChild(height);
-        screen.appendChild(editor.createInput("scale", "text", WebInspector.UIString("Device pixel ratio"), scaleValidator));
-        fields.appendChild(editor.createInput("user-agent", "text", WebInspector.UIString("User agent string"), userAgentValidator));
+        screen.appendChild(editor.createInput("width", "text", WebInspector.UIString("Width"), sizeValidator));
+        screen.appendChild(editor.createInput("height", "text", WebInspector.UIString("height"), sizeValidator));
+        var dpr = editor.createInput("scale", "text", WebInspector.UIString("Device pixel ratio"), scaleValidator);
+        dpr.classList.add("device-edit-fixed");
+        screen.appendChild(dpr);
+        var ua = fields.createChild("div", "hbox");
+        ua.appendChild(editor.createInput("user-agent", "text", WebInspector.UIString("User agent string"), () => true));
+        var uaType = editor.createSelect("ua-type", [WebInspector.DeviceModeModel.UA.Mobile, WebInspector.DeviceModeModel.UA.MobileNoTouch, WebInspector.DeviceModeModel.UA.Desktop, WebInspector.DeviceModeModel.UA.DesktopTouch], () => true);
+        uaType.classList.add("device-edit-fixed");
+        ua.appendChild(uaType);
 
         return editor;
 
         /**
          * @param {*} item
          * @param {number} index
          * @param {!HTMLInputElement|!HTMLSelectElement} input
          * @return {boolean}
          */
         function titleValidator(item, index, input)
@@ skipping 16 matching lines @@
         /**
          * @param {*} item
          * @param {number} index
          * @param {!HTMLInputElement|!HTMLSelectElement} input
          * @return {boolean}
          */
         function scaleValidator(item, index, input)
         {
             return WebInspector.DeviceModeModel.deviceScaleFactorValidator(input.value);
         }
-
-        /**
-         * @param {*} item
-         * @param {number} index
-         * @param {!HTMLInputElement|!HTMLSelectElement} input
-         * @return {boolean}
-         */
-        function userAgentValidator(item, index, input)
-        {
-            return true;
-        }
     },
 
     __proto__: WebInspector.VBox.prototype
 }