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

Unified Diff: third_party/WebKit/Source/devtools/front_end/emulation/DeviceModeView.js

Issue 1641513003: [DevTools] Split DeviceModeView.js into view, toolbar and wrapper. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@device-mode-cleanup-remove-files
Patch Set: Created 4 years, 11 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 side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/Source/devtools/front_end/emulation/DeviceModeView.js
diff --git a/third_party/WebKit/Source/devtools/front_end/emulation/DeviceModeView.js b/third_party/WebKit/Source/devtools/front_end/emulation/DeviceModeView.js
index da378087eae4001530e8ecb6998b29cec3c2d809..7954e046c8f607974b9c8340ec603559c19e5240 100644
--- a/third_party/WebKit/Source/devtools/front_end/emulation/DeviceModeView.js
+++ b/third_party/WebKit/Source/devtools/front_end/emulation/DeviceModeView.js
@@ -33,7 +33,7 @@ WebInspector.DeviceModeView = function()
WebInspector.DeviceModeView.prototype = {
_createUI: function()
{
- this._toolbar = new WebInspector.DeviceModeView.Toolbar(this._model, this._showMediaInspectorSetting, this._showRulersSetting);
+ this._toolbar = new WebInspector.DeviceModeToolbar(this._model, this._showMediaInspectorSetting, this._showRulersSetting);
this.contentElement.appendChild(this._toolbar.element());
this._contentClip = this.contentElement.createChild("div", "device-mode-content-clip vbox");
@@ -343,569 +343,6 @@ WebInspector.DeviceModeView.prototype = {
}
/**
- * @param {!WebInspector.DeviceModeModel} model
- * @param {!WebInspector.Setting} showMediaInspectorSetting
- * @param {!WebInspector.Setting} showRulersSetting
- * @constructor
- */
-WebInspector.DeviceModeView.Toolbar = function(model, showMediaInspectorSetting, showRulersSetting)
-{
- this._model = model;
- this._showMediaInspectorSetting = showMediaInspectorSetting;
- this._showRulersSetting = showRulersSetting;
- /** @type {!Map<!WebInspector.EmulatedDevice, !WebInspector.EmulatedDevice.Mode>} */
- this._lastMode = new Map();
-
- this._element = createElementWithClass("div", "device-mode-toolbar");
-
- var leftContainer = this._element.createChild("div", "device-mode-toolbar-spacer");
- leftContainer.createChild("div", "device-mode-toolbar-spacer");
- var leftToolbar = new WebInspector.Toolbar("", leftContainer);
- leftToolbar.makeWrappable();
- this._fillLeftToolbar(leftToolbar);
-
- var mainToolbar = new WebInspector.Toolbar("", this._element);
- mainToolbar.makeWrappable();
- this._fillMainToolbar(mainToolbar);
-
- var rightContainer = this._element.createChild("div", "device-mode-toolbar-spacer");
- var rightToolbar = new WebInspector.Toolbar("device-mode-toolbar-fixed-size", rightContainer);
- rightToolbar.makeWrappable();
- this._fillRightToolbar(rightToolbar);
- var modeToolbar = new WebInspector.Toolbar("device-mode-toolbar-fixed-size", rightContainer);
- modeToolbar.makeWrappable();
- this._fillModeToolbar(modeToolbar);
- rightContainer.createChild("div", "device-mode-toolbar-spacer");
- var optionsToolbar = new WebInspector.Toolbar("", rightContainer);
- optionsToolbar.makeWrappable(true);
- this._fillOptionsToolbar(optionsToolbar);
-
- WebInspector.emulatedDevicesList.addEventListener(WebInspector.EmulatedDevicesList.Events.CustomDevicesUpdated, this._deviceListChanged, this);
- WebInspector.emulatedDevicesList.addEventListener(WebInspector.EmulatedDevicesList.Events.StandardDevicesUpdated, this._deviceListChanged, this);
-
- this._persistenceSetting = WebInspector.settings.createSetting("emulation.deviceModeValue", {device: "", orientation: "", mode: ""});
-}
-
-WebInspector.DeviceModeView.Toolbar.prototype = {
- /**
- * @param {!WebInspector.Toolbar} toolbar
- */
- _fillLeftToolbar: function(toolbar)
- {
- toolbar.appendToolbarItem(this._wrapToolbarItem(createElementWithClass("div", "device-mode-empty-toolbar-element")));
- this._deviceSelectItem = new WebInspector.ToolbarMenuButton(this._appendDeviceMenuItems.bind(this));
- this._deviceSelectItem.setGlyph("");
- this._deviceSelectItem.turnIntoSelect(95);
- toolbar.appendToolbarItem(this._deviceSelectItem);
- },
-
- /**
- * @param {!WebInspector.Toolbar} toolbar
- */
- _fillMainToolbar: function(toolbar)
- {
- var widthInput = createElementWithClass("input", "device-mode-size-input");
- widthInput.maxLength = 4;
- widthInput.type = "text";
- widthInput.title = WebInspector.UIString("Width");
- this._updateWidthInput = this._bindInput(widthInput, this._model.setWidthAndScaleToFit.bind(this._model), WebInspector.DeviceModeModel.deviceSizeValidator);
- this._widthInput = widthInput;
- this._widthItem = this._wrapToolbarItem(widthInput);
- toolbar.appendToolbarItem(this._widthItem);
-
- var xElement = createElementWithClass("div", "device-mode-x");
- xElement.textContent = "\u00D7";
- this._xItem = this._wrapToolbarItem(xElement);
- toolbar.appendToolbarItem(this._xItem);
-
- var heightInput = createElementWithClass("input", "device-mode-size-input");
- heightInput.maxLength = 4;
- heightInput.type = "text";
- heightInput.title = WebInspector.UIString("Height (leave empty for full)");
- this._updateHeightInput = this._bindInput(heightInput, this._model.setHeightAndScaleToFit.bind(this._model), validateHeight);
- this._heightInput = heightInput;
- this._heightItem = this._wrapToolbarItem(heightInput);
- toolbar.appendToolbarItem(this._heightItem);
-
- /**
- * @param {string} value
- * @return {string}
- */
- function validateHeight(value)
- {
- return !value ? "" : WebInspector.DeviceModeModel.deviceSizeValidator(value);
- }
- },
-
- /**
- * @param {!WebInspector.Toolbar} toolbar
- */
- _fillRightToolbar: function(toolbar)
- {
- toolbar.appendToolbarItem(this._wrapToolbarItem(createElementWithClass("div", "device-mode-empty-toolbar-element")));
- this._scaleItem = new WebInspector.ToolbarMenuButton(this._appendScaleMenuItems.bind(this));
- this._scaleItem.setTitle(WebInspector.UIString("Zoom"));
- this._scaleItem.setGlyph("");
- this._scaleItem.turnIntoSelect();
- toolbar.appendToolbarItem(this._scaleItem);
- },
-
- /**
- * @param {!WebInspector.Toolbar} toolbar
- */
- _fillModeToolbar: function(toolbar)
- {
- toolbar.appendToolbarItem(this._wrapToolbarItem(createElementWithClass("div", "device-mode-empty-toolbar-element")));
- this._modeButton = new WebInspector.ToolbarButton("", "rotate-screen-toolbar-item");
- this._modeButton.addEventListener("click", this._modeMenuClicked, this);
- toolbar.appendToolbarItem(this._modeButton);
- },
-
- /**
- * @param {!WebInspector.Toolbar} toolbar
- */
- _fillOptionsToolbar: function(toolbar)
- {
- this._uaItem = new WebInspector.ToolbarText();
- this._uaItem.setVisible(false);
- this._uaItem.setTitle(WebInspector.UIString("User agent type"));
- toolbar.appendToolbarItem(this._uaItem);
-
- this._deviceScaleItem = new WebInspector.ToolbarText();
- this._deviceScaleItem.setVisible(false);
- this._deviceScaleItem.setTitle(WebInspector.UIString("Device pixel ratio"));
- toolbar.appendToolbarItem(this._deviceScaleItem);
-
- var moreOptionsButton = new WebInspector.ToolbarMenuButton(this._appendOptionsMenuItems.bind(this));
- moreOptionsButton.setTitle(WebInspector.UIString("More options"));
- toolbar.appendToolbarItem(moreOptionsButton);
-
- toolbar.appendToolbarItem(this._wrapToolbarItem(createElementWithClass("div", "device-mode-empty-toolbar-element")));
- },
-
-
- /**
- * @param {!Element} input
- * @param {function(number)} apply
- * @param {function(string):?string} validate
- * @return {function(number)}
- */
- _bindInput: function(input, apply, validate)
- {
- input.addEventListener("change", onChange, false);
- input.addEventListener("input", onInput, false);
- input.addEventListener("keydown", onKeyDown, false);
- input.addEventListener("focus", input.select.bind(input), false);
-
- function onInput()
- {
- input.classList.toggle("error-input", !!validate(input.value));
- }
-
- function onChange()
- {
- var valid = !validate(input.value);
- input.classList.toggle("error-input", !valid);
- if (valid)
- apply(input.value ? Number(input.value) : 0);
- }
-
- /**
- * @param {!Event} event
- */
- function onKeyDown(event)
- {
- if (isEnterKey(event)) {
- if (!validate(input.value))
- apply(input.value ? Number(input.value) : 0);
- return;
- }
-
- var increment = event.keyIdentifier === "Up" ? 1 : event.keyIdentifier === "Down" ? -1 : 0;
- if (!increment)
- return;
- if (event.shiftKey)
- increment *= 10;
-
- var value = input.value;
- if (validate(value) || !value)
- return;
-
- value = (value ? Number(value) : 0) + increment;
- var stringValue = value ? String(value) : "";
- if (validate(stringValue) || !value)
- return;
-
- input.value = stringValue;
- apply(input.value ? Number(input.value) : 0);
- event.preventDefault();
- }
-
- /**
- * @param {number} value
- */
- function setValue(value)
- {
- var stringValue = value ? String(value) : "";
- if (stringValue === input.value)
- return;
- var valid = !validate(stringValue);
- input.classList.toggle("error-input", !valid);
- input.value = stringValue;
- input.setSelectionRange(stringValue.length, stringValue.length);
- }
-
- return setValue;
- },
-
- /**
- * @param {!WebInspector.ContextMenu} contextMenu
- */
- _appendScaleMenuItems: function(contextMenu)
- {
- var scaleSetting = this._model.scaleSetting();
- if (this._model.type() === WebInspector.DeviceModeModel.Type.Device) {
- contextMenu.appendItem(WebInspector.UIString("Fit to window (%.0f%%)", this._model.fitScale() * 100), scaleSetting.set.bind(scaleSetting, this._model.fitScale()), false);
- contextMenu.appendSeparator();
- }
- appendScaleItem(WebInspector.UIString("50%"), 0.5);
- appendScaleItem(WebInspector.UIString("75%"), 0.75);
- appendScaleItem(WebInspector.UIString("100%"), 1);
- appendScaleItem(WebInspector.UIString("125%"), 1.25);
- appendScaleItem(WebInspector.UIString("150%"), 1.5);
-
- /**
- * @param {string} title
- * @param {number} value
- */
- function appendScaleItem(title, value)
- {
- contextMenu.appendCheckboxItem(title, scaleSetting.set.bind(scaleSetting, value), scaleSetting.get() === value, false);
- }
- },
-
- /**
- * @param {!WebInspector.ContextMenu} contextMenu
- */
- _appendOptionsMenuItems: function(contextMenu)
- {
- var uaDisabled = this._model.type() !== WebInspector.DeviceModeModel.Type.Responsive;
- var uaSetting = this._model.uaSetting();
- var uaSubmenu = contextMenu.appendSubMenuItem(WebInspector.UIString("User agent type"), false);
- var uaValue = this._model.uaSetting().get();
- if (this._model.type() === WebInspector.DeviceModeModel.Type.None)
- uaValue = WebInspector.DeviceModeModel.UA.Desktop;
- if (this._model.type() === WebInspector.DeviceModeModel.Type.Device)
- uaValue = this._model.device().mobile() ? WebInspector.DeviceModeModel.UA.Mobile : this._model.device().touch() ? WebInspector.DeviceModeModel.UA.DesktopTouch : WebInspector.DeviceModeModel.UA.Desktop;
- appendUAItem(WebInspector.UIString("Mobile (default)"), WebInspector.DeviceModeModel.UA.Mobile);
- appendUAItem(WebInspector.UIString("Desktop"), WebInspector.DeviceModeModel.UA.Desktop);
- appendUAItem(WebInspector.UIString("Desktop with touch"), WebInspector.DeviceModeModel.UA.DesktopTouch);
-
- /**
- * @param {string} title
- * @param {!WebInspector.DeviceModeModel.UA} value
- */
- function appendUAItem(title, value)
- {
- uaSubmenu.appendCheckboxItem(title, uaSetting.set.bind(uaSetting, value), uaValue === value, uaDisabled);
- }
-
- var deviceScaleFactorDisabled = this._model.type() !== WebInspector.DeviceModeModel.Type.Responsive;
- var deviceScaleFactorSubmenu = contextMenu.appendSubMenuItem(WebInspector.UIString("Device pixel ratio"), false);
- var deviceScaleFactorSetting = this._model.deviceScaleFactorSetting();
- var deviceScaleFactorValue = deviceScaleFactorDisabled ? 0 : deviceScaleFactorSetting.get();
- appendDeviceScaleFactorItem(WebInspector.UIString("Default: %f", this._model.defaultDeviceScaleFactor()), 0);
- deviceScaleFactorSubmenu.appendSeparator();
- appendDeviceScaleFactorItem(WebInspector.UIString("1"), 1);
- appendDeviceScaleFactorItem(WebInspector.UIString("2"), 2);
- appendDeviceScaleFactorItem(WebInspector.UIString("3"), 3);
-
- /**
- * @param {string} title
- * @param {number} value
- */
- function appendDeviceScaleFactorItem(title, value)
- {
- deviceScaleFactorSubmenu.appendCheckboxItem(title, deviceScaleFactorSetting.set.bind(deviceScaleFactorSetting, value), deviceScaleFactorValue === value, deviceScaleFactorDisabled);
- }
-
- contextMenu.appendItem(WebInspector.UIString("Reset to defaults"), this._model.reset.bind(this._model), this._model.type() !== WebInspector.DeviceModeModel.Type.Responsive);
- contextMenu.appendSeparator();
-
- contextMenu.appendCheckboxItem(WebInspector.UIString("Show media queries"), this._toggleMediaInspector.bind(this), this._showMediaInspectorSetting.get(), this._model.type() === WebInspector.DeviceModeModel.Type.None);
- contextMenu.appendCheckboxItem(WebInspector.UIString("Show rulers"), this._toggleRulers.bind(this), this._showRulersSetting.get(), this._model.type() === WebInspector.DeviceModeModel.Type.None);
- contextMenu.appendItem(WebInspector.UIString("Configure network\u2026"), this._openNetworkConfig.bind(this), false);
- contextMenu.appendItemsAtLocation("deviceModeMenu");
- },
-
- _toggleMediaInspector: function()
- {
- this._showMediaInspectorSetting.set(!this._showMediaInspectorSetting.get());
- },
-
- _toggleRulers: function()
- {
- this._showRulersSetting.set(!this._showRulersSetting.get());
- },
-
- _openNetworkConfig: function()
- {
- InspectorFrontendHost.bringToFront();
- // TODO(dgozman): make it explicit.
- WebInspector.actionRegistry.action("network.show-config").execute();
- },
-
- /**
- * @param {!Element} element
- * @return {!WebInspector.ToolbarItem}
- */
- _wrapToolbarItem: function(element)
- {
- var container = createElement("div");
- var shadowRoot = WebInspector.createShadowRootWithCoreStyles(container, "emulation/deviceModeToolbar.css");
- shadowRoot.appendChild(element);
- return new WebInspector.ToolbarItem(container);
- },
-
- /**
- * @param {!WebInspector.EmulatedDevice} device
- */
- _emulateDevice: function(device)
- {
- this._model.emulate(WebInspector.DeviceModeModel.Type.Device, device, this._lastMode.get(device) || device.modes[0]);
- },
-
- _switchToResponsive: function()
- {
- this._model.emulate(WebInspector.DeviceModeModel.Type.Responsive, null, null);
- },
-
- /**
- * @param {!Array<!WebInspector.EmulatedDevice>} devices
- * @return {!Array<!WebInspector.EmulatedDevice>}
- */
- _filterDevices: function(devices)
- {
- devices = devices.filter(function(d) { return d.show(); });
- devices.sort(WebInspector.EmulatedDevice.deviceComparator);
- return devices;
- },
-
- /**
- * @return {!Array<!WebInspector.EmulatedDevice>}
- */
- _standardDevices: function()
- {
- return this._filterDevices(WebInspector.emulatedDevicesList.standard());
- },
-
- /**
- * @return {!Array<!WebInspector.EmulatedDevice>}
- */
- _customDevices: function()
- {
- return this._filterDevices(WebInspector.emulatedDevicesList.custom());
- },
-
- /**
- * @return {!Array<!WebInspector.EmulatedDevice>}
- */
- _allDevices: function()
- {
- return this._standardDevices().concat(this._customDevices());
- },
-
- /**
- * @param {!WebInspector.ContextMenu} contextMenu
- */
- _appendDeviceMenuItems: function(contextMenu)
- {
- contextMenu.appendCheckboxItem(WebInspector.UIString("Responsive"), this._switchToResponsive.bind(this), this._model.type() === WebInspector.DeviceModeModel.Type.Responsive, false);
- appendGroup.call(this, this._standardDevices());
- appendGroup.call(this, this._customDevices());
- contextMenu.appendSeparator();
- contextMenu.appendItem(WebInspector.UIString("Edit\u2026"), WebInspector.emulatedDevicesList.revealCustomSetting.bind(WebInspector.emulatedDevicesList), false);
-
- /**
- * @param {!Array<!WebInspector.EmulatedDevice>} devices
- * @this {WebInspector.DeviceModeView.Toolbar}
- */
- function appendGroup(devices)
- {
- if (!devices.length)
- return;
- contextMenu.appendSeparator();
- for (var device of devices)
- contextMenu.appendCheckboxItem(device.title, this._emulateDevice.bind(this, device), this._model.device() === device, false);
- }
- },
-
- /**
- * @this {WebInspector.DeviceModeView.Toolbar}
- */
- _deviceListChanged: function()
- {
- if (!this._model.device())
- return;
-
- var devices = this._allDevices();
- if (devices.indexOf(this._model.device()) === -1)
- this._emulateDevice(devices[0] || WebInspector.emulatedDevicesList.standard()[0]);
- },
-
- /**
- * @param {!WebInspector.Event} event
- */
- _modeMenuClicked: function(event)
- {
- var device = this._model.device();
- var model = this._model;
-
- if (device.modes.length === 2 && device.modes[0].orientation !== device.modes[1].orientation) {
- model.emulate(model.type(), model.device(), model.mode() === device.modes[0] ? device.modes[1] : device.modes[0]);
- return;
- }
-
- var contextMenu = new WebInspector.ContextMenu(/** @type {!Event} */ (event.data),
- false,
- event.target.element.totalOffsetLeft(),
- event.target.element.totalOffsetTop() + event.target.element.offsetHeight);
- addOrientation(WebInspector.EmulatedDevice.Vertical, WebInspector.UIString("Portrait"));
- addOrientation(WebInspector.EmulatedDevice.Horizontal, WebInspector.UIString("Landscape"));
- contextMenu.show();
-
- /**
- * @param {string} orientation
- * @param {string} title
- */
- function addOrientation(orientation, title)
- {
- var modes = device.modesForOrientation(orientation);
- if (!modes.length)
- return;
- if (modes.length === 1) {
- addMode(modes[0], title);
- } else {
- for (var index = 0; index < modes.length; index++)
- addMode(modes[index], title + " \u2013 " + modes[index].title);
- }
- }
-
- /**
- * @param {!WebInspector.EmulatedDevice.Mode} mode
- * @param {string} title
- */
- function addMode(mode, title)
- {
- contextMenu.appendCheckboxItem(title, applyMode.bind(null, mode), model.mode() === mode, false);
- }
-
- /**
- * @param {!WebInspector.EmulatedDevice.Mode} mode
- */
- function applyMode(mode)
- {
- model.emulate(model.type(), model.device(), mode);
- }
- },
-
- /**
- * @return {!Element}
- */
- element: function()
- {
- return this._element;
- },
-
- update: function()
- {
- if (this._model.type() !== this._cachedModelType) {
- this._cachedModelType = this._model.type();
- this._widthInput.disabled = this._model.type() !== WebInspector.DeviceModeModel.Type.Responsive;
- this._heightInput.disabled = this._model.type() !== WebInspector.DeviceModeModel.Type.Responsive;
- }
-
- var size = this._model.appliedDeviceSize();
- this._updateHeightInput(this._model.type() === WebInspector.DeviceModeModel.Type.Responsive && this._model.isFullHeight() ? 0 : size.height);
- this._updateWidthInput(size.width);
- this._heightInput.placeholder = size.height;
-
- if (this._model.scale() !== this._cachedScale) {
- this._scaleItem.setText(WebInspector.UIString("%.0f%%", this._model.scale() * 100));
- this._scaleItem.setState(this._model.scale() === 1 ? "off" : "on");
- this._cachedScale = this._model.scale();
- }
-
- var deviceScale = this._model.deviceScaleFactorSetting().get();
- this._deviceScaleItem.setVisible(this._model.type() === WebInspector.DeviceModeModel.Type.Responsive && !!deviceScale);
- if (deviceScale !== this._cachedDeviceScale) {
- this._deviceScaleItem.setText(WebInspector.UIString("DPR: %.1f", deviceScale));
- this._cachedDeviceScale = deviceScale;
- }
-
- var uaType = this._model.type() === WebInspector.DeviceModeModel.Type.Responsive ? this._model.uaSetting().get() : WebInspector.DeviceModeModel.UA.Mobile;
- this._uaItem.setVisible(this._model.type() === WebInspector.DeviceModeModel.Type.Responsive && uaType !== WebInspector.DeviceModeModel.UA.Mobile);
- if (uaType !== this._cachedUaType) {
- this._uaItem.setText(uaType === WebInspector.DeviceModeModel.UA.Desktop ? WebInspector.UIString("Desktop") : WebInspector.UIString("Touch"));
- this._cachedUaType = uaType;
- }
-
- var deviceItemTitle = WebInspector.UIString("None");
- if (this._model.type() === WebInspector.DeviceModeModel.Type.Responsive)
- deviceItemTitle = WebInspector.UIString("Responsive");
- if (this._model.type() === WebInspector.DeviceModeModel.Type.Device)
- deviceItemTitle = this._model.device().title;
- this._deviceSelectItem.setText(deviceItemTitle);
-
- if (this._model.device() !== this._cachedModelDevice) {
- var device = this._model.device();
- this._modeButton.setVisible(!!device);
- if (device) {
- var modeCount = device ? device.modes.length : 0;
- this._modeButton.setEnabled(modeCount >= 2);
- this._modeButton.setTitle(modeCount === 2 ? WebInspector.UIString("Rotate") : WebInspector.UIString("Screen options"));
- }
- this._cachedModelDevice = device;
- }
-
- if (this._model.type() === WebInspector.DeviceModeModel.Type.Device)
- this._lastMode.set(/** @type {!WebInspector.EmulatedDevice} */ (this._model.device()), /** @type {!WebInspector.EmulatedDevice.Mode} */ (this._model.mode()));
-
- if (this._model.mode() !== this._cachedModelMode && this._model.type() !== WebInspector.DeviceModeModel.Type.None) {
- this._cachedModelMode = this._model.mode();
- var value = this._persistenceSetting.get();
- if (this._model.device()) {
- value.device = this._model.device().title;
- value.orientation = this._model.mode() ? this._model.mode().orientation : "";
- value.mode = this._model.mode() ? this._model.mode().title : "";
- } else {
- value.device = "";
- value.orientation = "";
- value.mode = "";
- }
- this._persistenceSetting.set(value);
- }
- },
-
- restore: function()
- {
- for (var device of this._allDevices()) {
- if (device.title === this._persistenceSetting.get().device) {
- for (var mode of device.modes) {
- if (mode.orientation === this._persistenceSetting.get().orientation && mode.title === this._persistenceSetting.get().mode) {
- this._lastMode.set(device, mode);
- this._emulateDevice(device);
- return;
- }
- }
- }
- }
-
- this._model.emulate(WebInspector.DeviceModeModel.Type.Responsive, null, null);
- }
-}
-
-/**
* @constructor
* @extends {WebInspector.VBox}
* @param {boolean} horizontal
@@ -1012,97 +449,3 @@ WebInspector.DeviceModeView.Ruler.prototype = {
__proto__: WebInspector.VBox.prototype
}
-
-
-/**
- * @constructor
- * @implements {WebInspector.ActionDelegate}
- */
-WebInspector.DeviceModeView.ActionDelegate = function()
-{
-}
-
-WebInspector.DeviceModeView.ActionDelegate.prototype = {
- /**
- * @override
- * @param {!WebInspector.Context} context
- * @param {string} actionId
- * @return {boolean}
- */
- handleAction: function(context, actionId)
- {
- if (WebInspector.DeviceModeView._wrapperInstance) {
- if (actionId === "emulation.toggle-device-mode") {
- WebInspector.DeviceModeView._wrapperInstance._toggleDeviceMode();
- return true;
- }
- if (actionId === "emulation.request-app-banner") {
- WebInspector.DeviceModeView._wrapperInstance._requestAppBanner();
- return true;
- }
- }
- return false;
- }
-}
-
-
-/**
- * @extends {WebInspector.VBox}
- * @param {!WebInspector.InspectedPagePlaceholder} inspectedPagePlaceholder
- * @constructor
- */
-WebInspector.DeviceModeView.Wrapper = function(inspectedPagePlaceholder)
-{
- WebInspector.VBox.call(this);
- WebInspector.DeviceModeView._wrapperInstance = this;
- this._inspectedPagePlaceholder = inspectedPagePlaceholder;
- /** @type {?WebInspector.DeviceModeView} */
- this._deviceModeView = null;
- this._toggleDeviceModeAction = WebInspector.actionRegistry.action("emulation.toggle-device-mode");
- this._showDeviceModeSetting = WebInspector.settings.createSetting("emulation.showDeviceMode", false);
- this._showDeviceModeSetting.addChangeListener(this._update.bind(this, false));
- this._update(true);
-}
-
-/** @type {!WebInspector.DeviceModeView.Wrapper} */
-WebInspector.DeviceModeView._wrapperInstance;
-
-WebInspector.DeviceModeView.Wrapper.prototype = {
- _toggleDeviceMode: function()
- {
- this._showDeviceModeSetting.set(!this._showDeviceModeSetting.get());
- },
-
- /**
- * @param {boolean} force
- */
- _update: function(force)
- {
- this._toggleDeviceModeAction.setToggled(this._showDeviceModeSetting.get());
- if (!force) {
- var showing = this._deviceModeView && this._deviceModeView.isShowing();
- if (this._showDeviceModeSetting.get() === showing)
- return;
- }
-
- if (this._showDeviceModeSetting.get()) {
- if (!this._deviceModeView)
- this._deviceModeView = new WebInspector.DeviceModeView();
- this._deviceModeView.show(this.element);
- this._inspectedPagePlaceholder.clearMinimumSizeAndMargins();
- this._inspectedPagePlaceholder.show(this._deviceModeView.element);
- } else {
- if (this._deviceModeView)
- this._deviceModeView.detach();
- this._inspectedPagePlaceholder.restoreMinimumSizeAndMargins();
- this._inspectedPagePlaceholder.show(this.element);
- }
- },
-
- _requestAppBanner: function()
- {
- this._deviceModeView._model.requestAppBanner();
- },
-
- __proto__: WebInspector.VBox.prototype
-}

Powered by Google App Engine
This is Rietveld 408576698