[DevTools] Option to show device frames in emulation mode

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

 // 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
  */
 WebInspector.EmulatedDevice = function()
 {
     /** @type {string} */
@@ skipping 115 matching lines @@
             if (result.height < 0 || result.height > WebInspector.DeviceModeModel.MaxDeviceSize || result.height < WebInspector.DeviceModeModel.MinDeviceSize)
                 throw new Error("Emulated device has wrong height: " + result.height);
 
             var outlineInsets = parseValue(json["outline"], "insets", "object", null);
             if (outlineInsets) {
                 result.outlineInsets = parseInsets(outlineInsets);
                 if (result.outlineInsets.left < 0 || result.outlineInsets.top < 0)
                     throw new Error("Emulated device has wrong outline insets");
                 result.outlineImage = /** @type {string} */ (parseValue(json["outline"], "image", "string"));
             }
-
             return /** @type {!WebInspector.EmulatedDevice.Orientation} */ (result);
         }
 
         var result = new WebInspector.EmulatedDevice();
         result.title = /** @type {string} */ (parseValue(json, "title", "string"));
         result.type = /** @type {string} */ (parseValue(json, "type", "string"));
         result.userAgent = /** @type {string} */ (parseValue(json, "user-agent", "string"));
 
         var capabilities = parseValue(json, "capabilities", "object", []);
         if (!Array.isArray(capabilities))
@@ skipping 153 matching lines @@
     modeImage: function(mode)
     {
         if (!mode.image)
             return "";
         if (!this._extension)
             return mode.image;
         return this._extension.module().substituteURL(mode.image);
     },
 
     /**
+     * @param {!WebInspector.EmulatedDevice.Mode} mode
+     * @return {string}
+     */
+    outlineImage: function(mode)
+    {
+        var orientation = this.orientationByName(mode.orientation);
+        if (!orientation.outlineImage)
+            return "";
+        if (!this._extension)
+            return orientation.outlineImage;
+        return this._extension.module().substituteURL(orientation.outlineImage);
+    },
+
+    /**
+     * @param {!WebInspector.EmulatedDevice.Mode} mode
+     * @return {?Insets|null}

[dgozman, 2016/02/09 21:15:10]

just ?Insets

[mmccoy, 2016/02/10 20:06:34]

Done.

+     */
+    outlineInsets: function(mode)
+    {
+        var orientation = this.orientationByName(mode.orientation);
+        if (!orientation.outlineImage)
+            return null;
+        return orientation.outlineInsets;
+    },
+
+    /**
+     * @param {!WebInspector.EmulatedDevice.Mode} mode
+     * @return {?Object|string}
+     */
+    outlineDimensions: function(mode)
+    {
+        var orientation = this.orientationByName(mode.orientation);
+        if (!orientation.outlineImage)
+            return "";
+        var dimensions = {
+            "width": orientation.width + orientation.outlineInsets.left + orientation.outlineInsets.right,
+            "height": orientation.height + orientation.outlineInsets.top + orientation.outlineInsets.bottom
+        }
+        return dimensions;
+    },
+
+    /**
      * @param {string} name
      * @return {!WebInspector.EmulatedDevice.Orientation}
      */
     orientationByName: function(name)
     {
         return name === WebInspector.EmulatedDevice.Vertical ? this.vertical : this.horizontal;
     },
 
     /**
      * @return {boolean}
@@ skipping 175 matching lines @@
             if (deviceById.has(title))
                 to[i].copyShowFrom(/** @type {!WebInspector.EmulatedDevice} */ (deviceById.get(title)));
         }
     },
 
     __proto__: WebInspector.Object.prototype
 }
 
 /** @type {!WebInspector.EmulatedDevicesList} */
 WebInspector.emulatedDevicesList;