editor overview / gate

5 files changed, 100 insertions, 6 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 d37cd6d..c9b85d7 100644
--- a/animism-align/frontend/app/views/editor/align/align.reducer.js
+++ b/animism-align/frontend/app/views/editor/align/align.reducer.js
@@ -13,6 +13,7 @@ const initialState = {
   },
   peaks: { loading: true },
   text: { loading: true },
+  currentEpisodeId: -1,
   annotation: {},
   selectedAnnotation: {},
   options: {
@@ -22,6 +23,13 @@ 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 563f50d..599225a 100644
--- a/animism-align/frontend/app/views/editor/editor.container.js
+++ b/animism-align/frontend/app/views/editor/editor.container.js
@@ -5,17 +5,19 @@ import EditorGate from 'app/views/editor/editor.gate'
 import AlignContainer from 'app/views/editor/align/align.container'
 import ParagraphContainer from 'app/views/editor/paragraph/paragraph.container'
 import MediaContainer from 'app/views/editor/media/media.container'
+import OverviewContainer from 'app/views/editor/overview/overview.container'
 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} />
         <Route path={"/editor/:episode_id/transcript/"} component={ParagraphContainer} />
         <Route path={"/editor/:episode_id/media/"} component={MediaContainer} />
         <Route path={"/editor/:episode_id/viewer/"} component={ViewerContainer} />
-        <Route path={"/editor/:episode_id/"} exact component={MediaContainer} />
+        <Route path={"/editor/:episode_id/"} exact component={OverviewContainer} />
       </EditorGate>
     )
   }
diff --git a/animism-align/frontend/app/views/editor/editor.gate.js b/animism-align/frontend/app/views/editor/editor.gate.js
index 968680f..b835a69 100644
--- a/animism-align/frontend/app/views/editor/editor.gate.js
+++ b/animism-align/frontend/app/views/editor/editor.gate.js
@@ -1,32 +1,49 @@
 import React, { Component } from 'react'
+import { connect } from 'react-redux'
 
 import { Loader } from 'app/common'
 
 import actions from 'app/actions'
 
-export default class EditorGate extends Component {
+class EditorGate extends Component {
   constructor(props) {
     super(props)
     this.load()
   }
 
+  componentDidMount() {
+    this.load()
+  }
+
   componentDidUpdate(prevProps) {
-    if (this.props.episode_id !== prevProps.episode_id) {
+    if (
+      this.props.episode_id !== prevProps.episode_id ||
+      this.props.episode.lookup !== prevProps.episode.lookup
+    ) {
       this.load()
     }
   }
 
   load() {
-    this.props.episode_id && actions.site.loadEpisode()
+    if (!this.props.episode.lookup) return
+    if (!this.props.episode_id) return
+    const episode = this.props.episode.lookup[this.props.episode_id]
+    actions.site.loadEpisode(episode)
   }
 
   render() {
-    if (this.props.logged_in) {
+    if (parseInt(this.props.episode_id) === parseInt(this.props.currentEpisodeId)) {
       return this.props.children
     }
     return (
-      <Loader />
+      <div className="dashboard"><Loader /></div>
     )
   }
 }
 
+const mapStateToProps = state => ({
+  episode: state.episode.index,
+  currentEpisodeId: state.align.currentEpisodeId,
+})
+
+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
new file mode 100644
index 0000000..8ce64b9
--- /dev/null
+++ b/animism-align/frontend/app/views/editor/overview/overview.container.js
@@ -0,0 +1,64 @@
+import React, { Component } from 'react'
+import { connect } from 'react-redux'
+import { Link } from 'react-router-dom'
+
+import './overview.css'
+
+// import actions from 'app/actions'
+import { Loader } from 'app/common'
+import { groupResponseBy } from 'app/utils/api.utils'
+
+class OverviewContainer extends Component {
+  state = {
+    ready: true,
+  }
+
+  constructor(props) {
+    super(props)
+  }
+
+  componentDidMount() {
+    this.build()
+  }
+  
+  componentDidUpdate(prevProps) {
+    if (!this.state.ready) {
+      this.build()
+    }
+  }
+
+  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) {
+      return (
+        <div className='dashboard'>
+          <Loader />
+        </div>
+      )
+    }
+    return (
+      <div className='dashboard overview'>
+        <div className='project-top'>
+          <div className='row project-heading'>
+            <div className='title'>
+              <h1>Episode</h1>
+            </div>
+          </div>
+        </div>
+      </div>
+    )
+  }
+}
+
+const mapStateToProps = state => ({
+})
+
+export default connect(mapStateToProps)(OverviewContainer)
diff --git a/animism-align/frontend/app/views/editor/overview/overview.css b/animism-align/frontend/app/views/editor/overview/overview.css
new file mode 100644
index 0000000..abd6c93
--- /dev/null
+++ b/animism-align/frontend/app/views/editor/overview/overview.css
@@ -0,0 +1,3 @@
+.overview {
+
+}
\ No newline at end of file