Revert of Revert of [DevTools] Device mode: reset page scale when enabling and improve UI.

Source/devtools/front_end/sdk/OverridesSupport.js

 /*
  * Copyright (C) 2012 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 258 matching lines @@
     },
 
     /**
      * @param {boolean} enabled
      */
     setEmulationEnabled: function(enabled)
     {
         if (this.canEmulate()) {
             this.settings._emulationEnabled.set(enabled);
             this.dispatchEventToListeners(WebInspector.OverridesSupport.Events.EmulationStateChanged);
+            if (enabled && this.settings.emulateResolution.get())
+                this._target.pageAgent().resetScrollAndPageScaleFactor();
         }
     },
 
     /**
      * @return {boolean}
      */
     responsiveDesignAvailable: function()
     {
         return this._responsiveDesignAvailable;
     },
@@ skipping 36 matching lines @@
         this.settings.deviceHeight.set(device.height);
         this.settings.deviceScaleFactor.set(device.deviceScaleFactor);
         this.settings.emulateTouch.set(device.touch);
         this.settings.emulateMobile.set(device.mobile);
         delete this._deviceMetricsChangedListenerMuted;
         delete this._userAgentChangedListenerMuted;
 
         if (this._initialized) {
             this._deviceMetricsChanged();
             this._userAgentChanged();
-            PageAgent.resetScrollAndPageScaleFactor();
+            this._target.pageAgent().resetScrollAndPageScaleFactor();
         }
     },
 
     reset: function()
     {
         this._deviceMetricsChangedListenerMuted = true;
         this._userAgentChangedListenerMuted = true;
         this.settings.userAgent.set("");
         this.settings.emulateResolution.set(false);
         this.settings.deviceScaleFactor.set(0);
@@ skipping 111 matching lines @@
         if (this.settings.overrideGeolocation.get())
             this._geolocationPositionChanged();
 
         if (this.settings.emulateTouch.get())
             this._emulateTouchEventsChanged();
 
         if (this.settings.overrideCSSMedia.get())
             this._cssMediaChanged();
 
         this._deviceMetricsChanged();
+        if (this.settings.emulateResolution.get())
+            this._target.pageAgent().resetScrollAndPageScaleFactor();
 
         this._userAgentChanged();
 
         if (this.networkThroughputIsLimited())
             this._networkConditionsChanged();
     },
 
     _userAgentChanged: function()
     {
         if (this._userAgentChangedListenerMuted)
@@ skipping 88 matching lines @@
         this._deviceScale = scale;
 
         this._deviceMetricsThrottler.schedule(setDeviceMetricsOverride.bind(this));
 
         /**
          * @param {!WebInspector.Throttler.FinishCallback} finishCallback
          * @this {WebInspector.OverridesSupport}
          */
         function setDeviceMetricsOverride(finishCallback)
         {
-            PageAgent.setDeviceMetricsOverride(
+            this._target.pageAgent().setDeviceMetricsOverride(
                 overrideWidth, overrideHeight, this.settings.emulateResolution.get() ? this.settings.deviceScaleFactor.get() : 0,
                 this.settings.emulateMobile.get(), this._pageResizer ? false : this.settings.deviceFitWindow.get(), scale, 0, 0,
                 apiCallback.bind(this, finishCallback));
         }
 
         /**
          * @param {!WebInspector.Throttler.FinishCallback} finishCallback
          * @this {WebInspector.OverridesSupport}
          */
         function clearDeviceMetricsOverride(finishCallback)
         {
-            PageAgent.clearDeviceMetricsOverride(apiCallback.bind(this, finishCallback));
+            this._target.pageAgent().clearDeviceMetricsOverride(apiCallback.bind(this, finishCallback));
         }
 
         /**
          * @param {!WebInspector.Throttler.FinishCallback} finishCallback
          * @param {?Protocol.Error} error
          * @this {WebInspector.OverridesSupport}
          */
         function apiCallback(finishCallback, error)
         {
             if (error) {
@@ skipping 224 matching lines @@
     },
 
     __proto__: WebInspector.Object.prototype
 }
 
 
 /**
  * @type {!WebInspector.OverridesSupport}
  */
 WebInspector.overridesSupport;