devtools/client/fronts/layout.js

   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   safeAsyncMethod,
   9 } = require("resource://devtools/shared/async-utils.js");
  10 const {
  11   FrontClassWithSpec,
  12   registerFront,
  13 } = require("resource://devtools/shared/protocol.js");
  14 const {
  15   flexboxSpec,
  16   flexItemSpec,
  17   gridSpec,
  18   layoutSpec,
  19 } = require("resource://devtools/shared/specs/layout.js");
  20
  21 class FlexboxFront extends FrontClassWithSpec(flexboxSpec) {
  22   form(form) {
  23     this._form = form;
  24   }
  25
  26   /**
  27    * In some cases, the FlexboxActor already knows the NodeActor ID of the node where the
  28    * flexbox is located. In such cases, this getter returns the NodeFront for it.
  29    */
  30   get containerNodeFront() {
  31     if (!this._form.containerNodeActorID) {
  32       return null;
  33     }
  34
  35     return this.conn.getFrontByID(this._form.containerNodeActorID);
  36   }
  37
  38   /**
  39    * Get the WalkerFront instance that owns this FlexboxFront.
  40    */
  41   get walkerFront() {
  42     return this.parentFront.walkerFront;
  43   }
  44
  45   /**
  46    * Get the computed style properties for the flex container.
  47    */
  48   get properties() {
  49     return this._form.properties;
  50   }
  51 }
  52
  53 class FlexItemFront extends FrontClassWithSpec(flexItemSpec) {
  54   form(form) {
  55     this._form = form;
  56   }
  57
  58   /**
  59    * Get the flex item sizing data.
  60    */
  61   get flexItemSizing() {
  62     return this._form.flexItemSizing;
  63   }
  64
  65   /**
  66    * In some cases, the FlexItemActor already knows the NodeActor ID of the node where the
  67    * flex item is located. In such cases, this getter returns the NodeFront for it.
  68    */
  69   get nodeFront() {
  70     if (!this._form.nodeActorID) {
  71       return null;
  72     }
  73
  74     return this.conn.getFrontByID(this._form.nodeActorID);
  75   }
  76
  77   /**
  78    * Get the WalkerFront instance that owns this FlexItemFront.
  79    */
  80   get walkerFront() {
  81     return this.parentFront.walkerFront;
  82   }
  83
  84   /**
  85    * Get the computed style properties for the flex item.
  86    */
  87   get computedStyle() {
  88     return this._form.computedStyle;
  89   }
  90
  91   /**
  92    * Get the style properties for the flex item.
  93    */
  94   get properties() {
  95     return this._form.properties;
  96   }
  97 }
  98
  99 class GridFront extends FrontClassWithSpec(gridSpec) {
 100   form(form) {
 101     this._form = form;
 102   }
 103
 104   /**
 105    * In some cases, the GridActor already knows the NodeActor ID of the node where the
 106    * grid is located. In such cases, this getter returns the NodeFront for it.
 107    */
 108   get containerNodeFront() {
 109     if (!this._form.containerNodeActorID) {
 110       return null;
 111     }
 112
 113     return this.conn.getFrontByID(this._form.containerNodeActorID);
 114   }
 115
 116   /**
 117    * Get the WalkerFront instance that owns this GridFront.
 118    */
 119   get walkerFront() {
 120     return this.parentFront.walkerFront;
 121   }
 122
 123   /**
 124    * Get the text direction of the grid container.
 125    */
 126   get direction() {
 127     return this._form.direction;
 128   }
 129
 130   /**
 131    * Getter for the grid fragments data.
 132    */
 133   get gridFragments() {
 134     return this._form.gridFragments;
 135   }
 136
 137   /**
 138    * Get whether or not the grid is a subgrid.
 139    */
 140   get isSubgrid() {
 141     return !!this._form.isSubgrid;
 142   }
 143
 144   /**
 145    * Get the writing mode of the grid container.
 146    */
 147   get writingMode() {
 148     return this._form.writingMode;
 149   }
 150 }
 151
 152 class LayoutFront extends FrontClassWithSpec(layoutSpec) {
 153   constructor(client, targetFront, parentFront) {
 154     super(client, targetFront, parentFront);
 155
 156     this.getAllGrids = safeAsyncMethod(
 157       this.getAllGrids.bind(this),
 158       () => this.isDestroyed(),
 159       []
 160     );
 161   }
 162   /**
 163    * Get the WalkerFront instance that owns this LayoutFront.
 164    */
 165   get walkerFront() {
 166     return this.parentFront;
 167   }
 168
 169   getAllGrids() {
 170     if (!this.walkerFront.rootNode) {
 171       return [];
 172     }
 173     return this.getGrids(this.walkerFront.rootNode);
 174   }
 175 }
 176
 177 exports.FlexboxFront = FlexboxFront;
 178 registerFront(FlexboxFront);
 179 exports.FlexItemFront = FlexItemFront;
 180 registerFront(FlexItemFront);
 181 exports.GridFront = GridFront;
 182 registerFront(GridFront);
 183 exports.LayoutFront = LayoutFront;
 184 registerFront(LayoutFront);