|
@ -5,7 +5,7 @@ import { fromJS } from 'immutable'; |
|
|
import { throttle } from 'lodash'; |
|
|
import { throttle } from 'lodash'; |
|
|
import classNames from 'classnames'; |
|
|
import classNames from 'classnames'; |
|
|
import { isFullscreen, requestFullscreen, exitFullscreen } from '../ui/util/fullscreen'; |
|
|
import { isFullscreen, requestFullscreen, exitFullscreen } from '../ui/util/fullscreen'; |
|
|
import { displaySensitiveMedia } from '../../initial_state'; |
|
|
|
|
|
|
|
|
import { displayMedia } from '../../initial_state'; |
|
|
|
|
|
|
|
|
const messages = defineMessages({ |
|
|
const messages = defineMessages({ |
|
|
play: { id: 'video.play', defaultMessage: 'Play' }, |
|
|
play: { id: 'video.play', defaultMessage: 'Play' }, |
|
@ -111,7 +111,7 @@ class Video extends React.PureComponent { |
|
|
fullscreen: false, |
|
|
fullscreen: false, |
|
|
hovered: false, |
|
|
hovered: false, |
|
|
muted: false, |
|
|
muted: false, |
|
|
revealed: !this.props.sensitive || displaySensitiveMedia, |
|
|
|
|
|
|
|
|
revealed: displayMedia !== 'hide_all' && !this.props.sensitive || displayMedia === 'show_all', |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
setPlayerRef = c => { |
|
|
setPlayerRef = c => { |
|
@ -272,7 +272,7 @@ class Video extends React.PureComponent { |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
render () { |
|
|
render () { |
|
|
const { preview, src, inline, startTime, onOpenVideo, onCloseVideo, intl, alt, detailed } = this.props; |
|
|
|
|
|
|
|
|
const { preview, src, inline, startTime, onOpenVideo, onCloseVideo, intl, alt, detailed, sensitive } = this.props; |
|
|
const { containerWidth, currentTime, duration, buffer, dragging, paused, fullscreen, hovered, muted, revealed } = this.state; |
|
|
const { containerWidth, currentTime, duration, buffer, dragging, paused, fullscreen, hovered, muted, revealed } = this.state; |
|
|
const progress = (currentTime / duration) * 100; |
|
|
const progress = (currentTime / duration) * 100; |
|
|
const playerStyle = {}; |
|
|
const playerStyle = {}; |
|
@ -296,6 +296,13 @@ class Video extends React.PureComponent { |
|
|
preload = 'none'; |
|
|
preload = 'none'; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
let warning; |
|
|
|
|
|
if (sensitive) { |
|
|
|
|
|
warning = <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />; |
|
|
|
|
|
} else { |
|
|
|
|
|
warning = <FormattedMessage id='status.media_hidden' defaultMessage='Media hidden' />; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<div |
|
|
<div |
|
|
role='menuitem' |
|
|
role='menuitem' |
|
@ -328,7 +335,7 @@ class Video extends React.PureComponent { |
|
|
/> |
|
|
/> |
|
|
|
|
|
|
|
|
<button type='button' className={classNames('video-player__spoiler', { active: !revealed })} onClick={this.toggleReveal}> |
|
|
<button type='button' className={classNames('video-player__spoiler', { active: !revealed })} onClick={this.toggleReveal}> |
|
|
<span className='video-player__spoiler__title'><FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' /></span> |
|
|
|
|
|
|
|
|
<span className='video-player__spoiler__title'>{warning}</span> |
|
|
<span className='video-player__spoiler__subtitle'><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span> |
|
|
<span className='video-player__spoiler__subtitle'><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span> |
|
|
</button> |
|
|
</button> |
|
|
|
|
|
|
|
|