diff options
Diffstat (limited to '')
5 files changed, 188 insertions, 0 deletions
diff --git a/devtools/client/inspector/grids/actions/grid-highlighter.js b/devtools/client/inspector/grids/actions/grid-highlighter.js new file mode 100644 index 0000000000..6706dc88cd --- /dev/null +++ b/devtools/client/inspector/grids/actions/grid-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 client + * + * They provide a shortcut for React components to invoke the box model highlighter + * without having to know where the highlighter exists. + */ + +module.exports = { + /** + * Show the grid highlighter for the given node front. + * + * @param {NodeFront} nodeFront + * Node that should be highlighted. + * @param {Object} options + * Optional configuration options passed to the grid highlighter + */ + showGridHighlighter(nodeFront, options = {}) { + return async thunkOptions => { + const { inspector } = thunkOptions; + if (!inspector) { + return; + } + + await inspector.highlighters.showGridHighlighter(nodeFront, options); + }; + }, +}; diff --git a/devtools/client/inspector/grids/actions/grids.js b/devtools/client/inspector/grids/actions/grids.js new file mode 100644 index 0000000000..724582c3d5 --- /dev/null +++ b/devtools/client/inspector/grids/actions/grids.js @@ -0,0 +1,55 @@ +/* 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 { + UPDATE_GRID_COLOR, + UPDATE_GRID_HIGHLIGHTED, + UPDATE_GRIDS, +} = require("resource://devtools/client/inspector/grids/actions/index.js"); + +module.exports = { + /** + * Updates the color used for the grid's highlighter. + * + * @param {NodeFront} nodeFront + * The NodeFront of the DOM node to toggle the grid highlighter. + * @param {String} color + * The color to use for this nodeFront's grid highlighter. + */ + updateGridColor(nodeFront, color) { + return { + type: UPDATE_GRID_COLOR, + color, + nodeFront, + }; + }, + + /** + * Updates the grid highlighted state. + * + * @param {NodeFront} nodeFront + * The NodeFront of the DOM node to toggle the grid highlighter. + * @param {Boolean} highlighted + * Whether or not the grid highlighter is highlighting the grid. + */ + updateGridHighlighted(nodeFront, highlighted) { + return { + type: UPDATE_GRID_HIGHLIGHTED, + highlighted, + nodeFront, + }; + }, + + /** + * Updates the grid state with the new list of grids. + */ + updateGrids(grids) { + return { + type: UPDATE_GRIDS, + grids, + }; + }, +}; diff --git a/devtools/client/inspector/grids/actions/highlighter-settings.js b/devtools/client/inspector/grids/actions/highlighter-settings.js new file mode 100644 index 0000000000..82397a7944 --- /dev/null +++ b/devtools/client/inspector/grids/actions/highlighter-settings.js @@ -0,0 +1,52 @@ +/* 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 { + UPDATE_SHOW_GRID_AREAS, + UPDATE_SHOW_GRID_LINE_NUMBERS, + UPDATE_SHOW_INFINITE_LINES, +} = require("resource://devtools/client/inspector/grids/actions/index.js"); + +module.exports = { + /** + * Updates the grid highlighter's show grid areas preference. + * + * @param {Boolean} enabled + * Whether or not the grid highlighter should show the grid areas. + */ + updateShowGridAreas(enabled) { + return { + type: UPDATE_SHOW_GRID_AREAS, + enabled, + }; + }, + + /** + * Updates the grid highlighter's show grid line numbers preference. + * + * @param {Boolean} enabled + * Whether or not the grid highlighter should show the grid line numbers. + */ + updateShowGridLineNumbers(enabled) { + return { + type: UPDATE_SHOW_GRID_LINE_NUMBERS, + enabled, + }; + }, + + /** + * Updates the grid highlighter's show infinite lines preference. + * + * @param {Boolean} enabled + * Whether or not the grid highlighter should extend grid lines infinitely. + */ + updateShowInfiniteLines(enabled) { + return { + type: UPDATE_SHOW_INFINITE_LINES, + enabled, + }; + }, +}; diff --git a/devtools/client/inspector/grids/actions/index.js b/devtools/client/inspector/grids/actions/index.js new file mode 100644 index 0000000000..1b0c18d0e7 --- /dev/null +++ b/devtools/client/inspector/grids/actions/index.js @@ -0,0 +1,30 @@ +/* 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( + [ + // Updates the color used for the overlay of a grid. + "UPDATE_GRID_COLOR", + + // Updates the grid highlighted state. + "UPDATE_GRID_HIGHLIGHTED", + + // Updates the entire grids state with the new list of grids. + "UPDATE_GRIDS", + + // Updates the grid highlighter's show grid areas state. + "UPDATE_SHOW_GRID_AREAS", + + // Updates the grid highlighter's show grid line numbers state. + "UPDATE_SHOW_GRID_LINE_NUMBERS", + + // Updates the grid highlighter's show infinite lines state. + "UPDATE_SHOW_INFINITE_LINES", + ], + module.exports +); diff --git a/devtools/client/inspector/grids/actions/moz.build b/devtools/client/inspector/grids/actions/moz.build new file mode 100644 index 0000000000..733ac57ede --- /dev/null +++ b/devtools/client/inspector/grids/actions/moz.build @@ -0,0 +1,12 @@ +# -*- 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( + "grid-highlighter.js", + "grids.js", + "highlighter-settings.js", + "index.js", +) |