tor-browser

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

AnimationDetailContainer.js (2871B)


      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  connect,
      9 } = require("resource://devtools/client/shared/vendor/react-redux.js");
     10 const {
     11  createFactory,
     12  PureComponent,
     13 } = require("resource://devtools/client/shared/vendor/react.mjs");
     14 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
     15 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs");
     16 
     17 const AnimationDetailHeader = createFactory(
     18  require("resource://devtools/client/inspector/animation/components/AnimationDetailHeader.js")
     19 );
     20 const AnimatedPropertyListContainer = createFactory(
     21  require("resource://devtools/client/inspector/animation/components/AnimatedPropertyListContainer.js")
     22 );
     23 
     24 class AnimationDetailContainer extends PureComponent {
     25  static get propTypes() {
     26    return {
     27      addAnimationsCurrentTimeListener: PropTypes.func.isRequired,
     28      animation: PropTypes.object.isRequired,
     29      emitEventForTest: PropTypes.func.isRequired,
     30      getAnimatedPropertyMap: PropTypes.func.isRequired,
     31      getAnimationsCurrentTime: PropTypes.func.isRequired,
     32      getComputedStyle: PropTypes.func.isRequired,
     33      removeAnimationsCurrentTimeListener: PropTypes.func.isRequired,
     34      setDetailVisibility: PropTypes.func.isRequired,
     35      simulateAnimation: PropTypes.func.isRequired,
     36      simulateAnimationForKeyframesProgressBar: PropTypes.func.isRequired,
     37      timeScale: PropTypes.object.isRequired,
     38    };
     39  }
     40 
     41  render() {
     42    const {
     43      addAnimationsCurrentTimeListener,
     44      animation,
     45      emitEventForTest,
     46      getAnimatedPropertyMap,
     47      getAnimationsCurrentTime,
     48      getComputedStyle,
     49      removeAnimationsCurrentTimeListener,
     50      setDetailVisibility,
     51      simulateAnimation,
     52      simulateAnimationForKeyframesProgressBar,
     53      timeScale,
     54    } = this.props;
     55 
     56    return dom.div(
     57      {
     58        className: "animation-detail-container",
     59      },
     60      animation
     61        ? AnimationDetailHeader({
     62            animation,
     63            setDetailVisibility,
     64          })
     65        : null,
     66      animation
     67        ? AnimatedPropertyListContainer({
     68            addAnimationsCurrentTimeListener,
     69            animation,
     70            emitEventForTest,
     71            getAnimatedPropertyMap,
     72            getAnimationsCurrentTime,
     73            getComputedStyle,
     74            removeAnimationsCurrentTimeListener,
     75            simulateAnimation,
     76            simulateAnimationForKeyframesProgressBar,
     77            timeScale,
     78          })
     79        : null
     80    );
     81  }
     82 }
     83 
     84 const mapStateToProps = state => {
     85  return {
     86    animation: state.animations.selectedAnimation,
     87  };
     88 };
     89 
     90 module.exports = connect(mapStateToProps)(AnimationDetailContainer);