diff options
Diffstat (limited to 'animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.video.js')
| -rw-r--r-- | animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.video.js | 14 |
1 files changed, 11 insertions, 3 deletions
diff --git a/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.video.js b/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.video.js index 2fdcba7..213f17c 100644 --- a/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.video.js +++ b/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.video.js @@ -20,6 +20,8 @@ class FullscreenVideo extends Component { seek: 0.0, // whether or not the scrubber is scrubbing scrubbing: false, + // whether or not the video is ready and displaying an image + ready: false, } constructor(props) { super(props) @@ -46,7 +48,7 @@ class FullscreenVideo extends Component { } } handlePlay() { - + this.setState({ ready: true }) } handlePause() { @@ -62,7 +64,7 @@ class FullscreenVideo extends Component { render() { const { element, media, transitionDuration, playing } = this.props - const { duration, seconds } = this.state + const { duration, seconds, ready } = this.state const { color } = element const item = media.lookup[element.settings.media_id] const style = { @@ -70,13 +72,19 @@ class FullscreenVideo extends Component { color: color.textColor, transitionDuration, } + const playerStyle = { + opacity: ready ? 1.0 : 0.0 + } // return ( <div className='fullscreen-element video' style={style} > - <div className='vimeoPlayer'> + <div + className='videoPlayer' + style={playerStyle} + > <VimeoPlayer video={item.url} paused={!playing} |
