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

Side by Side Diff: Source/devtools/front_end/ResponsiveDesignView.js

Issue 304693002: DevTools: get rid of deviceMetics settings. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: 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 // Copyright 2014 The Chromium Authors. All rights reserved. 1 // Copyright 2014 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 /** 5 /**
6 * @constructor 6 * @constructor
7 * @extends {WebInspector.VBox} 7 * @extends {WebInspector.VBox}
8 * @implements {WebInspector.OverridesSupport.PageResizer} 8 * @implements {WebInspector.OverridesSupport.PageResizer}
9 * @param {!WebInspector.InspectedPagePlaceholder} inspectedPagePlaceholder 9 * @param {!WebInspector.InspectedPagePlaceholder} inspectedPagePlaceholder
10 */ 10 */
(...skipping 339 matching lines...) Expand 10 before | Expand all | Expand 10 after
350 350
351 _onZoomChanged: function() 351 _onZoomChanged: function()
352 { 352 {
353 this._updateUI(); 353 this._updateUI();
354 }, 354 },
355 355
356 _createToolbar: function() 356 _createToolbar: function()
357 { 357 {
358 this._toolbarElement = this._responsiveDesignContainer.element.createChi ld("div", "responsive-design-toolbar"); 358 this._toolbarElement = this._responsiveDesignContainer.element.createChi ld("div", "responsive-design-toolbar");
359 359
360 const metricsSetting = WebInspector.overridesSupport.settings.deviceMetr ics.get(); 360 this._toolbarElement.appendChild(WebInspector.SettingsUI.createSettingCh eckbox(WebInspector.UIString("Resolution"), WebInspector.overridesSupport.settin gs.overrideDeviceResolution, true));
361 var metrics = WebInspector.OverridesSupport.DeviceMetrics.parseSetting(m etricsSetting); 361 this._toolbarElement.appendChild(WebInspector.SettingsUI.createSettingIn putField("", WebInspector.overridesSupport.settings.deviceWidth, true, 4, "3em") .lastChild);
362 this._toolbarElement.appendChild(document.createTextNode(" \u00D7 "));
363 this._toolbarElement.appendChild(WebInspector.SettingsUI.createSettingIn putField("", WebInspector.overridesSupport.settings.deviceHeight, true, 4, "3em" ).lastChild);
362 364
363 /**
364 * @this {WebInspector.ResponsiveDesignView}
365 */
366 function swapDimensionsClicked()
367 {
368 var widthValue = this._widthOverrideElement.value;
369 this._widthOverrideElement.value = this._heightOverrideElement.value ;
370 this._heightOverrideElement.value = widthValue;
371 this._applyDeviceMetricsUserInput();
372 }
373
374 this._toolbarElement.appendChild(document.createTextNode("Screen")).titl e = WebInspector.UIString("Screen resolution");
375 this._widthOverrideElement = WebInspector.SettingsUI.createInput(this._t oolbarElement, "responsive-design-override-width", String(metrics.width), this._ applyDeviceMetricsUserInput.bind(this), true, "3em");
376 this._toolbarElement.appendChild(document.createTextNode(" \u00D7 "));
377 this._heightOverrideElement = WebInspector.SettingsUI.createInput(this._ toolbarElement, "responsive-design-override-height", String(metrics.height), thi s._applyDeviceMetricsUserInput.bind(this), true, "3em");
378 this._swapDimensionsElement = this._toolbarElement.createChild("button", "responsive-design-override-swap"); 365 this._swapDimensionsElement = this._toolbarElement.createChild("button", "responsive-design-override-swap");
379 this._swapDimensionsElement.appendChild(document.createTextNode(" \u21C4 ")); // RIGHTWARDS ARROW OVER LEFTWARDS ARROW. 366 this._swapDimensionsElement.appendChild(document.createTextNode(" \u21C4 ")); // RIGHTWARDS ARROW OVER LEFTWARDS ARROW.
380 this._swapDimensionsElement.title = WebInspector.UIString("Swap dimensio ns"); 367 this._swapDimensionsElement.title = WebInspector.UIString("Swap dimensio ns");
381 this._swapDimensionsElement.addEventListener("click", swapDimensionsClic ked.bind(this), false); 368 this._swapDimensionsElement.addEventListener("click", WebInspector.overr idesSupport.swapDimensions.bind(WebInspector.overridesSupport), false);
382 this._swapDimensionsElement.tabIndex = -1; 369 this._swapDimensionsElement.tabIndex = -1;
383 370
384 var span = this._toolbarElement.createChild("span"); 371 this._toolbarElement.appendChild(WebInspector.SettingsUI.createSettingCh eckbox(WebInspector.UIString("Dpr"), WebInspector.overridesSupport.settings.devi ceScaleFactor, true));
385 span.textContent = WebInspector.UIString("Dpr"); 372 this._toolbarElement.appendChild(WebInspector.SettingsUI.createSettingCh eckbox(WebInspector.UIString("Viewport"), WebInspector.overridesSupport.settings .emulateViewport, true));
386 span.title = WebInspector.UIString("Device pixel ratio");
387 this._deviceScaleFactorOverrideElement = WebInspector.SettingsUI.createI nput(this._toolbarElement, "responsive-design-device-scale", String(metrics.devi ceScaleFactor), this._applyDeviceMetricsUserInput.bind(this), true, "2em");
388
389 var textAutosizingOverrideElement = WebInspector.SettingsUI.createNonPer sistedCheckbox(WebInspector.UIString("Enable text autosizing "), this._applyDevi ceMetricsUserInput.bind(this));
390 textAutosizingOverrideElement.title = WebInspector.UIString("Text autosi zing is the feature that boosts font sizes on mobile devices.");
391 this._textAutosizingOverrideCheckbox = textAutosizingOverrideElement.fir stChild;
392 this._textAutosizingOverrideCheckbox.checked = metrics.textAutosizing;
393
394 var checkbox = WebInspector.SettingsUI.createSettingCheckbox(WebInspecto r.UIString("Viewport"), WebInspector.overridesSupport.settings.emulateViewport, true);
395 this._toolbarElement.appendChild(checkbox);
396
397 WebInspector.overridesSupport.settings.deviceMetrics.addChangeListener(t his._updateDeviceMetricsElement, this);
398 },
399
400 _updateDeviceMetricsElement: function()
401 {
402 const metricsSetting = WebInspector.overridesSupport.settings.deviceMetr ics.get();
403 var metrics = WebInspector.OverridesSupport.DeviceMetrics.parseSetting(m etricsSetting);
404
405 if (this._widthOverrideElement.value != metrics.width)
406 this._widthOverrideElement.value = metrics.width;
407 if (this._heightOverrideElement.value != metrics.height)
408 this._heightOverrideElement.value = metrics.height;
409 if (this._deviceScaleFactorOverrideElement.value != metrics.deviceScaleF actor)
410 this._deviceScaleFactorOverrideElement.value = metrics.deviceScaleFa ctor;
411 if (this._textAutosizingOverrideCheckbox.checked !== metrics.textAutosiz ing)
412 this._textAutosizingOverrideCheckbox.checked = metrics.textAutosizin g;
413 },
414
415 _applyDeviceMetricsUserInput: function()
416 {
417 WebInspector.OverridesSupport.DeviceMetrics.applyOverrides(this._widthOv errideElement, this._heightOverrideElement, this._deviceScaleFactorOverrideEleme nt, this._textAutosizingOverrideCheckbox);
418 }, 373 },
419 374
420 __proto__: WebInspector.VBox.prototype 375 __proto__: WebInspector.VBox.prototype
421 }; 376 };
OLDNEW
« no previous file with comments | « no previous file | Source/devtools/front_end/common/Settings.js » ('j') | Source/devtools/front_end/sdk/OverridesSupport.js » ('J')

Powered by Google App Engine
This is Rietveld 408576698