[DevTools] More Device Mode polish.

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)
@@ skipping 29 matching lines @@
     this._touchEnabled = false;
     /** @type {string} */
     this._touchConfiguration = "";
     /** @type {string} */
     this._screenOrientation = "";
     /** @type {number} */
     this._fitScale = 1;
 
     /** @type {?WebInspector.Target} */
     this._target = null;
+    /** @type {?function()} */
+    this._onTargetAvailable = null;
     WebInspector.targetManager.observeTargets(this, WebInspector.Target.Type.Page);
 }
 
 /** @enum {string} */
 WebInspector.DeviceModeModel.Type = {
     None: "None",
     Responsive: "Responsive",
     Device: "Device"
 }
 
@@ skipping 33 matching lines @@
         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;
         } else {
             this._device = null;
             this._mode = null;
         }
 
         if (type !== WebInspector.DeviceModeModel.Type.None)
             WebInspector.userMetrics.actionTaken(WebInspector.UserMetrics.Action.DeviceModeEnabled);
-        this._calculateAndEmulate(true);
+        this._calculateAndEmulate(resetScrollAndPageScale);
     },
 
     /**
      * @return {?WebInspector.EmulatedDevice}
      */
     device: function()
     {
         return this._device;
     },
 
@@ skipping 134 matching lines @@
     /**
      * @override
      * @param {!WebInspector.Target} target
      */
     targetAdded: function(target)
     {
         if (!this._target) {
             this._target = target;
             var domModel = WebInspector.DOMModel.fromTarget(this._target);
             domModel.addEventListener(WebInspector.DOMModel.Events.InspectModeWillBeToggled, this._inspectModeWillBeToggled, this);
+            if (this._onTargetAvailable) {
+                var callback = this._onTargetAvailable;
+                this._onTargetAvailable = null;
+                callback();
+            }
         }
     },
 
     /**
      * @param {!WebInspector.Event} event
      */
     _inspectModeWillBeToggled: function(event)
     {
         var inspectModeEnabled = /** @type {boolean} */ (event.data);
         if (inspectModeEnabled) {
@@ skipping 42 matching lines @@
     _deviceScaleFactorSettingChanged: function()
     {
         this._calculateAndEmulate(false);
     },
 
     /**
      * @param {boolean} resetScrollAndPageScale
      */
     _calculateAndEmulate: function(resetScrollAndPageScale)
     {
+        if (!this._target) {
+            this._onTargetAvailable = this._calculateAndEmulate.bind(this, resetScrollAndPageScale);
+            return;
+        }
+
         if (this._type === WebInspector.DeviceModeModel.Type.Device) {
             var orientation = this._device.orientationByName(this._mode.orientation);
-            var screenWidth = orientation.width;
-            var screenHeight = orientation.height;
-            this._applyDeviceMetrics(new Size(screenWidth, screenHeight), this._mode.insets, this._scaleSetting.get(), this._device.deviceScaleFactor, this._device.mobile(), resetScrollAndPageScale);
+            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._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() || this._preferredSize.width / (this._scaleSetting.get() || 1);
             var screenHeight = this._heightSetting.get() || this._preferredSize.height / (this._scaleSetting.get() || 1);
             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._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);
-        return Math.min(scale, 1);
+        this._fitScale = Math.min(scale, 1);
     },
 
     /**
      * @param {string} userAgent
      */
     _applyUserAgent: function(userAgent)
     {
         WebInspector.multitargetNetworkManager.setUserAgentOverride(userAgent);
     },
 
     /**
      * @param {!Size} screenSize
      * @param {!Insets} insets
      * @param {number} scale
      * @param {number} deviceScaleFactor
      * @param {boolean} mobile
      * @param {boolean} resetScrollAndPageScale
      */
     _applyDeviceMetrics: function(screenSize, insets, scale, deviceScaleFactor, mobile, resetScrollAndPageScale)
     {
         screenSize.width = Math.max(1, Math.floor(screenSize.width));
         screenSize.height = Math.max(1, Math.floor(screenSize.height));
-        this._fitScale = this._calculateFitScale(screenSize.width, screenSize.height);
 
         var pageWidth = screenSize.width - insets.left - insets.right;
         var pageHeight = screenSize.height - insets.top - insets.bottom;
         var positionX = insets.left;
         var positionY = insets.top;
 
         this._appliedDeviceSize = screenSize;
         this._screenRect = new WebInspector.Rect(
             Math.max(0, (this._availableSize.width - screenSize.width * scale) / 2),
             0,
@@ skipping 97 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));
     }
 }