From b9e1806c97dba043af5b20c78ba2be9bbf47b4d8 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Tue, 26 Jun 2018 14:53:38 +0200
Subject: list morphs

---
 app/client/common/select.component.js       |  1 +
 app/client/dashboard/dashboard.actions.js   |  4 +++-
 app/client/dashboard/dashboard.component.js | 33 +++++++++++++++++------------
 app/client/modules/morph/views/morph.app.js |  6 ++++--
 4 files changed, 28 insertions(+), 16 deletions(-)

diff --git a/app/client/common/select.component.js b/app/client/common/select.component.js
index c7fa93c..0a48dce 100644
--- a/app/client/common/select.component.js
+++ b/app/client/common/select.component.js
@@ -50,6 +50,7 @@ class Select extends Component {
             onChange={this.handleChange}
             value={currentValue || lastValue}
           >
+            {this.props.placeholder && <option value=''>{this.props.placeholder}</option>}
             {options}
           </select>
         </label>
diff --git a/app/client/dashboard/dashboard.actions.js b/app/client/dashboard/dashboard.actions.js
index ae54f02..2757830 100644
--- a/app/client/dashboard/dashboard.actions.js
+++ b/app/client/dashboard/dashboard.actions.js
@@ -8,11 +8,12 @@ export const load = () => (dispatch) => {
     actions.folder.index({ activity: 'dataset', }),
     actions.file.index({ module: 'samplernn', generated: 1, limit: 15, orderBy: 'created_at desc', }),
     actions.file.index({ module: 'pix2pixhd', generated: 1, limit: 15, orderBy: 'created_at desc', }),
+    actions.file.index({ module: 'morph', generated: 1, limit: 15, orderBy: 'created_at desc', }),
   ], (percent, i, n) => {
     console.log('dashboard load progress', i, n)
     dispatch({ type: types.app.load_progress, progress: { i, n }})
   }).then(res => {
-    const [ tasks, folders, samplernn, pix2pixhd ] = res
+    const [ tasks, folders, samplernn, pix2pixhd, morph ] = res
     const { mapFn, sortFn } = util.sort.orderByFn('date desc')
     const foldersByModule = folders.map(mapFn).sort(sortFn).reduce((a,b) => {
       const module = b[1].module
@@ -28,6 +29,7 @@ export const load = () => (dispatch) => {
         renders: {
           samplernn,
           pix2pixhd,
+          morph,
         },
         foldersByModule,
       },
diff --git a/app/client/dashboard/dashboard.component.js b/app/client/dashboard/dashboard.component.js
index 58795ee..ac060de 100644
--- a/app/client/dashboard/dashboard.component.js
+++ b/app/client/dashboard/dashboard.component.js
@@ -33,15 +33,18 @@ class Dashboard extends Component {
     const { site, foldersByModule, renders, queue, images } = this.props
     const { tasks } = queue
     const folders = foldersByModule && Object.keys(modules).sort().map(key => {
-      if (! foldersByModule[key]) return null
-      const path = key === 'samplernn' ? '/samplernn/datasets/' : '/' + key + '/sequences/'
-      const folders = foldersByModule[key].map(folder => {
-        return (
-          <div key={folder.id}>
-            <Link to={path + folder.id + '/'}>{folder.name}</Link>
-          </div>
-        )
-      })
+      let path, folder_list
+      if (foldersByModule[key]) {
+        path = key === 'samplernn' ? '/samplernn/datasets/' : '/' + key + '/sequences/'
+        folder_list = foldersByModule[key].map(folder => {
+          return (
+            <div key={folder.id}>
+              <Link to={path + folder.id + '/'}>{folder.name}</Link>
+            </div>
+          )
+        })
+      }
+
       let files = renders[key] && (
         <FileList
           linkFiles
@@ -61,10 +64,14 @@ class Dashboard extends Component {
         <div className='dashboardModule' key={key}>
           <div className='row moduleHeading'>
             <h3>{key}</h3>
-            <div>
-              <Link to={'/' + key + '/new/'}>new</Link>
-            </div>
-            {folders}
+            {folder_list &&
+              <span>
+                <div>
+                  <Link to={'/' + key + '/new/'}>new</Link>
+                </div>
+                {folders}
+              </span>
+            }
           </div>
           {files}
         </div>
diff --git a/app/client/modules/morph/views/morph.app.js b/app/client/modules/morph/views/morph.app.js
index 5b43978..4a5b51b 100644
--- a/app/client/modules/morph/views/morph.app.js
+++ b/app/client/modules/morph/views/morph.app.js
@@ -53,7 +53,7 @@ class MorphResults extends Component {
 
     const totalLength = this.state.frames / 25
     let lengthWarning
-    if (this.state.steps > 64) {
+    if ((this.state.steps / this.state.dilate) > 64) {
       lengthWarning = (
         <span><br/>warning, this will take a while</span>
       )
@@ -69,6 +69,7 @@ class MorphResults extends Component {
             <Group title="From">
               <Select
                 title="Starting sequence"
+                placeholder="Please choose a sequence"
                 value={this.state.a}
                 options={sequence_options}
                 onChange={(name, key) => this.setState({ a: key, a_duration: sequenceLookup[key].count, a_pos: 0, a_offset: 0 })}
@@ -84,6 +85,7 @@ class MorphResults extends Component {
             <Group title="To">
               <Select
                 title="Ending sequence"
+                placeholder="Please choose a sequence"
                 value={this.state.b}
                 options={sequence_options}
                 onChange={(name, key) => this.setState({ b: key, b_duration: sequenceLookup[key].count, b_pos: 0, b_offset: 0 })}
@@ -107,7 +109,7 @@ class MorphResults extends Component {
                 type="list"
                 title="Steps"
                 value={this.state.steps}
-                options={[2,4,8,16,32,64,128,256]}
+                options={[2,4,8,16,32,64,128,256,512,1024,2048,4096]}
                 onChange={key => this.setState({ steps: key, frames: (key * this.state.dilate) })}
               />
               <Slider
-- 
cgit v1.2.3-70-g09d2