3 files changed, 305 insertions, 0 deletions
diff --git a/app/client/dataset/dataset.actions.js b/app/client/dataset/dataset.actions.js
new file mode 100644
index 0000000..f42e15c
--- /dev/null
+++ b/app/client/dataset/dataset.actions.js
@@ -0,0 +1,17 @@
+// import socket from '../socket'
+import types from '../types'
+
+export const uploadFiles = (files) => {
+  return { type: types.dataset.upload_files }
+}
+export const fetchURL = (url) => {
+  return { type: types.dataset.fetch_url }
+}
+
+// export const uploadFiles = (files) => {
+//   return dispatch => {
+//     // return { type: types.dataset.upload_files }
+//   }
+// }
+
+// export const fetchURL = (url) => { type: types.dataset.fetch_url }
diff --git a/app/client/dataset/dataset.component.js b/app/client/dataset/dataset.component.js
new file mode 100644
index 0000000..e6c1bfd
--- /dev/null
+++ b/app/client/dataset/dataset.component.js
@@ -0,0 +1,152 @@
+import { h, Component } from 'preact'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+
+import { actions, parser } from '../api'
+
+import Group from '../common/group.component'
+import Param from '../common/param.component'
+import FileList from '../common/fileList.component'
+import FileUpload from '../common/fileUpload.component'
+import TextInput from '../common/textInput.component'
+
+class Dataset extends Component {
+  constructor(props){
+    super()
+    this.handleName = this.handleName.bind(this)
+    this.handleUpload = this.handleUpload.bind(this)
+    this.handleURL = this.handleURL.bind(this)
+    this.pickFile = this.pickFile.bind(this)
+  }
+  handleName(name) {
+    const { module, folder } = this.props
+    if (! folder.id) {
+      this.props.actions.folder.create({
+        // username... should get added inside the API
+        module: module.name,
+        datatype: module.datatype,
+        activity: 'dataset',
+        name
+      })
+    } else {
+      this.props.actions.folder.update({
+        id: folder.id,
+        module: module.name,
+        datatype: module.datatype,
+        activity: 'dataset',
+        name
+      })
+    }
+  }
+  handleUpload(file) {
+    const { module, folder } = this.props
+    const fd = new FormData()
+    fd.append('file', file)
+    this.props.actions.folder.upload(fd, {
+      id: folder.id,
+      module: module.name,
+      activity: 'file',
+      epoch: 0,
+      processed: false,
+      generated: false,
+    })
+  }
+  handleURL(url) {
+    // name url
+    // mime datatype
+    // duration analysis
+    // size activity
+    // opt created_at updated_at
+    parser.parse(url, media => {
+      if (!media) return
+      console.log('media', media)
+      this.props.actions.file.create({
+        folder_id: this.props.folder.id,
+        module: this.props.module.name,
+        activity: 'url',
+        duration: parseInt(media.duration) || 0,
+        epoch: 0,
+        processed: false,
+        generated: false,
+        opt: media,
+        url
+      })
+    })
+  }
+  pickFile(file){
+    console.log('pick', file)
+    this.props.onPick && this.props.onPick(file)
+  }
+  render(){
+    const {
+      loading, status, error,
+      module, title, folder, files,
+      canRename, canUpload, canAddURL, canDeleteFile,
+      linkFiles,
+      fileOptions, pickFile
+    } = this.props
+    // sort files??
+    return (
+      <div className='dataset'>
+        <div className='params row'>
+          <div className='column'>
+            <Group title={title || 'Dataset'}>
+              {canRename
+              ? this.renderFolderNameInput(folder.name)
+              : <Param title='Dataset name'>{folder.name}</Param>}
+              {folder.id && canUpload && this.renderUploadInput()}
+              {folder.id && canAddURL && this.renderURLInput()}
+            </Group>
+          </div>
+        </div>
+        <div className='params col'>
+          <div class='row heading'>
+            {files.length ? 
+              <h3>Files</h3> :
+              <h4>No files</h4>}
+            <div>{(loading || error) && status}</div>
+          </div>
+          <FileList
+            files={files}
+            options={fileOptions}
+            onClick={pickFile}
+            canDelete={canDeleteFile}
+            linkFiles={linkFiles}
+          />
+        </div>
+      </div>
+    )
+  }
+  renderFolderNameInput(name){
+    return <TextInput
+      title='Dataset name'
+      value={name}
+      onSave={this.handleName}
+    />
+  }
+  renderUploadInput(){
+    return <FileUpload
+      title='Upload a file'
+      mime='image.*'
+      onUpload={this.handleUpload}
+    />
+  }
+  renderURLInput(){
+    return <TextInput
+      title='Fetch a URL'
+      placeholder='http://'
+      onSave={this.handleURL}
+    />
+  }
+}
+
+const mapStateToProps = state => state.dataset
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  actions: {
+    folder: bindActionCreators(actions.folder, dispatch),
+    file: bindActionCreators(actions.file, dispatch),
+  }
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(Dataset)
diff --git a/app/client/dataset/dataset.reducer.js b/app/client/dataset/dataset.reducer.js
new file mode 100644
index 0000000..c7a2e26
--- /dev/null
+++ b/app/client/dataset/dataset.reducer.js
@@ -0,0 +1,136 @@
+import types from '../types'
+
+const datasetInitialState = {
+  loading: false,
+  error: null,
+  status: '',
+}
+
+const datasetReducer = (state = datasetInitialState, action) => {
+  console.log(action)
+  switch(action.type) {
+    case types.socket.connect:
+      return {
+        ...state,
+      }
+    case types.task.task_begin:
+      return {
+        ...state,
+      }
+    case types.task.task_finish:
+      return {
+        ...state,
+      }
+
+    case types.folder.index:
+      return {
+        ...state,
+        folders: action.data,
+        folder: action.data[0],
+      }
+    case types.folder.update:
+      return state
+    case types.file.index:
+      return {
+        ...state,
+        files: action.data
+      }
+
+    case types.folder.upload_loading:
+      return {
+        ...state,
+        upload: {
+          loading: true,
+          status: 'Loading...',
+        },
+      }
+    case types.folder.upload_error:
+      return {
+        ...state,
+        upload: {
+          loading: false,
+          status: 'Error uploading :(',
+        },
+      }
+    case types.folder.upload_progress:
+      console.log(action)
+      return {
+        ...state,
+        upload: {
+          loading: true,
+          status: 'Upload progress ' + action.percent + '%',
+        },
+      }
+    case types.folder.upload_waiting:
+      console.log(action)
+      return {
+        ...state,
+        upload: {
+          loading: true,
+          status: 'Waiting for server to finish processing...',
+        },
+      }
+    case types.file.create_loading:
+      return {
+        ...state,
+        upload: {
+          loading: true,
+          status: 'Creating file...'
+        }
+      }
+    case types.file.create:
+      console.log('booo')
+      if (state.folder.id === action.data.folder_id) {
+        return {
+          ...state,
+          files: [action.data].concat(state.files),
+          upload: {
+            loading: false,
+            status: 'File created',
+          },
+        }
+      } else {
+        return {
+          ...state,
+          upload: {
+            loading: false,
+            status: 'created',
+          },
+        }
+      }
+    case types.folder.upload_complete:
+      console.log(action)
+      if (state.folder.id === action.folder) {
+        return {
+          ...state,
+          files: [action.files].concat(state.files),
+          upload: {
+            loading: false,
+            status: 'Upload complete',
+          },
+        }
+      } else {
+        return {
+          ...state,
+          upload: {
+            loading: false,
+            status: 'Upload complete',
+          },
+        }
+      }
+    case types.socket.status:
+      return datasetSocket(state, action.data)
+    default:
+      return state
+  }
+}
+
+const datasetSocket = (state, action) => {
+  console.log(action)
+  switch (action.key) {
+    default:  
+      return state
+  }
+}
+
+export default datasetReducer