From f8c2db40de5967f19dcc6af8171c4e40cf0cbd1b Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 9 Sep 2020 15:25:55 +0200 Subject: intro caption, keeping nav darkened until playback starts --- animism-align/frontend/app/views/audio/audio.reducer.js | 2 ++ animism-align/frontend/app/views/viewer/nav/nav.parent.js | 5 +++-- .../app/views/viewer/player/components.inline/inline.utility.js | 3 +-- 3 files changed, 6 insertions(+), 4 deletions(-) (limited to 'animism-align/frontend') diff --git a/animism-align/frontend/app/views/audio/audio.reducer.js b/animism-align/frontend/app/views/audio/audio.reducer.js index 35a364d..c88d6f9 100644 --- a/animism-align/frontend/app/views/audio/audio.reducer.js +++ b/animism-align/frontend/app/views/audio/audio.reducer.js @@ -2,6 +2,7 @@ import * as types from 'app/types' import { session, getDefault, getDefaultInt } from 'app/session' const initialState = { + started: false, playing: false, play_ts: 0, volume: 1.0, @@ -13,6 +14,7 @@ export default function alignReducer(state = initialState, action) { case types.audio.play: return { ...state, + started: true, playing: true, } case types.audio.pause: diff --git a/animism-align/frontend/app/views/viewer/nav/nav.parent.js b/animism-align/frontend/app/views/viewer/nav/nav.parent.js index ca1c148..5ddc13d 100644 --- a/animism-align/frontend/app/views/viewer/nav/nav.parent.js +++ b/animism-align/frontend/app/views/viewer/nav/nav.parent.js @@ -38,10 +38,10 @@ class NavParent extends Component { }, 50) } render() { - const { viewer, play_ts } = this.props + const { viewer, play_ts, started } = this.props let containerClassName = "viewer-nav " + viewer.navStyle let navClassName = 'nav-row main-nav' - if (this.state.hoveringNav) containerClassName += ' hovering-nav' + if (this.state.hoveringNav || !started) containerClassName += ' hovering-nav' if ((this.state.hoveringNext || viewer.atEndOfSection) && !viewer.nav) containerClassName += ' hovering-next' return (
@@ -94,6 +94,7 @@ class NavParent extends Component { const mapStateToProps = state => ({ viewer: state.viewer, + started: state.audio.started, play_ts: state.audio.play_ts, }) diff --git a/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js b/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js index 4f0ce71..2d2e3cb 100644 --- a/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js +++ b/animism-align/frontend/app/views/viewer/player/components.inline/inline.utility.js @@ -2,8 +2,7 @@ import React, { Component } from 'react' import { MediaCitation } from '../components.media' -export const Intro = ({ paragraph, media, currentParagraph, currentAnnotation, onAnnotationClick }) => { - let className = 'site-intro' +export const Intro = ({ paragraph, media, onAnnotationClick }) => { const annotation = paragraph.annotations[0] const item = media.lookup[annotation.settings.media_id] // console.log(item) -- cgit v1.2.3-70-g09d2