diff options
Diffstat (limited to '')
4 files changed, 133 insertions, 0 deletions
diff --git a/devtools/client/inspector/flexbox/actions/flexbox-highlighter.js b/devtools/client/inspector/flexbox/actions/flexbox-highlighter.js new file mode 100644 index 0000000000..487a4c3b12 --- /dev/null +++ b/devtools/client/inspector/flexbox/actions/flexbox-highlighter.js @@ -0,0 +1,39 @@ +/* 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"; + +/** + * This module exports thunks. + * Thunks are functions that can be dispatched to the Inspector Redux store. + * + * These functions receive one object with options that contains: + * - dispatch() => function to dispatch Redux actions to the store + * - getState() => function to get the current state of the entire Inspector Redux store + * - inspector => object instance of Inspector panel + * + * They provide a shortcut for React components to invoke the flexbox highlighter + * without having to know where the highlighter exists. + */ + +module.exports = { + /** + * Toggle the flexbox highlighter for the given node front. + * + * @param {NodeFront} nodeFront + * Node for which the highlighter should be toggled. + * @param {String} reason + * Reason why the highlighter was toggled; used in telemetry. + */ + toggleFlexboxHighlighter(nodeFront, reason) { + return async thunkOptions => { + const { inspector } = thunkOptions; + if (!inspector || inspector._destroyed) { + return; + } + + await inspector.highlighters.toggleFlexboxHighlighter(nodeFront, reason); + }; + }, +}; diff --git a/devtools/client/inspector/flexbox/actions/flexbox.js b/devtools/client/inspector/flexbox/actions/flexbox.js new file mode 100644 index 0000000000..64c1e1f074 --- /dev/null +++ b/devtools/client/inspector/flexbox/actions/flexbox.js @@ -0,0 +1,59 @@ +/* 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 { + CLEAR_FLEXBOX, + UPDATE_FLEXBOX, + UPDATE_FLEXBOX_COLOR, + UPDATE_FLEXBOX_HIGHLIGHTED, +} = require("resource://devtools/client/inspector/flexbox/actions/index.js"); + +module.exports = { + /** + * Clears the flexbox state by resetting it back to the initial flexbox state. + */ + clearFlexbox() { + return { + type: CLEAR_FLEXBOX, + }; + }, + + /** + * Updates the flexbox state with the newly selected flexbox. + */ + updateFlexbox(flexbox) { + return { + type: UPDATE_FLEXBOX, + flexbox, + }; + }, + + /** + * Updates the color used for the flexbox's highlighter. + * + * @param {String} color + * The color to use for this nodeFront's flexbox highlighter. + */ + updateFlexboxColor(color) { + return { + type: UPDATE_FLEXBOX_COLOR, + color, + }; + }, + + /** + * Updates the flexbox highlighted state. + * + * @param {Boolean} highlighted + * Whether or not the flexbox highlighter is highlighting the flexbox. + */ + updateFlexboxHighlighted(highlighted) { + return { + type: UPDATE_FLEXBOX_HIGHLIGHTED, + highlighted, + }; + }, +}; diff --git a/devtools/client/inspector/flexbox/actions/index.js b/devtools/client/inspector/flexbox/actions/index.js new file mode 100644 index 0000000000..bc4e30044e --- /dev/null +++ b/devtools/client/inspector/flexbox/actions/index.js @@ -0,0 +1,24 @@ +/* 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 { createEnum } = require("resource://devtools/client/shared/enum.js"); + +createEnum( + [ + // Clears the flexbox state by resetting it back to the initial flexbox state. + "CLEAR_FLEXBOX", + + // Updates the flexbox state with the newly selected flexbox. + "UPDATE_FLEXBOX", + + // Updates the color used for the overlay of a flexbox. + "UPDATE_FLEXBOX_COLOR", + + // Updates the flexbox highlighted state. + "UPDATE_FLEXBOX_HIGHLIGHTED", + ], + module.exports +); diff --git a/devtools/client/inspector/flexbox/actions/moz.build b/devtools/client/inspector/flexbox/actions/moz.build new file mode 100644 index 0000000000..3e5ab1eda8 --- /dev/null +++ b/devtools/client/inspector/flexbox/actions/moz.build @@ -0,0 +1,11 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# vim: set filetype=python: +# 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/. + +DevToolsModules( + "flexbox-highlighter.js", + "flexbox.js", + "index.js", +) |