summaryrefslogtreecommitdiff
path: root/app/client
diff options
context:
space:
mode:
Diffstat (limited to 'app/client')
-rw-r--r--app/client/common/audioPlayer.component.js38
-rw-r--r--app/client/common/fileList.component.js19
-rw-r--r--app/client/dashboard/dashboardHeader.component.js2
-rw-r--r--app/client/dataset/dataset.form.js24
-rw-r--r--app/client/modules/samplernn/samplernn.actions.js15
-rw-r--r--app/client/modules/samplernn/samplernn.datasets.js45
-rw-r--r--app/client/modules/samplernn/samplernn.results.js19
-rw-r--r--app/client/queue/queue.actions.js2
-rw-r--r--app/client/util/sort.js4
9 files changed, 116 insertions, 52 deletions
diff --git a/app/client/common/audioPlayer.component.js b/app/client/common/audioPlayer.component.js
new file mode 100644
index 0000000..f10a505
--- /dev/null
+++ b/app/client/common/audioPlayer.component.js
@@ -0,0 +1,38 @@
+import { h, Component } from 'preact'
+import { connect } from 'react-redux'
+import { bindActionCreators } from 'redux'
+import * as liveActions from '../live/live.actions'
+
+const audio = document.createElement('audio')
+
+class AudioPlayer extends Component {
+ constructor(props){
+ super(props)
+ this.handleClick = this.handleClick.bind(this)
+ }
+ handleClick(e){
+ this.props.onClick && this.props.onClick()
+ }
+ render() {
+ const { player={} } = this.props
+ return (
+ <div className='audioPlayer'>
+ <span>{this.props.title}</span>
+ <button
+ onClick={this.handleClick}
+ >
+ {player.playing ? '>' : 'pause'}
+ </button>
+ </div>
+ )
+ }
+}
+
+const mapStateToProps = state => ({
+ player: state.audioPlayer,
+})
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(AudioPlayer)
diff --git a/app/client/common/fileList.component.js b/app/client/common/fileList.component.js
index c16928f..f596c8d 100644
--- a/app/client/common/fileList.component.js
+++ b/app/client/common/fileList.component.js
@@ -30,13 +30,22 @@ export const FileList = props => {
onClick
/>
})
+ if (! (files && files.length)) {
+ return (
+ <div className={'rows ' + className}>
+ <div class='row heading'>
+ <h4 class='noFiles'>No files</h4>
+ </div>
+ </div>
+ )
+ }
return (
<div className={'rows ' + className}>
- <div class='row heading'>
- {(files && files.length)
- ? (title && <h3>{title}</h3>)
- : <h4>No files</h4>}
- </div>
+ {title &&
+ <div class='row heading'>
+ <h3>{title}</h3>}
+ </div>
+ }
<div className={'rows ' + fileListClassName}>
{fileList}
diff --git a/app/client/dashboard/dashboardHeader.component.js b/app/client/dashboard/dashboardHeader.component.js
index 3d4d31f..508cbfa 100644
--- a/app/client/dashboard/dashboardHeader.component.js
+++ b/app/client/dashboard/dashboardHeader.component.js
@@ -16,7 +16,7 @@ class DashboardHeader extends Component {
const { site } = this.props
return (
<div class='dashboardHeader heading'>
- <h3>{site.name}</h3>
+ <h1>{site.name} cortex</h1>
{this.renderGPUStatus()}
</div>
)
diff --git a/app/client/dataset/dataset.form.js b/app/client/dataset/dataset.form.js
index fd00518..dee0263 100644
--- a/app/client/dataset/dataset.form.js
+++ b/app/client/dataset/dataset.form.js
@@ -17,33 +17,27 @@ class DatasetForm extends Component {
render(){
const {
loading, status, error,
- module, folder,
+ module, folder, title='Dataset',
canRename, canUpload, canAddURL
} = this.props
// sort files??
if (!folder.id) {
return (
- <div className='dataset'>
- <div className='params row'>
- <div className='column'>
- {canRename
- ? this.renderFolderNameInput(folder.name)
- : <h2>{folder.name}</h2>}
- </div>
+ <div className='params row'>
+ <div className='column'>
+ {this.renderFolderNameInput(folder.name)}
</div>
</div>
)
}
return (
- <div className='params row'>
+ <div className='form params row'>
<div className='col'>
- <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>
+ {canRename && this.renderFolderNameInput(folder.name)}
+ {canUpload && this.renderUploadInput()}
+ {canAddURL && this.renderURLInput()}
</Group>
</div>
</div>
diff --git a/app/client/modules/samplernn/samplernn.actions.js b/app/client/modules/samplernn/samplernn.actions.js
index e8f8251..25c9699 100644
--- a/app/client/modules/samplernn/samplernn.actions.js
+++ b/app/client/modules/samplernn/samplernn.actions.js
@@ -179,3 +179,18 @@ export const fetch_url = (url) => (dispatch) => {
opt: { url }
}, { preempt: true, watch: true })
}
+
+export const train_task_now = (dataset) => (dispatch) => {
+ const task = {
+ module: 'samplernn',
+ activity: 'train',
+ dataset: dataset,
+ epochs: 6,
+ opt: {
+ sample_length: 44100 * 5,
+ n_samples: 6,
+ keep_old_checkpoints: false,
+ }
+ }
+ return actions.queue.start_task(task)
+} \ No newline at end of file
diff --git a/app/client/modules/samplernn/samplernn.datasets.js b/app/client/modules/samplernn/samplernn.datasets.js
index f5f4a1d..dafed79 100644
--- a/app/client/modules/samplernn/samplernn.datasets.js
+++ b/app/client/modules/samplernn/samplernn.datasets.js
@@ -52,7 +52,35 @@ class SampleRNNDatasets extends Component {
render(){
const { samplernn } = this.props
const folder = samplernn.folder
- if (!folder.name) return
+ if (!folder || !folder.name) return
+ return (
+ <div className='app'>
+ <div class='heading'>
+ <h1>{folder.name}</h1>
+ </div>
+ {folder.name !== 'unsorted' &&
+ <DatasetForm title='Add Files' folder={folder} canUpload canAddURL />
+ }
+ {this.renderDataset()}
+ </div>
+ )
+ }
+ renderDataset(){
+ return (
+ <div class='rows params datasets'>
+ <div class='row dataset'>
+ <div class='col'>input</div>
+ <div class='col'></div>
+ <div class='col'>checkpoint</div>
+ <div class='col'>output</div>
+ </div>
+ {this.renderGroups()}
+ </div>
+ )
+ }
+ renderGroups(){
+ const { samplernn } = this.props
+ const folder = samplernn.folder
const { mapFn, sortFn } = util.sort.orderByFn('date desc')
const datasets = folder.datasets.map(mapFn).sort(sortFn).map(pair => {
const dataset = pair[1]
@@ -92,20 +120,7 @@ class SampleRNNDatasets extends Component {
</div>
)
})
- return (
- <div className='app'>
- <DatasetForm folder={folder} canRename canUpload canAddURL />
- <div class='rows params datasets'>
- <div class='row dataset'>
- <div class='col'>input</div>
- <div class='col'></div>
- <div class='col'>checkpoint</div>
- <div class='col'>output</div>
- </div>
- {datasets}
- </div>
- </div>
- )
+ return datasets
}
}
diff --git a/app/client/modules/samplernn/samplernn.results.js b/app/client/modules/samplernn/samplernn.results.js
index 06092fb..b689106 100644
--- a/app/client/modules/samplernn/samplernn.results.js
+++ b/app/client/modules/samplernn/samplernn.results.js
@@ -43,15 +43,12 @@ class SampleRNNResults extends Component {
}
render(){
if (this.props.samplernn.loading) return <span>Loading</span>
- console.log(this.props.samplernn.data)
const { folderLookup } = this.props.samplernn.data
// const { folderLookup } = samplernn
- console.log(this.props)
const renders = Object.keys(folderLookup).sort(util.sort.stringSort.asc).map(key => {
const folder = folderLookup[key]
let { mapFn, sortFn } = util.sort.orderByFn('epoch desc')
- console.log(mapFn, sortFn)
const datasetPairs = folder.datasets.map(mapFn).sort(sortFn)
const bestRenders = datasetPairs
.map(pair => pair[1])
@@ -60,17 +57,15 @@ class SampleRNNResults extends Component {
const { output } = dataset
return output.map(mapFn).sort(sortFn)[0][1]
})
- console.log(bestRenders.map(r => r.epoch))
+ // console.log(bestRenders.map(r => r.epoch))
return (
<div className='col'>
- <h3>{key}</h3>
- {!!bestRenders.length &&
- <FileList
- files={bestRenders}
- orderBy='date desc'
- fields={'name date epoch size'}
- />
- }
+ <h3>{folder.name}</h3>
+ <FileList
+ files={bestRenders}
+ orderBy='date desc'
+ fields={'name date epoch size'}
+ />
</div>
)
})
diff --git a/app/client/queue/queue.actions.js b/app/client/queue/queue.actions.js
index 7ede36d..6e39e71 100644
--- a/app/client/queue/queue.actions.js
+++ b/app/client/queue/queue.actions.js
@@ -2,9 +2,7 @@ import socket from '../socket'
import types from '../types'
export const start_task = (task, opt={}) => {
- console.log('boo')
socket.task.start_task(task, opt)
- console.log('zoo')
return { type: types.task.starting_task, task, ...opt }
}
diff --git a/app/client/util/sort.js b/app/client/util/sort.js
index cc1b462..78f17a0 100644
--- a/app/client/util/sort.js
+++ b/app/client/util/sort.js
@@ -15,7 +15,7 @@ export const orderByFn = (s='name asc') => {
sortFn = numericSort[direction]
break
case 'size':
- mapFn = a => [a.size, a]
+ mapFn = a => [parseInt(a.size) || 0, a]
sortFn = numericSort[direction]
break
case 'date':
@@ -24,7 +24,7 @@ export const orderByFn = (s='name asc') => {
break
case 'name':
default:
- mapFn = a => [a.id || a.name, a]
+ mapFn = a => [a.name || "", a]
sortFn = stringSort[direction]
break
}
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-10 20:19:34 +0000