Bug 1308260 - Part 5: Add a highlighted state to the grid state and a method to update it. r=jryans
authorGabriel Luong <gabriel.luong@gmail.com>
Tue, 29 Nov 2016 17:37:57 +0800
changeset 324647 c54418718a5a6f41f60992a896e301cf1664270d
parent 324646 fd4aacce0b0083b14ba143890b85e6629b4a8aa1
child 324648 7c7b942f915b4ba43119f17d735c75c6b7376e32
push id24
push usermaklebus@msu.edu
push dateTue, 20 Dec 2016 03:11:33 +0000
reviewersjryans
bugs1308260
milestone53.0a1
Bug 1308260 - Part 5: Add a highlighted state to the grid state and a method to update it. r=jryans
devtools/client/inspector/layout/actions/grids.js
devtools/client/inspector/layout/actions/index.js
devtools/client/inspector/layout/reducers/grids.js
devtools/client/inspector/layout/types.js
--- a/devtools/client/inspector/layout/actions/grids.js
+++ b/devtools/client/inspector/layout/actions/grids.js
@@ -1,19 +1,38 @@
 /* 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_GRIDS } = require("./index");
+const {
+  UPDATE_GRID_HIGHLIGHTED,
+  UPDATE_GRIDS,
+} = require("./index");
 
 module.exports = {
 
   /**
+   * Update 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,
+      nodeFront,
+      highlighted,
+    };
+  },
+
+  /**
    * Update the grid state with the new list of grids.
    */
   updateGrids(grids) {
     return {
       type: UPDATE_GRIDS,
       grids,
     };
   },
--- a/devtools/client/inspector/layout/actions/index.js
+++ b/devtools/client/inspector/layout/actions/index.js
@@ -3,12 +3,15 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
 const { createEnum } = require("devtools/client/shared/enum");
 
 createEnum([
 
+  // Update the grid highlighted state.
+  "UPDATE_GRID_HIGHLIGHTED",
+
   // Update the entire grids state with the new list of grids.
   "UPDATE_GRIDS",
 
 ], module.exports);
--- a/devtools/client/inspector/layout/reducers/grids.js
+++ b/devtools/client/inspector/layout/reducers/grids.js
@@ -1,22 +1,37 @@
 /* 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_HIGHLIGHTED,
   UPDATE_GRIDS,
 } = require("../actions/index");
 
 const INITIAL_GRIDS = [];
 
 let reducers = {
 
+  [UPDATE_GRID_HIGHLIGHTED](grids, { nodeFront, highlighted }) {
+    let newGrids = grids.map(g => {
+      if (g.nodeFront == nodeFront) {
+        g.highlighted = highlighted;
+      } else {
+        g.highlighted = false;
+      }
+
+      return g;
+    });
+
+    return newGrids;
+  },
+
   [UPDATE_GRIDS](_, { grids }) {
     return grids;
   },
 
 };
 
 module.exports = function (grids = INITIAL_GRIDS, action) {
   let reducer = reducers[action.type];
--- a/devtools/client/inspector/layout/types.js
+++ b/devtools/client/inspector/layout/types.js
@@ -9,15 +9,18 @@ const { PropTypes } = require("devtools/
 /**
  * A single grid container in the document.
  */
 exports.grid = {
 
   // The id of the grid
   id: PropTypes.number,
 
+  // The grid fragment object of the grid container
+  gridFragments: PropTypes.object,
+
+  // Whether or not the grid highlighter is highlighting the grid
+  highlighted: PropTypes.bool,
+
   // The node front of the grid container
   nodeFront: PropTypes.object,
 
-  // The grid fragment object of the grid container
-  gridFragments: PropTypes.object
-
 };