summaryrefslogtreecommitdiffstats
path: root/devtools/client/responsive/reducers/viewports.js
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /devtools/client/responsive/reducers/viewports.js
parentInitial commit. (diff)
downloadfirefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.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.js212
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);
+};