diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /devtools/client/responsive/reducers/viewports.js | |
parent | Initial commit. (diff) | |
download | firefox-esr-upstream.tar.xz firefox-esr-upstream.zip |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'devtools/client/responsive/reducers/viewports.js')
-rw-r--r-- | devtools/client/responsive/reducers/viewports.js | 212 |
1 files changed, 212 insertions, 0 deletions
diff --git a/devtools/client/responsive/reducers/viewports.js b/devtools/client/responsive/reducers/viewports.js new file mode 100644 index 0000000000..71ced90975 --- /dev/null +++ b/devtools/client/responsive/reducers/viewports.js @@ -0,0 +1,212 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +"use strict"; + +const { + ADD_VIEWPORT, + CHANGE_DEVICE, + CHANGE_PIXEL_RATIO, + CHANGE_VIEWPORT_ANGLE, + EDIT_DEVICE, + REMOVE_DEVICE_ASSOCIATION, + RESIZE_VIEWPORT, + ROTATE_VIEWPORT, + ZOOM_VIEWPORT, +} = require("resource://devtools/client/responsive/actions/index.js"); + +const VIEWPORT_WIDTH_PREF = "devtools.responsive.viewport.width"; +const VIEWPORT_HEIGHT_PREF = "devtools.responsive.viewport.height"; +const VIEWPORT_PIXEL_RATIO_PREF = "devtools.responsive.viewport.pixelRatio"; +const VIEWPORT_ANGLE_PREF = "devtools.responsive.viewport.angle"; + +let nextViewportId = 0; + +const INITIAL_VIEWPORTS = []; +const INITIAL_VIEWPORT = { + id: nextViewportId++, + angle: Services.prefs.getIntPref(VIEWPORT_ANGLE_PREF, 0), + device: "", + deviceType: "", + height: Services.prefs.getIntPref(VIEWPORT_HEIGHT_PREF, 480), + width: Services.prefs.getIntPref(VIEWPORT_WIDTH_PREF, 320), + pixelRatio: Services.prefs.getIntPref(VIEWPORT_PIXEL_RATIO_PREF, 0), + userContextId: 0, + zoom: 1, +}; + +const reducers = { + [ADD_VIEWPORT](viewports, { userContextId }) { + // For the moment, there can be at most one viewport. + if (viewports.length === 1) { + return viewports; + } + + return [ + ...viewports, + { + ...INITIAL_VIEWPORT, + userContextId, + }, + ]; + }, + + [CHANGE_DEVICE](viewports, { id, device, deviceType }) { + return viewports.map(viewport => { + if (viewport.id !== id) { + return viewport; + } + + return { + ...viewport, + device, + deviceType, + }; + }); + }, + + [CHANGE_PIXEL_RATIO](viewports, { id, pixelRatio }) { + return viewports.map(viewport => { + if (viewport.id !== id) { + return viewport; + } + + Services.prefs.setIntPref(VIEWPORT_PIXEL_RATIO_PREF, pixelRatio); + + return { + ...viewport, + pixelRatio, + }; + }); + }, + + [CHANGE_VIEWPORT_ANGLE](viewports, { id, angle }) { + return viewports.map(viewport => { + if (viewport.id !== id) { + return viewport; + } + + Services.prefs.setIntPref(VIEWPORT_ANGLE_PREF, angle); + + return { + ...viewport, + angle, + }; + }); + }, + + [EDIT_DEVICE](viewports, { viewport, newDevice, deviceType }) { + if (!viewport) { + return viewports; + } + + return viewports.map(v => { + if (v.id !== viewport.id) { + return viewport; + } + + Services.prefs.setIntPref(VIEWPORT_WIDTH_PREF, newDevice.width); + Services.prefs.setIntPref(VIEWPORT_HEIGHT_PREF, newDevice.height); + Services.prefs.setIntPref( + VIEWPORT_PIXEL_RATIO_PREF, + newDevice.pixelRatio + ); + + return { + ...viewport, + device: newDevice.name, + deviceType, + height: newDevice.height, + width: newDevice.width, + pixelRatio: newDevice.pixelRatio, + userAgent: newDevice.userAgent, + touch: newDevice.touch, + }; + }); + }, + + [REMOVE_DEVICE_ASSOCIATION](viewports, { id }) { + return viewports.map(viewport => { + if (viewport.id !== id) { + return viewport; + } + + return { + ...viewport, + device: "", + deviceType: "", + }; + }); + }, + + [RESIZE_VIEWPORT](viewports, { id, width, height }) { + return viewports.map(viewport => { + if (viewport.id !== id) { + return viewport; + } + + if (!height) { + height = viewport.height; + } + + if (!width) { + width = viewport.width; + } + + Services.prefs.setIntPref(VIEWPORT_WIDTH_PREF, width); + Services.prefs.setIntPref(VIEWPORT_HEIGHT_PREF, height); + + return { + ...viewport, + height, + width, + }; + }); + }, + + [ROTATE_VIEWPORT](viewports, { id }) { + return viewports.map(viewport => { + if (viewport.id !== id) { + return viewport; + } + + const height = viewport.width; + const width = viewport.height; + + Services.prefs.setIntPref(VIEWPORT_WIDTH_PREF, width); + Services.prefs.setIntPref(VIEWPORT_HEIGHT_PREF, height); + + return { + ...viewport, + height, + width, + }; + }); + }, + + [ZOOM_VIEWPORT](viewports, { id, zoom }) { + return viewports.map(viewport => { + if (viewport.id !== id) { + return viewport; + } + + if (!zoom) { + zoom = viewport.zoom; + } + + return { + ...viewport, + zoom, + }; + }); + }, +}; + +module.exports = function (viewports = INITIAL_VIEWPORTS, action) { + const reducer = reducers[action.type]; + if (!reducer) { + return viewports; + } + return reducer(viewports, action); +}; |