From 7b031ee255679351249c8fb722645a030dc6e98a Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Thu, 9 Jan 2020 21:10:11 +0100
Subject: sliders

---
 app/client/modules/biggan/biggan.actions.js        | 13 ++++---
 app/client/modules/biggan/biggan.module.js         |  2 +-
 .../modules/biggan/views/biggan.encodingList.js    | 44 +++++++++++++++-------
 public/assets/css/css.css                          |  9 +++++
 4 files changed, 47 insertions(+), 21 deletions(-)

diff --git a/app/client/modules/biggan/biggan.actions.js b/app/client/modules/biggan/biggan.actions.js
index f09510c..10d36ff 100644
--- a/app/client/modules/biggan/biggan.actions.js
+++ b/app/client/modules/biggan/biggan.actions.js
@@ -181,6 +181,7 @@ export const load_results = (id) => (dispatch) => {
 
 export const load_encodings = () => dispatch => {
   const module = bigganModule.name
+  console.log(actions)
   util.allProgress([
     actions.folder.index({ module }),
     actions.file.index({
@@ -188,8 +189,10 @@ export const load_encodings = () => dispatch => {
       datatype: 'image',
       generated: 1,
     }),
-  ], (folders, files) => {
-    console.log(folders, files)
+  ], (percent, i, n) => {
+    // loading function
+  }).then(res => {
+    const [folders, files] = res
     const folder_name_lookup = {}
     const encodings = {}
     folders.forEach(folder => {
@@ -197,19 +200,17 @@ export const load_encodings = () => dispatch => {
       encodings[folder.name] = []
     })
     files.forEach(file => {
-      folder_name = folder_name_lookup[file.folder_id]
+      const folder_name = folder_name_lookup[file.folder_id]
       encodings[folder_name].push(file)
     })
     folders.forEach(folder => {
       if (!encodings[folder.name].length) {
-        delete encodings[folder_name]
+        delete encodings[folder.name]
       }
     })
     dispatch({
       type: types.biggan.load_encodings,
       encodings
     })
-
   })
 }
-
diff --git a/app/client/modules/biggan/biggan.module.js b/app/client/modules/biggan/biggan.module.js
index 6407f61..e86d312 100644
--- a/app/client/modules/biggan/biggan.module.js
+++ b/app/client/modules/biggan/biggan.module.js
@@ -1,7 +1,7 @@
 const bigganModule = {
   name: 'biggan',
   displayName: 'BigGAN',
-  datatype: 'video',
+  datatype: 'image',
 }
 
 export default bigganModule
diff --git a/app/client/modules/biggan/views/biggan.encodingList.js b/app/client/modules/biggan/views/biggan.encodingList.js
index d041e2e..76c306c 100644
--- a/app/client/modules/biggan/views/biggan.encodingList.js
+++ b/app/client/modules/biggan/views/biggan.encodingList.js
@@ -3,38 +3,54 @@ import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
 
 import {
-  Loading
+  Loading, Group, Slider
 } from '../../../common/'
 
 import actions from '../../../actions'
 import * as bigganTasks from '../biggan.tasks'
 import * as bigganActions from '../biggan.actions'
 
-const ALL_CATEGORIES = 'inversion/categories/biggan_all.json'
-
 class BigGANEncodingList extends Component {
-  constructor() {
-    super()
-    if (!this.props.encodings) {
-      this.actions.biggan.load_encodings()
+  componentDidMount() {
+    if (!this.props.biggan.encodings) {
+      this.props.actions.biggan.load_encodings()
     }
   }
 
   render() {
-    const { encodings } = this.props
+    const { encodings } = this.props.biggan
     if (!encodings) {
       return <div>Loading encodings...</div>
     }
     return (
       <div>
-        <div>
-          <select>
-          </select>
-        </div>
-        <div className="categories" ref={ref => this.categoryRef = ref}>
+        <Group title={"Stored image"}>
+          <Slider live
+            name='encoding_mix_speed'
+            title={"Load Speed"}
+            min={0.0001} max={10} type='float'
+          />
+          <Slider live
+            name='encoding_stored_speed'
+            title={"Next Image Speed"}
+            min={0.0001} max={10} type='float'
+          />
+          <Slider live
+            name='encoding_mix_n'
+            title={"Blend mix"}
+            min={0} max={1} type='float'
+          />
+          <Slider live
+            name='encoding_mix_n'
+            title={"Encoding mix"}
+            min={0} max={1} type='float'
+          />
+        </Group>
+        <div className="categories encodings" ref={ref => this.categoryRef = ref}>
           {Object.keys(encodings).sort().map(name => {
             return (
               <div key={name}>
+                <h3>{name}</h3>
                 {encodings[name].map(file => (
                   <img
                     key={file.id}
@@ -65,4 +81,4 @@ const mapDispatchToProps = (dispatch, ownProps) => ({
   }
 })
 
-export default connect(mapStateToProps, mapDispatchToProps)(BigGANCategoryList)
+export default connect(mapStateToProps, mapDispatchToProps)(BigGANEncodingList)
diff --git a/public/assets/css/css.css b/public/assets/css/css.css
index 4e53637..c36c4d5 100644
--- a/public/assets/css/css.css
+++ b/public/assets/css/css.css
@@ -673,6 +673,7 @@ input.small {
 .biggan .categories h3 {
   margin-top: 3px;
   margin-bottom: 3px;
+  text-transform: capitalize;
 }
 .biggan .categories a {
   cursor: pointer;
@@ -690,6 +691,14 @@ input.small {
   margin-top: -4px;
   width: 260px;
 }
+.biggan .encodings img {
+  cursor: pointer;
+  width: 33%;
+  opacity: 0.9;
+}
+.desktop .biggan .encodings img:hover {
+  opacity: 1.0;
+}
 
 /* search form */
 .search_form {
-- 
cgit v1.2.3-70-g09d2