diff options
author | Starfall <us@starfall.systems> | 2023-04-14 19:22:47 -0500 |
---|---|---|
committer | Starfall <us@starfall.systems> | 2023-04-14 19:22:47 -0500 |
commit | 4fe1689de43f4404eb9530fcfbcbfb26d6c1c13a (patch) | |
tree | 6811b845bb7f4966b10dcefa3dea404246f161c7 /app/javascript/flavours/glitch/components/picture_in_picture_placeholder.js | |
parent | 65c1e53a32cabcdbb7bca57002bb0f6acdebe07e (diff) | |
parent | bed63f6dae0879ac840066b031229e0d139089cd (diff) |
Diffstat (limited to 'app/javascript/flavours/glitch/components/picture_in_picture_placeholder.js')
-rw-r--r-- | app/javascript/flavours/glitch/components/picture_in_picture_placeholder.js | 69 |
1 files changed, 0 insertions, 69 deletions
diff --git a/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.js b/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.js deleted file mode 100644 index 01dce0a38..000000000 --- a/app/javascript/flavours/glitch/components/picture_in_picture_placeholder.js +++ /dev/null @@ -1,69 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import Icon from 'flavours/glitch/components/icon'; -import { removePictureInPicture } from 'flavours/glitch/actions/picture_in_picture'; -import { connect } from 'react-redux'; -import { debounce } from 'lodash'; -import { FormattedMessage } from 'react-intl'; - -export default @connect() -class PictureInPicturePlaceholder extends React.PureComponent { - - static propTypes = { - width: PropTypes.number, - dispatch: PropTypes.func.isRequired, - }; - - state = { - width: this.props.width, - height: this.props.width && (this.props.width / (16/9)), - }; - - handleClick = () => { - const { dispatch } = this.props; - dispatch(removePictureInPicture()); - } - - setRef = c => { - this.node = c; - - if (this.node) { - this._setDimensions(); - } - } - - _setDimensions () { - const width = this.node.offsetWidth; - const height = width / (16/9); - - this.setState({ width, height }); - } - - componentDidMount () { - window.addEventListener('resize', this.handleResize, { passive: true }); - } - - componentWillUnmount () { - window.removeEventListener('resize', this.handleResize); - } - - handleResize = debounce(() => { - if (this.node) { - this._setDimensions(); - } - }, 250, { - trailing: true, - }); - - render () { - const { height } = this.state; - - return ( - <div ref={this.setRef} className='picture-in-picture-placeholder' style={{ height }} role='button' tabIndex='0' onClick={this.handleClick}> - <Icon id='window-restore' /> - <FormattedMessage id='picture_in_picture.restore' defaultMessage='Put it back' /> - </div> - ); - } - -} |