adding episodes to projects

2 files changed, 43 insertions, 11 deletions

diff --git a/animism-align/frontend/app/views/episode/components/episode.form.js b/animism-align/frontend/app/views/episode/components/episode.form.js
index 63d55e7..c60d3b2 100644
--- a/animism-align/frontend/app/views/episode/components/episode.form.js
+++ b/animism-align/frontend/app/views/episode/components/episode.form.js
@@ -20,6 +20,7 @@ const newEpisode = () => ({
 
 export default class EpisodeForm extends Component {
   state = {
+    project_id: 0,
     title: "",
     submitTitle: "",
     data: { ...newEpisode() },
@@ -37,8 +38,10 @@ export default class EpisodeForm extends Component {
   }
 
   componentDidMount() {
-    const { data, isNew } = this.props
-    const title = isNew ? 'New episode' : 'Editing ' + data.title
+    const { data, isNew, project } = this.props
+    const title = isNew
+      ? 'Add episode to project ' + project.title
+      : 'Editing Episode ' + data.episode_number + ": " + data.title
     const submitTitle = isNew ? "Add Episode" : "Save Changes"
     this.setState({
       title,
@@ -112,8 +115,8 @@ export default class EpisodeForm extends Component {
     }
     const { isNew, onSubmit } = this.props
     const { data } = this.state
-    const requiredKeys = "episode_number release_date".split(" ")
-    const validKeys = "title episode_number release_date is_live settings".split(" ")
+    const requiredKeys = "project_id episode_number release_date".split(" ")
+    const validKeys = "project_id title episode_number release_date is_live settings".split(" ")
     const validData = validKeys.reduce((a,b) => { a[b] = data[b]; return a }, {})
     if (!data.title) {
       data.title = "TBD"
@@ -141,10 +144,8 @@ export default class EpisodeForm extends Component {
       <div className='form'>
         <h1>{title}</h1>
         <form onSubmit={this.handleSubmit}>
-          <SubmitButton
-            title={submitTitle}
-            onClick={this.handleSubmit}
-          />
+          <h2>Episode information</h2>
+
           <TextInput
             title="Title"
             name="title"
@@ -176,6 +177,37 @@ export default class EpisodeForm extends Component {
             onChange={this.handleSelect}
           />
 
+          <h2>Build configuration</h2>
+
+          <TextInput
+            title="HTML title"
+            name="page_title"
+            placeholder="HTML title tag"
+            data={data.settings}
+            onChange={this.handleSettingsChangeEvent}
+            autoComplete="off"
+          />
+
+          <TextArea
+            title="Page description"
+            name="page_desc"
+            placeholder="Social media / search engine snippet"
+            data={data.settings}
+            onChange={this.handleSettingsChangeEvent}
+            autoComplete="off"
+          />
+
+          <TextInput
+            title="Build folder"
+            name="url_path"
+            placeholder="Folder to build into, e.g. episode1"
+            data={data.settings}
+            onChange={this.handleSettingsChangeEvent}
+            autoComplete="off"
+          />
+
+          <h2>Credits</h2>
+
           <TextArea
             title="Artists"
             name="artists"
diff --git a/animism-align/frontend/app/views/episode/components/episode.menu.js b/animism-align/frontend/app/views/episode/components/episode.menu.js
index 445084b..4b75ec1 100644
--- a/animism-align/frontend/app/views/episode/components/episode.menu.js
+++ b/animism-align/frontend/app/views/episode/components/episode.menu.js
@@ -28,7 +28,7 @@ const EpisodeIndexMenu = () => ([
 ])
 
 const EpisodeShowMenu = connect(mapStateToProps)((props) => ([
-  <MenuButton key='back' name="back" href="/episode/" />,
+  <MenuButton key='back' name="back" href="/" />,
   <MenuButton key='edit' name="edit" href={"/episode/" + props.match.params.id + "/edit/"} />,
   <MenuButton key='delete' name="delete" onClick={() => {
     const { res: episode } = props.episode.show
@@ -41,11 +41,11 @@ const EpisodeShowMenu = connect(mapStateToProps)((props) => ([
 ]))
 
 const EpisodeNewMenu = (props) => ([
-  <MenuButton key='back' name="back" href="/episode/" />,
+  <MenuButton key='back' name="back" href="/" />,
 ])
 
 const EpisodeEditMenu = connect(mapStateToProps)((props) => ([
-  <MenuButton key='back' name="back" href="/episode/" />,
+  <MenuButton key='back' name="back" href="/" />,
   <MenuButton key='delete' name="delete" onClick={() => {
     const { res: episode } = props.episode.show
     if (confirm("Really delete this episode?")) {