NoAnimationPanel.js (1814B)
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 Component, 9 } = require("resource://devtools/client/shared/vendor/react.mjs"); 10 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js"); 11 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs"); 12 const { 13 connect, 14 } = require("resource://devtools/client/shared/vendor/react-redux.js"); 15 const { LocalizationHelper } = require("resource://devtools/shared/l10n.js"); 16 17 const L10N = new LocalizationHelper( 18 "devtools/client/locales/animationinspector.properties" 19 ); 20 21 class NoAnimationPanel extends Component { 22 static get propTypes() { 23 return { 24 elementPickerEnabled: PropTypes.bool.isRequired, 25 toggleElementPicker: PropTypes.func.isRequired, 26 }; 27 } 28 29 shouldComponentUpdate(nextProps) { 30 return this.props.elementPickerEnabled != nextProps.elementPickerEnabled; 31 } 32 33 render() { 34 const { elementPickerEnabled, toggleElementPicker } = this.props; 35 36 return dom.div( 37 { 38 className: "animation-error-message devtools-sidepanel-no-result", 39 }, 40 dom.p(null, L10N.getStr("panel.noAnimation")), 41 dom.button({ 42 className: 43 "animation-element-picker devtools-button devtools-button-standalone" + 44 (elementPickerEnabled ? " checked" : ""), 45 onClick: event => { 46 event.stopPropagation(); 47 toggleElementPicker(); 48 }, 49 }) 50 ); 51 } 52 } 53 54 const mapStateToProps = state => { 55 return { 56 elementPickerEnabled: state.animations.elementPickerEnabled, 57 }; 58 }; 59 60 module.exports = connect(mapStateToProps)(NoAnimationPanel);