tor-browser

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

DiscretePath.js (1698B)

      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 dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
      8 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs");
      9 
     10 const ComputedStylePath = require("resource://devtools/client/inspector/animation/components/keyframes-graph/ComputedStylePath.js");
     11 
     12 class DiscretePath extends ComputedStylePath {
     13  static get propTypes() {
     14    return {
     15      name: PropTypes.string.isRequired,
     16    };
     17  }
     18 
     19  constructor(props) {
     20    super(props);
     21 
     22    this.state = this.propToState(props);
     23  }
     24 
     25  // FIXME: https://bugzilla.mozilla.org/show_bug.cgi?id=1774507
     26  UNSAFE_componentWillReceiveProps(nextProps) {
     27    this.setState(this.propToState(nextProps));
     28  }
     29 
     30  getPropertyName() {
     31    return this.props.name;
     32  }
     33 
     34  getPropertyValue(keyframe) {
     35    return keyframe.value;
     36  }
     37 
     38  propToState({ getComputedStyle, keyframes, name }) {
     39    const discreteValues = [];
     40 
     41    for (const keyframe of keyframes) {
     42      const style = getComputedStyle(name, { [name]: keyframe.value });
     43 
     44      if (!discreteValues.includes(style)) {
     45        discreteValues.push(style);
     46      }
     47    }
     48 
     49    return { discreteValues };
     50  }
     51 
     52  toSegmentValue(computedStyle) {
     53    const { discreteValues } = this.state;
     54    return discreteValues.indexOf(computedStyle) / (discreteValues.length - 1);
     55  }
     56 
     57  render() {
     58    return dom.g(
     59      {
     60        className: "discrete-path",
     61      },
     62      super.renderGraph()
     63    );
     64  }
     65 }
     66 
     67 module.exports = DiscretePath;