From 5a4de48a6d63cb383832f6ef85b21699a511b755 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Fri, 25 May 2018 19:54:38 +0200
Subject: stubbing in a lot of stuff!

---
 app/client/dashboard/actions.js                   |  1 +
 app/client/dashboard/dashboard.component.js       | 71 +++++++++++++++++++++++
 app/client/dashboard/dashboard.reducer.js         | 16 +++++
 app/client/dashboard/dashboardHeader.component.js | 39 +++++++++++++
 app/client/dashboard/filelist.component.js        | 46 +++++++++++++++
 app/client/dashboard/gallery.component.js         | 33 +++++++++++
 app/client/dashboard/index.js                     |  2 +
 app/client/dashboard/tasklist.component.js        | 45 ++++++++++++++
 8 files changed, 253 insertions(+)
 create mode 100644 app/client/dashboard/actions.js
 create mode 100644 app/client/dashboard/dashboard.component.js
 create mode 100644 app/client/dashboard/dashboard.reducer.js
 create mode 100644 app/client/dashboard/dashboardHeader.component.js
 create mode 100644 app/client/dashboard/filelist.component.js
 create mode 100644 app/client/dashboard/gallery.component.js
 create mode 100644 app/client/dashboard/index.js
 create mode 100644 app/client/dashboard/tasklist.component.js

(limited to 'app/client/dashboard')

diff --git a/app/client/dashboard/actions.js b/app/client/dashboard/actions.js
new file mode 100644
index 0000000..01c0a96
--- /dev/null
+++ b/app/client/dashboard/actions.js
@@ -0,0 +1 @@
+import types from '../types'
diff --git a/app/client/dashboard/dashboard.component.js b/app/client/dashboard/dashboard.component.js
new file mode 100644
index 0000000..6db42ae
--- /dev/null
+++ b/app/client/dashboard/dashboard.component.js
@@ -0,0 +1,71 @@
+import { h, Component } from 'preact'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+
+import Player from '../common/player.component'
+import Group from '../common/group.component'
+import Slider from '../common/slider.component'
+import Select from '../common/select.component'
+import Button from '../common/button.component'
+
+import DashboardHeader from './dashboardheader.component'
+import TaskList from './tasklist.component'
+import FileList from './filelist.component'
+import Gallery from './gallery.component'
+
+import * as liveActions from './actions'
+
+class Dashboard extends Component {
+  constructor(props){
+    super()
+  }
+  componentWillUpdate(nextProps) {
+    // if (nextProps.opt.checkpoint_name && nextProps.opt.checkpoint_name !== this.props.opt.checkpoint_name) {
+    //   this.props.actions.list_epochs(nextProps.opt.checkpoint_name)
+    // }
+  }
+  render(){
+    const { tasks, files, images, site } = this.props
+    return (
+      <div className='dashboard'>
+        <DashboardHeader />
+        <div className='params'>
+          <div className='column'>
+            <Group title='Completed Tasks'>
+              <TaskList tasks={tasks} />
+            </Group>
+            <Group title='Upcoming Tasks'>
+              <TaskList tasks={tasks} />
+            </Group>
+          </div>
+          <div className='column'>
+            <Group title='Your Datasets'>
+              <FileList files={files} />
+            </Group>
+            <Group title='Results'>
+              <FileList files={files} />
+            </Group>
+            <Group title='Audio Player'>
+              <FileList files={files} />
+            </Group>
+          </div>
+        </div>
+        <div>
+          <Gallery images={images} />
+        </div>
+      </div>
+    )
+  }
+}
+const mapStateToProps = state => ({
+  site: state.system.site,
+  images: state.system.images,
+  tasks: state.system.tasks,
+  files: state.system.files
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  actions: bindActionCreators(liveActions, dispatch)
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(Dashboard)
diff --git a/app/client/dashboard/dashboard.reducer.js b/app/client/dashboard/dashboard.reducer.js
new file mode 100644
index 0000000..c5b3d4a
--- /dev/null
+++ b/app/client/dashboard/dashboard.reducer.js
@@ -0,0 +1,16 @@
+import moment from 'moment'
+let FileSaver = require('file-saver')
+
+const dashboardInitialState = {
+  loading: false,
+  error: null,
+}
+
+const dashboardReducer = (state = dashboardInitialState, action) => {
+  switch(action.type) {
+    default:
+      return state
+  }
+}
+
+export default dashboardReducer
diff --git a/app/client/dashboard/dashboardHeader.component.js b/app/client/dashboard/dashboardHeader.component.js
new file mode 100644
index 0000000..492dfd8
--- /dev/null
+++ b/app/client/dashboard/dashboardHeader.component.js
@@ -0,0 +1,39 @@
+import { h, Component } from 'preact'
+import { connect } from 'react-redux'
+import { bindActionCreators } from 'redux'
+import * as liveActions from '../live/actions'
+
+import * as util from '../util'
+
+class DashboardHeader extends Component {
+  constructor(props){
+    super(props)
+    this.handleClick = this.handleClick.bind(this)
+  }
+  handleClick(e){
+    this.props.onClick && this.props.onClick()
+  }
+  render() {
+    const { currentTask, site } = this.props
+    const eta = ((currentTask.epochs - currentTask.epoch) * 180 / 60) + " minutes"
+    return (
+	    <div class='dashboardHeader heading'>
+	      <h3>{site.name}</h3>
+	      Currently {util.gerund(currentTask.activity)} {currentTask.library} on {currentTask.dataset}<br/>
+	      Epoch: {currentTask.epoch} / {currentTask.epochs}, ETA {eta}<br/>
+	      <br/>
+	      Want to play live? <button>Pause at the end of this epoch</button>
+	    </div>
+    )
+  }
+}
+
+const mapStateToProps = state => ({
+	currentTask: state.system.currentTask,
+	site: state.system.site,
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(DashboardHeader)
diff --git a/app/client/dashboard/filelist.component.js b/app/client/dashboard/filelist.component.js
new file mode 100644
index 0000000..2833ec8
--- /dev/null
+++ b/app/client/dashboard/filelist.component.js
@@ -0,0 +1,46 @@
+import { h, Component } from 'preact'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+import * as util from '../util'
+
+class FileList extends Component {
+  constructor(props){
+    super()
+  }
+  render(){
+    const { files } = this.props
+    let time = 0
+	  const fileList = files.map(file => {
+	    const eta = (time + (file.epochs) * 180 / 60) + " min."
+	    time += (file.epochs) * 180 / 60
+	    let dataset_type, dataset_name 
+	    if (file.dataset.indexOf('/') !== -1) {
+	    	[dataset_type, dataset_name] = file.dataset.split('/')
+	    } else {
+	    	dataset_name = file.dataset
+	    }
+	   	return (
+		   	<div class='row'>
+	        <div class='activity'>{file.activity} {file.library} {dataset_type}</div>
+	        <div class='dataset'>{dataset_name}</div>
+	        <div class='epochs'>{file.epochs} ep.</div>
+	        <div class='eta'>{eta}</div>
+		   	</div>
+	   	)
+	  })
+	  return (
+	  	<div class='filelist rows'>
+	  		{fileList}
+	  	</div>
+  	)
+  }
+}
+
+const mapStateToProps = state => ({
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  // actions: bindActionCreators(liveActions, dispatch)
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(FileList)
diff --git a/app/client/dashboard/gallery.component.js b/app/client/dashboard/gallery.component.js
new file mode 100644
index 0000000..0e1f44d
--- /dev/null
+++ b/app/client/dashboard/gallery.component.js
@@ -0,0 +1,33 @@
+import { h, Component } from 'preact'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+
+class Gallery extends Component {
+  constructor(props){
+    super()
+  }
+  render(){
+    const { title, images } = this.props
+    images.push(images[0])
+	  const imageList = images.map(image => {
+	   	return (
+		   	<div>
+		   		<img src={image.url} />
+		   	</div>
+	   	)
+	  })
+	  return (
+	  	<div class='gallery'>
+	  		{imageList}
+	  	</div>
+  	)
+  }
+}
+const mapStateToProps = state => ({
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  // actions: bindActionCreators(liveActions, dispatch)
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(Gallery)
diff --git a/app/client/dashboard/index.js b/app/client/dashboard/index.js
new file mode 100644
index 0000000..29b1ecf
--- /dev/null
+++ b/app/client/dashboard/index.js
@@ -0,0 +1,2 @@
+export default {
+}
\ No newline at end of file
diff --git a/app/client/dashboard/tasklist.component.js b/app/client/dashboard/tasklist.component.js
new file mode 100644
index 0000000..fa002de
--- /dev/null
+++ b/app/client/dashboard/tasklist.component.js
@@ -0,0 +1,45 @@
+import { h, Component } from 'preact'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+
+class TaskList extends Component {
+  constructor(props){
+    super()
+  }
+  render(){
+    const { title, tasks } = this.props
+    let time = 0
+	  const taskList = tasks.map(task => {
+	    const eta = (time + (task.epochs) * 180 / 60) + " min."
+	    time += (task.epochs) * 180 / 60
+	    let dataset_type, dataset_name 
+	    if (task.dataset.indexOf('/') !== -1) {
+	    	[dataset_type, dataset_name] = task.dataset.split('/')
+	    } else {
+	    	dataset_name = task.dataset
+	    }
+	   	return (
+		   	<div class='row'>
+	        <div class='activity'>{task.activity} {task.library} {dataset_type}</div>
+	        <div class='dataset'>{dataset_name}</div>
+	        <div class='epochs'>{task.epochs} ep.</div>
+	        <div class='eta'>{eta}</div>
+		   	</div>
+	   	)
+	  })
+	  return (
+	  	<div class='taskList rows'>
+	  		{taskList}
+	  	</div>
+  	)
+  }
+}
+
+const mapStateToProps = state => ({
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  // actions: bindActionCreators(liveActions, dispatch)
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(TaskList)
-- 
cgit v1.2.3-70-g09d2