diff options
Diffstat (limited to 'animism-align/frontend/app/views/editor')
5 files changed, 45 insertions, 26 deletions
diff --git a/animism-align/frontend/app/views/editor/align/align.reducer.js b/animism-align/frontend/app/views/editor/align/align.reducer.js index c9b85d7..d37cd6d 100644 --- a/animism-align/frontend/app/views/editor/align/align.reducer.js +++ b/animism-align/frontend/app/views/editor/align/align.reducer.js @@ -13,7 +13,6 @@ const initialState = { }, peaks: { loading: true }, text: { loading: true }, - currentEpisodeId: -1, annotation: {}, selectedAnnotation: {}, options: { @@ -23,13 +22,6 @@ const initialState = { export default function alignReducer(state = initialState, action) { // console.log(action.type, action) switch (action.type) { - - case types.editor.loaded: - return { - ...state, - currentEpisodeId: action.episode_id, - } - case types.peaks.loaded: // console.log('peaks duration:', action.data.length / 10) return { diff --git a/animism-align/frontend/app/views/editor/editor.container.js b/animism-align/frontend/app/views/editor/editor.container.js index 599225a..2d4b036 100644 --- a/animism-align/frontend/app/views/editor/editor.container.js +++ b/animism-align/frontend/app/views/editor/editor.container.js @@ -10,7 +10,6 @@ import ViewerContainer from 'app/views/viewer/viewer.container' export default class Router extends Component { render() { - console.log(this.props.match.params) return ( <EditorGate episode_id={this.props.match.params.episode_id}> <Route path={"/editor/:episode_id/timeline/"} component={AlignContainer} /> diff --git a/animism-align/frontend/app/views/editor/editor.gate.js b/animism-align/frontend/app/views/editor/editor.gate.js index b835a69..5076350 100644 --- a/animism-align/frontend/app/views/editor/editor.gate.js +++ b/animism-align/frontend/app/views/editor/editor.gate.js @@ -18,32 +18,37 @@ class EditorGate extends Component { componentDidUpdate(prevProps) { if ( this.props.episode_id !== prevProps.episode_id || - this.props.episode.lookup !== prevProps.episode.lookup + this.props.episode.lookup !== prevProps.episode.lookup || + this.props.project.lookup !== prevProps.project.lookup ) { this.load() } } load() { + if (!this.props.project.lookup) return if (!this.props.episode.lookup) return if (!this.props.episode_id) return + if (parseInt(this.props.episode_id) === parseInt(this.props.current_episode_id)) return const episode = this.props.episode.lookup[this.props.episode_id] - actions.site.loadEpisode(episode) + const project = this.props.project.lookup[episode.project_id] + actions.site.loadEpisode(project, episode) } render() { - if (parseInt(this.props.episode_id) === parseInt(this.props.currentEpisodeId)) { + if (parseInt(this.props.episode_id) === parseInt(this.props.current_episode_id)) { return this.props.children } return ( - <div className="dashboard"><Loader /></div> + <div className="overview"><Loader /></div> ) } } const mapStateToProps = state => ({ episode: state.episode.index, - currentEpisodeId: state.align.currentEpisodeId, + project: state.project.index, + current_episode_id: state.site.episode.id, }) export default connect(mapStateToProps)(EditorGate)
\ No newline at end of file diff --git a/animism-align/frontend/app/views/editor/overview/overview.container.js b/animism-align/frontend/app/views/editor/overview/overview.container.js index 8ce64b9..b06a299 100644 --- a/animism-align/frontend/app/views/editor/overview/overview.container.js +++ b/animism-align/frontend/app/views/editor/overview/overview.container.js @@ -5,8 +5,9 @@ import { Link } from 'react-router-dom' import './overview.css' // import actions from 'app/actions' -import { Loader } from 'app/common' +import { Loader, TableObject } from 'app/common' import { groupResponseBy } from 'app/utils/api.utils' +import { courtesyS, formatDateTime } from 'app/utils' class OverviewContainer extends Component { state = { @@ -28,30 +29,39 @@ class OverviewContainer extends Component { } build() { - if (this.props.loading) return // const episodes = groupResponseBy(this.props.episodes, 'project_id') // const venues = groupResponseBy(this.props.venues, 'project_id') // this.setState({ ready: true, episodes, venues }) } render() { - const { loading, projects } = this.props - const { episodes, venues, ready } = this.state - if (loading || !ready) { + const { project, episode, media, annotation, align } = this.props + const { ready } = this.state + if (!ready) { return ( - <div className='dashboard'> + <div className='overview'> <Loader /> </div> ) } + // console.log(this.props) + console.log(annotation.order.length) return ( - <div className='dashboard overview'> + <div className='overview'> <div className='project-top'> - <div className='row project-heading'> - <div className='title'> - <h1>Episode</h1> - </div> + <div className='project-heading'> + <h1>{`${project.title}: Episode ${episode.episode_number}`}</h1> + <h2>{episode.title}</h2> </div> + <h3>Statistics</h3> + + <TableObject + className="overview" + order={"annotations".split(" ")} + object={{ + annotations: courtesyS(annotation.order.length, 'annotation'), + }} + /> </div> </div> ) @@ -59,6 +69,15 @@ class OverviewContainer extends Component { } const mapStateToProps = state => ({ + project: state.site.project, + episode: state.site.episode, + media: state.media.index, + annotation: state.annotation.index, + align: state.align, }) export default connect(mapStateToProps)(OverviewContainer) + +/* + last_updated: formatDateTime(dataset.last_updated), + */ diff --git a/animism-align/frontend/app/views/editor/overview/overview.css b/animism-align/frontend/app/views/editor/overview/overview.css index abd6c93..2c8b903 100644 --- a/animism-align/frontend/app/views/editor/overview/overview.css +++ b/animism-align/frontend/app/views/editor/overview/overview.css @@ -1,3 +1,7 @@ .overview { + padding: 1.5rem; +} -}
\ No newline at end of file +.overview h2 { + margin: 0.5rem 0 1rem 0; +} |