tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

flexbox.js (2814B)

      1 /* This Source Code Form is subject to the terms of the Mozilla Public
      2 * License, v. 2.0. If a copy of the MPL was not distributed with this
      3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
      4 
      5 "use strict";
      6 
      7 const {
      8  CLEAR_FLEXBOX,
      9  UPDATE_FLEXBOX,
     10  UPDATE_FLEXBOX_COLOR,
     11  UPDATE_FLEXBOX_HIGHLIGHTED,
     12 } = require("resource://devtools/client/inspector/flexbox/actions/index.js");
     13 
     14 const INITIAL_FLEXBOX = {
     15  // The color of the flexbox highlighter overlay.
     16  color: "",
     17  // The flex container of the selected element.
     18  flexContainer: {
     19    // The actor ID of the selected flex container.
     20    actorID: "",
     21    // An array of flex items belonging to the selected flex container.
     22    flexItems: [],
     23    // The NodeFront actor ID of the flex item to display in the flex item sizing
     24    // properties.
     25    flexItemShown: null,
     26    // This flag specifies that the flex container data represents the selected flex
     27    // container.
     28    isFlexItemContainer: false,
     29    // The NodeFront of the selected flex container.
     30    nodeFront: null,
     31    // The computed style properties of the selected flex container.
     32    properties: null,
     33  },
     34  // The selected flex container can also be a flex item. This object contains the
     35  // parent flex container properties of the selected element.
     36  flexItemContainer: {
     37    // The actor ID of the parent flex container.
     38    actorID: "",
     39    // An array of flex items belonging to the parent flex container.
     40    flexItems: [],
     41    // The NodeFront actor ID of the flex item to display in the flex item sizing
     42    // properties.
     43    flexItemShown: null,
     44    // This flag specifies that the flex container data represents the parent flex
     45    // container of the selected element.
     46    isFlexItemContainer: true,
     47    // The NodeFront of the parent flex container.
     48    nodeFront: null,
     49    // The computed styles properties of the parent flex container.
     50    properties: null,
     51  },
     52  // Whether or not the flexbox highlighter is highlighting the flex container.
     53  highlighted: false,
     54  // Whether or not the node selection that led to the flexbox tool being shown came from
     55  // the user selecting a node in the markup-view (whereas, say, selecting in the flex
     56  // items list)
     57  initiatedByMarkupViewSelection: false,
     58 };
     59 
     60 const reducers = {
     61  [CLEAR_FLEXBOX](_) {
     62    return INITIAL_FLEXBOX;
     63  },
     64 
     65  [UPDATE_FLEXBOX](_, { flexbox }) {
     66    return flexbox;
     67  },
     68 
     69  [UPDATE_FLEXBOX_COLOR](flexbox, { color }) {
     70    return {
     71      ...flexbox,
     72      color,
     73    };
     74  },
     75 
     76  [UPDATE_FLEXBOX_HIGHLIGHTED](flexbox, { highlighted }) {
     77    return {
     78      ...flexbox,
     79      highlighted,
     80    };
     81  },
     82 };
     83 
     84 module.exports = function (flexbox = INITIAL_FLEXBOX, action) {
     85  const reducer = reducers[action.type];
     86  if (!reducer) {
     87    return flexbox;
     88  }
     89  return reducer(flexbox, action);
     90 };