Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(103)

Side by Side Diff: Source/devtools/front_end/sdk/OverridesSupport.js

Issue 345723003: [DevTools] Separate text autosizing from device metrics override. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Removed dead code Created 6 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2012 Google Inc. All rights reserved. 2 * Copyright (C) 2012 Google Inc. All rights reserved.
3 * 3 *
4 * Redistribution and use in source and binary forms, with or without 4 * Redistribution and use in source and binary forms, with or without
5 * modification, are permitted provided that the following conditions are 5 * modification, are permitted provided that the following conditions are
6 * met: 6 * met:
7 * 7 *
8 * * Redistributions of source code must retain the above copyright 8 * * Redistributions of source code must retain the above copyright
9 * notice, this list of conditions and the following disclaimer. 9 * notice, this list of conditions and the following disclaimer.
10 * * Redistributions in binary form must reproduce the above 10 * * Redistributions in binary form must reproduce the above
(...skipping 79 matching lines...) Expand 10 before | Expand all | Expand 10 after
90 /** 90 /**
91 * @param {string} description 91 * @param {string} description
92 * @param {string} userAgent 92 * @param {string} userAgent
93 * @constructor 93 * @constructor
94 */ 94 */
95 WebInspector.OverridesSupport.Device = function(description, userAgent) 95 WebInspector.OverridesSupport.Device = function(description, userAgent)
96 { 96 {
97 this.width = 800; 97 this.width = 800;
98 this.height = 600; 98 this.height = 600;
99 this.deviceScaleFactor = 1; 99 this.deviceScaleFactor = 1;
100 this.textAutosizing = true;
101 this.userAgent = userAgent; 100 this.userAgent = userAgent;
102 this.touch = true; 101 this.touch = true;
103 this.viewport = true; 102 this.viewport = true;
104 103
105 var splitMetrics = description.split("x"); 104 var splitMetrics = description.split("x");
106 if (splitMetrics.length >= 3) { 105 if (splitMetrics.length >= 3) {
107 this.width = parseInt(splitMetrics[0], 10); 106 this.width = parseInt(splitMetrics[0], 10);
108 this.height = parseInt(splitMetrics[1], 10); 107 this.height = parseInt(splitMetrics[1], 10);
109 this.deviceScaleFactor = parseFloat(splitMetrics[2]); 108 this.deviceScaleFactor = parseFloat(splitMetrics[2]);
110 } 109 }
(...skipping 393 matching lines...) Expand 10 before | Expand all | Expand 10 after
504 */ 503 */
505 emulateDevice: function(device) 504 emulateDevice: function(device)
506 { 505 {
507 this._deviceMetricsChangedListenerMuted = true; 506 this._deviceMetricsChangedListenerMuted = true;
508 this._userAgentChangedListenerMuted = true; 507 this._userAgentChangedListenerMuted = true;
509 this.settings.userAgent.set(device.userAgent); 508 this.settings.userAgent.set(device.userAgent);
510 this.settings.emulateResolution.set(true); 509 this.settings.emulateResolution.set(true);
511 this.settings.deviceWidth.set(device.width); 510 this.settings.deviceWidth.set(device.width);
512 this.settings.deviceHeight.set(device.height); 511 this.settings.deviceHeight.set(device.height);
513 this.settings.deviceScaleFactor.set(device.deviceScaleFactor); 512 this.settings.deviceScaleFactor.set(device.deviceScaleFactor);
514 this.settings.deviceTextAutosizing.set(device.textAutosizing);
515 this.settings.emulateTouch.set(device.touch); 513 this.settings.emulateTouch.set(device.touch);
516 this.settings.emulateViewport.set(device.viewport); 514 this.settings.emulateViewport.set(device.viewport);
517 delete this._deviceMetricsChangedListenerMuted; 515 delete this._deviceMetricsChangedListenerMuted;
518 delete this._userAgentChangedListenerMuted; 516 delete this._userAgentChangedListenerMuted;
519 517
520 if (this._initialized) { 518 if (this._initialized) {
521 this._deviceMetricsChanged(); 519 this._deviceMetricsChanged();
522 this._userAgentChanged(); 520 this._userAgentChanged();
523 } 521 }
524 }, 522 },
525 523
526 reset: function() 524 reset: function()
527 { 525 {
528 this._deviceMetricsChangedListenerMuted = true; 526 this._deviceMetricsChangedListenerMuted = true;
529 this._userAgentChangedListenerMuted = true; 527 this._userAgentChangedListenerMuted = true;
530 this.settings.userAgent.set(""); 528 this.settings.userAgent.set("");
531 this.settings.emulateResolution.set(false); 529 this.settings.emulateResolution.set(false);
532 this.settings.deviceScaleFactor.set(0); 530 this.settings.deviceScaleFactor.set(0);
533 this.settings.deviceTextAutosizing.set(false);
534 this.settings.emulateTouch.set(false); 531 this.settings.emulateTouch.set(false);
535 this.settings.emulateViewport.set(false); 532 this.settings.emulateViewport.set(false);
536 this.settings.overrideDeviceOrientation.set(false); 533 this.settings.overrideDeviceOrientation.set(false);
537 this.settings.overrideGeolocation.set(false); 534 this.settings.overrideGeolocation.set(false);
538 this.settings.overrideCSSMedia.set(false); 535 this.settings.overrideCSSMedia.set(false);
539 this.settings.networkConditions.set({throughput: WebInspector.OverridesS upport._networkThroughputUnlimitedValue, latency: 0}); 536 this.settings.networkConditions.set({throughput: WebInspector.OverridesS upport._networkThroughputUnlimitedValue, latency: 0});
540 delete this._deviceMetricsChangedListenerMuted; 537 delete this._deviceMetricsChangedListenerMuted;
541 delete this._userAgentChangedListenerMuted; 538 delete this._userAgentChangedListenerMuted;
542 539
543 if (this._initialized) { 540 if (this._initialized) {
544 this._deviceMetricsChanged(); 541 this._deviceMetricsChanged();
545 this._userAgentChanged(); 542 this._userAgentChanged();
546 } 543 }
547 }, 544 },
548 545
549 /** 546 /**
550 * @param {!WebInspector.OverridesSupport.Device} device 547 * @param {!WebInspector.OverridesSupport.Device} device
551 * @return {boolean} 548 * @return {boolean}
552 */ 549 */
553 isEmulatingDevice: function(device) 550 isEmulatingDevice: function(device)
554 { 551 {
555 return this.settings.userAgent.get() === device.userAgent 552 return this.settings.userAgent.get() === device.userAgent
556 && this.settings.deviceWidth.get() === device.width 553 && this.settings.deviceWidth.get() === device.width
557 && this.settings.deviceHeight.get() === device.height 554 && this.settings.deviceHeight.get() === device.height
558 && this.settings.deviceScaleFactor.get() === device.deviceScaleFacto r 555 && this.settings.deviceScaleFactor.get() === device.deviceScaleFacto r
559 && this.settings.deviceTextAutosizing.get() === device.textAutosizin g
560 && this.settings.emulateTouch.get() === device.touch 556 && this.settings.emulateTouch.get() === device.touch
561 && this.settings.emulateViewport.get() === device.viewport 557 && this.settings.emulateViewport.get() === device.viewport
562 && this.settings.emulateResolution.get(); 558 && this.settings.emulateResolution.get();
563 }, 559 },
564 560
565 /** 561 /**
566 * @param {boolean} suspended 562 * @param {boolean} suspended
567 */ 563 */
568 setTouchEmulationSuspended: function(suspended) 564 setTouchEmulationSuspended: function(suspended)
569 { 565 {
(...skipping 12 matching lines...) Expand all
582 this._initialized = true; 578 this._initialized = true;
583 579
584 this.settings._emulationEnabled.addChangeListener(this._userAgentChanged , this); 580 this.settings._emulationEnabled.addChangeListener(this._userAgentChanged , this);
585 this.settings.userAgent.addChangeListener(this._userAgentChanged, this); 581 this.settings.userAgent.addChangeListener(this._userAgentChanged, this);
586 582
587 this.settings._emulationEnabled.addChangeListener(this._deviceMetricsCha nged, this); 583 this.settings._emulationEnabled.addChangeListener(this._deviceMetricsCha nged, this);
588 this.settings.emulateResolution.addChangeListener(this._deviceMetricsCha nged, this); 584 this.settings.emulateResolution.addChangeListener(this._deviceMetricsCha nged, this);
589 this.settings.deviceWidth.addChangeListener(this._deviceMetricsChanged, this); 585 this.settings.deviceWidth.addChangeListener(this._deviceMetricsChanged, this);
590 this.settings.deviceHeight.addChangeListener(this._deviceMetricsChanged, this); 586 this.settings.deviceHeight.addChangeListener(this._deviceMetricsChanged, this);
591 this.settings.deviceScaleFactor.addChangeListener(this._deviceMetricsCha nged, this); 587 this.settings.deviceScaleFactor.addChangeListener(this._deviceMetricsCha nged, this);
592 this.settings.deviceTextAutosizing.addChangeListener(this._deviceMetrics Changed, this);
593 this.settings.emulateViewport.addChangeListener(this._deviceMetricsChang ed, this); 588 this.settings.emulateViewport.addChangeListener(this._deviceMetricsChang ed, this);
594 this.settings.deviceFitWindow.addChangeListener(this._deviceMetricsChang ed, this); 589 this.settings.deviceFitWindow.addChangeListener(this._deviceMetricsChang ed, this);
595 590
596 this.settings._emulationEnabled.addChangeListener(this._geolocationPosit ionChanged, this); 591 this.settings._emulationEnabled.addChangeListener(this._geolocationPosit ionChanged, this);
597 this.settings.overrideGeolocation.addChangeListener(this._geolocationPos itionChanged, this); 592 this.settings.overrideGeolocation.addChangeListener(this._geolocationPos itionChanged, this);
598 this.settings.geolocationOverride.addChangeListener(this._geolocationPos itionChanged, this); 593 this.settings.geolocationOverride.addChangeListener(this._geolocationPos itionChanged, this);
599 594
600 this.settings._emulationEnabled.addChangeListener(this._deviceOrientatio nChanged, this); 595 this.settings._emulationEnabled.addChangeListener(this._deviceOrientatio nChanged, this);
601 this.settings.overrideDeviceOrientation.addChangeListener(this._deviceOr ientationChanged, this); 596 this.settings.overrideDeviceOrientation.addChangeListener(this._deviceOr ientationChanged, this);
602 this.settings.deviceOrientationOverride.addChangeListener(this._deviceOr ientationChanged, this); 597 this.settings.deviceOrientationOverride.addChangeListener(this._deviceOr ientationChanged, this);
(...skipping 122 matching lines...) Expand 10 before | Expand all | Expand 10 after
725 720
726 /** 721 /**
727 * @param {!WebInspector.Throttler.FinishCallback} finishCallback 722 * @param {!WebInspector.Throttler.FinishCallback} finishCallback
728 * @this {WebInspector.OverridesSupport} 723 * @this {WebInspector.OverridesSupport}
729 */ 724 */
730 function setDeviceMetricsOverride(finishCallback) 725 function setDeviceMetricsOverride(finishCallback)
731 { 726 {
732 PageAgent.setDeviceMetricsOverride( 727 PageAgent.setDeviceMetricsOverride(
733 overrideWidth, overrideHeight, this.settings.deviceScaleFactor.g et(), 728 overrideWidth, overrideHeight, this.settings.deviceScaleFactor.g et(),
734 this.settings.emulateViewport.get(), this._pageResizer ? false : this.settings.deviceFitWindow.get(), scale, 0, 0, 729 this.settings.emulateViewport.get(), this._pageResizer ? false : this.settings.deviceFitWindow.get(), scale, 0, 0,
735 this.settings.deviceTextAutosizing.get(), this._fontScaleFactor( overrideWidth || dipWidth, overrideHeight || dipHeight),
736 apiCallback.bind(this, finishCallback)); 730 apiCallback.bind(this, finishCallback));
737 } 731 }
738 732
739 /** 733 /**
740 * @param {!WebInspector.Throttler.FinishCallback} finishCallback 734 * @param {!WebInspector.Throttler.FinishCallback} finishCallback
741 * @this {WebInspector.OverridesSupport} 735 * @this {WebInspector.OverridesSupport}
742 */ 736 */
743 function clearDeviceMetricsOverride(finishCallback) 737 function clearDeviceMetricsOverride(finishCallback)
744 { 738 {
745 PageAgent.clearDeviceMetricsOverride(apiCallback.bind(this, finishCa llback)); 739 PageAgent.clearDeviceMetricsOverride(apiCallback.bind(this, finishCa llback));
(...skipping 160 matching lines...) Expand 10 before | Expand all | Expand 10 after
906 900
907 this.settings = {}; 901 this.settings = {};
908 this.settings._emulationEnabled = WebInspector.settings.createSetting("e mulationEnabled", false); 902 this.settings._emulationEnabled = WebInspector.settings.createSetting("e mulationEnabled", false);
909 903
910 this.settings.userAgent = WebInspector.settings.createSetting("userAgent ", ""); 904 this.settings.userAgent = WebInspector.settings.createSetting("userAgent ", "");
911 905
912 this.settings.emulateResolution = WebInspector.settings.createSetting("e mulateResolution", true); 906 this.settings.emulateResolution = WebInspector.settings.createSetting("e mulateResolution", true);
913 this.settings.deviceWidth = WebInspector.settings.createSetting("deviceW idth", 360); 907 this.settings.deviceWidth = WebInspector.settings.createSetting("deviceW idth", 360);
914 this.settings.deviceHeight = WebInspector.settings.createSetting("device Height", 640); 908 this.settings.deviceHeight = WebInspector.settings.createSetting("device Height", 640);
915 this.settings.deviceScaleFactor = WebInspector.settings.createSetting("d eviceScaleFactor", 0); 909 this.settings.deviceScaleFactor = WebInspector.settings.createSetting("d eviceScaleFactor", 0);
916 this.settings.deviceTextAutosizing = WebInspector.settings.createSetting ("deviceTextAutosizing", false);
917 this.settings.deviceFitWindow = WebInspector.settings.createSetting("dev iceFitWindow", true); 910 this.settings.deviceFitWindow = WebInspector.settings.createSetting("dev iceFitWindow", true);
918 // FIXME: rename viewport to mobile everywhere in the code. 911 // FIXME: rename viewport to mobile everywhere in the code.
919 this.settings.emulateViewport = WebInspector.settings.createSetting("emu lateViewport", false); 912 this.settings.emulateViewport = WebInspector.settings.createSetting("emu lateViewport", false);
920 913
921 this.settings.emulateTouch = WebInspector.settings.createSetting("emulat eTouch", false); 914 this.settings.emulateTouch = WebInspector.settings.createSetting("emulat eTouch", false);
922 915
923 this.settings.overrideGeolocation = WebInspector.settings.createSetting( "overrideGeolocation", false); 916 this.settings.overrideGeolocation = WebInspector.settings.createSetting( "overrideGeolocation", false);
924 this.settings.geolocationOverride = WebInspector.settings.createSetting( "geolocationOverride", ""); 917 this.settings.geolocationOverride = WebInspector.settings.createSetting( "geolocationOverride", "");
925 918
926 this.settings.overrideDeviceOrientation = WebInspector.settings.createSe tting("overrideDeviceOrientation", false); 919 this.settings.overrideDeviceOrientation = WebInspector.settings.createSe tting("overrideDeviceOrientation", false);
(...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after
964 /** 957 /**
965 * @return {boolean} 958 * @return {boolean}
966 */ 959 */
967 networkThroughputIsLimited: function() 960 networkThroughputIsLimited: function()
968 { 961 {
969 var conditions = this.settings.networkConditions.get(); 962 var conditions = this.settings.networkConditions.get();
970 return conditions.throughput !== WebInspector.OverridesSupport._networkT hroughputUnlimitedValue; 963 return conditions.throughput !== WebInspector.OverridesSupport._networkT hroughputUnlimitedValue;
971 }, 964 },
972 965
973 /** 966 /**
974 * Compute the font scale factor.
975 *
976 * Chromium on Android uses a device scale adjustment for fonts used in text autosizing for
977 * improved legibility. This function computes this adjusted value for text autosizing.
978 *
979 * For a description of the Android device scale adjustment algorithm, see:
980 * chrome/browser/chrome_content_browser_client.cc, GetFontScaleMultipli er(...)
981 *
982 * @param {number} width
983 * @param {number} height
984 * @return {number} font scale factor.
985 */
986 _fontScaleFactor: function(width, height)
987 {
988 if (!this.emulationEnabled())
989 return 1;
990 var deviceScaleFactor = this.settings.deviceScaleFactor.get();
991
992 if (!width || !height || !deviceScaleFactor)
993 return 1;
994
995 var minWidth = Math.min(width, height) / deviceScaleFactor;
996
997 var kMinFSM = 1.05;
998 var kWidthForMinFSM = 320;
999 var kMaxFSM = 1.3;
1000 var kWidthForMaxFSM = 800;
1001
1002 if (minWidth <= kWidthForMinFSM)
1003 return kMinFSM;
1004 if (minWidth >= kWidthForMaxFSM)
1005 return kMaxFSM;
1006
1007 // The font scale multiplier varies linearly between kMinFSM and kMaxFSM .
1008 var ratio = (minWidth - kWidthForMinFSM) / (kWidthForMaxFSM - kWidthForM inFSM);
1009 return ratio * (kMaxFSM - kMinFSM) + kMinFSM;
1010 },
1011
1012 /**
1013 * @param {!Document} document 967 * @param {!Document} document
1014 * @return {!Element} 968 * @return {!Element}
1015 */ 969 */
1016 createDeviceSelect: function(document) 970 createDeviceSelect: function(document)
1017 { 971 {
1018 var deviceSelectElement = document.createElement("select"); 972 var deviceSelectElement = document.createElement("select");
1019 973
1020 var selectDeviceOption = new Option(WebInspector.UIString("<Select model >"), WebInspector.UIString("<Select model>")); 974 var selectDeviceOption = new Option(WebInspector.UIString("<Select model >"), WebInspector.UIString("<Select model>"));
1021 selectDeviceOption.device = new WebInspector.OverridesSupport.Device("", ""); 975 selectDeviceOption.device = new WebInspector.OverridesSupport.Device("", "");
1022 deviceSelectElement.add(selectDeviceOption); 976 deviceSelectElement.add(selectDeviceOption);
(...skipping 19 matching lines...) Expand all
1042 } 996 }
1043 } 997 }
1044 998
1045 deviceSelectElement.addEventListener("change", deviceSelected, false); 999 deviceSelectElement.addEventListener("change", deviceSelected, false);
1046 1000
1047 var emulatedSettingChangedMuted = false; 1001 var emulatedSettingChangedMuted = false;
1048 WebInspector.overridesSupport.settings.emulateResolution.addChangeListen er(emulatedSettingChanged); 1002 WebInspector.overridesSupport.settings.emulateResolution.addChangeListen er(emulatedSettingChanged);
1049 WebInspector.overridesSupport.settings.deviceWidth.addChangeListener(emu latedSettingChanged); 1003 WebInspector.overridesSupport.settings.deviceWidth.addChangeListener(emu latedSettingChanged);
1050 WebInspector.overridesSupport.settings.deviceHeight.addChangeListener(em ulatedSettingChanged); 1004 WebInspector.overridesSupport.settings.deviceHeight.addChangeListener(em ulatedSettingChanged);
1051 WebInspector.overridesSupport.settings.deviceScaleFactor.addChangeListen er(emulatedSettingChanged); 1005 WebInspector.overridesSupport.settings.deviceScaleFactor.addChangeListen er(emulatedSettingChanged);
1052 WebInspector.overridesSupport.settings.deviceTextAutosizing.addChangeLis tener(emulatedSettingChanged);
1053 WebInspector.overridesSupport.settings.emulateViewport.addChangeListener (emulatedSettingChanged); 1006 WebInspector.overridesSupport.settings.emulateViewport.addChangeListener (emulatedSettingChanged);
1054 WebInspector.overridesSupport.settings.emulateTouch.addChangeListener(em ulatedSettingChanged); 1007 WebInspector.overridesSupport.settings.emulateTouch.addChangeListener(em ulatedSettingChanged);
1055 WebInspector.overridesSupport.settings.userAgent.addChangeListener(emula tedSettingChanged); 1008 WebInspector.overridesSupport.settings.userAgent.addChangeListener(emula tedSettingChanged);
1056 emulatedSettingChanged(); 1009 emulatedSettingChanged();
1057 1010
1058 function deviceSelected() 1011 function deviceSelected()
1059 { 1012 {
1060 if (deviceSelectElement.selectedIndex === 0) 1013 if (deviceSelectElement.selectedIndex === 0)
1061 return; 1014 return;
1062 1015
(...skipping 92 matching lines...) Expand 10 before | Expand all | Expand 10 after
1155 }, 1108 },
1156 1109
1157 __proto__: WebInspector.Object.prototype 1110 __proto__: WebInspector.Object.prototype
1158 } 1111 }
1159 1112
1160 1113
1161 /** 1114 /**
1162 * @type {!WebInspector.OverridesSupport} 1115 * @type {!WebInspector.OverridesSupport}
1163 */ 1116 */
1164 WebInspector.overridesSupport; 1117 WebInspector.overridesSupport;
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698