[DevTools] Device Mode toolbar updates.

third_party/WebKit/Source/devtools/front_end/emulation/DeviceModeModel.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
  * @param {function()} updateCallback
  * @implements {WebInspector.TargetManager.Observer}
  */
 WebInspector.DeviceModeModel = function(updateCallback)
 {
     this._updateCallback = updateCallback;
     this._screenRect = new WebInspector.Rect(0, 0, 1, 1);
     this._visiblePageRect = new WebInspector.Rect(0, 0, 1, 1);
     this._availableSize = new Size(1, 1);
     this._preferredSize = new Size(1, 1);
+    this._initialized = false;
     this._deviceMetricsThrottler = new WebInspector.Throttler(0);
     this._appliedDeviceSize = new Size(1, 1);
     this._currentDeviceScaleFactor = window.devicePixelRatio;
     this._appliedDeviceScaleFactor = 0;
 
     this._scaleSetting = WebInspector.settings.createSetting("emulation.deviceScale", 1);
     this._scaleSetting.addChangeListener(this._scaleSettingChanged, this);
     // We've used to allow zero before.
     if (!this._scaleSetting.get())
         this._scaleSetting.set(1);
@@ skipping 35 matching lines @@
     Device: "Device"
 }
 
 /** @enum {string} */
 WebInspector.DeviceModeModel.UA = {
     Mobile: "Mobile",
     Desktop: "Desktop",
     DesktopTouch: "DesktopTouch"
 }
 
-WebInspector.DeviceModeModel.MaxDeviceSize = 10000;
+WebInspector.DeviceModeModel.MaxDeviceSize = 9999;
 
 /**
  * @param {string} value
  * @return {string}
  */
 WebInspector.DeviceModeModel.deviceSizeValidator = function(value)
 {
     if (/^[\d]+$/.test(value) && value > 0 && value <= WebInspector.DeviceModeModel.MaxDeviceSize)
         return "";
     return WebInspector.UIString("Value must be positive integer");
 }
 
 WebInspector.DeviceModeModel._touchEventsScriptIdSymbol = Symbol("DeviceModeModel.touchEventsScriptIdSymbol");
 WebInspector.DeviceModeModel._defaultMobileUserAgent = "Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.76 Mobile Safari/537.36";
 WebInspector.DeviceModeModel._defaultMobileScaleFactor = 2;
 
 WebInspector.DeviceModeModel.prototype = {
     /**
      * @param {!Size} availableSize
      * @param {!Size} preferredSize
      */
     setAvailableSize: function(availableSize, preferredSize)
     {
         this._availableSize = availableSize;
         this._preferredSize = preferredSize;
+        this._initialized = true;
         this._calculateAndEmulate(false);
     },
 
     /**
      * @param {!WebInspector.DeviceModeModel.Type} type
      * @param {?WebInspector.EmulatedDevice} device
      * @param {?WebInspector.EmulatedDevice.Mode} mode
      */
     emulate: function(type, device, mode)
     {
         var resetScrollAndPageScale = this._type !== type || this._device !== device || this._mode !== mode;
         this._type = type;
 
         if (type === WebInspector.DeviceModeModel.Type.Device) {
             console.assert(device && mode, "Must pass device and mode for device emulation");
             this._device = device;
             this._mode = mode;
+            if (this._initialized) {
+                var orientation = device.orientationByName(mode.orientation);
+                this._scaleSetting.set(this._calculateFitScale(orientation.width, orientation.height));
+            }
         } else {
             this._device = null;
             this._mode = null;
         }
 
         if (type !== WebInspector.DeviceModeModel.Type.None)
             WebInspector.userMetrics.actionTaken(WebInspector.UserMetrics.Action.DeviceModeEnabled);
         this._calculateAndEmulate(resetScrollAndPageScale);
     },
 
     /**
      * @param {number} width
      */
     setWidth: function(width)
     {
         var max = Math.min(WebInspector.DeviceModeModel.MaxDeviceSize, this._preferredScaledWidth());
         width = Math.max(Math.min(width, max), 1);
         this._widthSetting.set(width);
     },
 
     /**
+     * @param {number} width
+     */
+    setWidthAndScaleToFit: function(width)
+    {
+        width = Math.max(Math.min(width, WebInspector.DeviceModeModel.MaxDeviceSize), 1);
+        this._scaleSetting.set(this._calculateFitScale(width, this._heightSetting.get()));
+        this._widthSetting.set(width);
+    },
+
+    /**
      * @param {number} height
      */
     setHeight: function(height)
     {
         var max = Math.min(WebInspector.DeviceModeModel.MaxDeviceSize, this._preferredScaledHeight());
         height = Math.max(Math.min(height, max), 0);
         if (height === this._preferredScaledHeight())
             height = 0;
         this._heightSetting.set(height);
     },
 
     /**
+     * @param {number} height
+     */
+    setHeightAndScaleToFit: function(height)
+    {
+        height = Math.max(Math.min(height, WebInspector.DeviceModeModel.MaxDeviceSize), 0);
+        if (height === this._preferredScaledHeight())
+            height = 0;
+        this._scaleSetting.set(this._calculateFitScale(this._widthSetting.get(), height));
+        this._heightSetting.set(height);
+    },
+
+    /**
      * @param {number} scale
      */
     setScale: function(scale)
     {
         this._scaleSetting.set(scale);
     },
 
     /**
      * @return {?WebInspector.EmulatedDevice}
      */
@@ skipping 214 matching lines @@
     _preferredScaledHeight: function()
     {
         return Math.floor(this._preferredSize.height / (this._scaleSetting.get() || 1));
     },
 
     /**
      * @param {boolean} resetScrollAndPageScale
      */
     _calculateAndEmulate: function(resetScrollAndPageScale)
     {
-        if (!this._target) {
+        if (!this._target)
             this._onTargetAvailable = this._calculateAndEmulate.bind(this, resetScrollAndPageScale);
-            this._applyDeviceMetrics(this._availableSize, new Insets(0, 0, 0, 0), 1, 0, false, resetScrollAndPageScale);
-            this._updateCallback.call(null);
-            return;
-        }
 
         if (this._type === WebInspector.DeviceModeModel.Type.Device) {
             var orientation = this._device.orientationByName(this._mode.orientation);
-            this._calculateFitScale(orientation.width, orientation.height);
+            this._fitScale = this._calculateFitScale(orientation.width, orientation.height);
             this._applyDeviceMetrics(new Size(orientation.width, orientation.height), this._mode.insets, this._scaleSetting.get(), this._device.deviceScaleFactor, this._device.mobile(), resetScrollAndPageScale);
             this._applyUserAgent(this._device.userAgent);
             this._applyTouch(this._device.touch(), this._device.mobile());
             this._applyScreenOrientation(this._mode.orientation == WebInspector.EmulatedDevice.Horizontal ? "landscapePrimary" : "portraitPrimary");
         } else if (this._type === WebInspector.DeviceModeModel.Type.None) {
-            this._calculateFitScale(this._availableSize.width, this._availableSize.height);
+            this._fitScale = this._calculateFitScale(this._availableSize.width, this._availableSize.height);
             this._applyDeviceMetrics(this._availableSize, new Insets(0, 0, 0, 0), 1, 0, false, resetScrollAndPageScale);
             this._applyUserAgent("");
             this._applyTouch(false, false);
             this._applyScreenOrientation("");
         } else if (this._type === WebInspector.DeviceModeModel.Type.Responsive) {
             var screenWidth = this._widthSetting.get();
             if (!screenWidth || screenWidth > this._preferredScaledWidth())
                 screenWidth = this._preferredScaledWidth();
             var screenHeight = this._heightSetting.get();
             if (!screenHeight || screenHeight > this._preferredScaledHeight())
                 screenHeight = this._preferredScaledHeight();
             var mobile = this._uaSetting.get() === WebInspector.DeviceModeModel.UA.Mobile;
             var defaultDeviceScaleFactor = mobile ? WebInspector.DeviceModeModel._defaultMobileScaleFactor : 0;
-            this._calculateFitScale(this._widthSetting.get(), this._heightSetting.get());
+            this._fitScale = this._calculateFitScale(this._widthSetting.get(), this._heightSetting.get());
             this._applyDeviceMetrics(new Size(screenWidth, screenHeight), new Insets(0, 0, 0, 0), this._scaleSetting.get(), this._deviceScaleFactorSetting.get() || defaultDeviceScaleFactor, mobile, resetScrollAndPageScale);
             this._applyUserAgent(mobile ? WebInspector.DeviceModeModel._defaultMobileUserAgent : "");
             this._applyTouch(this._uaSetting.get() !== WebInspector.DeviceModeModel.UA.Desktop, mobile);
             this._applyScreenOrientation(screenHeight >= screenWidth ? "portraitPrimary" : "landscapePrimary");
         }
         this._updateCallback.call(null);
     },
 
     /**
      * @param {number} screenWidth
      * @param {number} screenHeight
+     * @return {number}
      */
     _calculateFitScale: function(screenWidth, screenHeight)
     {
         var scale = Math.min(screenWidth ? this._preferredSize.width / screenWidth: 1, screenHeight ? this._preferredSize.height / screenHeight : 1);
-        this._fitScale = Math.min(scale, 1);
+        return Math.min(scale, 1);
     },
 
     /**
      * @param {number} width
      * @param {number} height
      */
     setSizeAndScaleToFit: function(width, height)
     {
-        var scale = Math.min(width ? this._preferredSize.width / width: 1, height ? this._preferredSize.height / height : 1);
-        this._scaleSetting.set(scale);
+        this._scaleSetting.set(this._calculateFitScale(width, height));
         this.setWidth(width);
     },
 
     /**
      * @param {string} userAgent
      */
     _applyUserAgent: function(userAgent)
     {
         WebInspector.multitargetNetworkManager.setUserAgentOverride(userAgent);
     },
@@ skipping 125 matching lines @@
         if (!this._target || orientation === this._screenOrientation)
             return;
 
         this._screenOrientation = orientation;
         if (!this._screenOrientation)
             this._target.screenOrientationAgent().clearScreenOrientationOverride();
         else
             this._target.screenOrientationAgent().setScreenOrientationOverride(this._screenOrientation === "landscapePrimary" ? 90 : 0, /** @type {!ScreenOrientationAgent.OrientationType} */ (this._screenOrientation));
     }
 }