Merge branch 'master' of asdf.us:swimmer

1 files changed, 58 insertions, 0 deletions

diff --git a/frontend/app/views/audio/components/audio.select.js b/frontend/app/views/audio/components/audio.select.js
new file mode 100644
index 0000000..384bb7a
--- /dev/null
+++ b/frontend/app/views/audio/components/audio.select.js
@@ -0,0 +1,58 @@
+import React, { Component } from 'react'
+import { connect } from 'react-redux'
+
+import { Select } from 'app/common'
+import { unslugify } from 'app/utils'
+
+const NO_AUDIO = 0
+const AUDIO_TOP_OPTIONS = [
+  { name: NO_AUDIO, label: 'No Sound' },
+  { name: -2, label: '──────────', disabled: true },
+]
+
+class AudioSelect extends Component {
+  state = {
+    audioList: []
+  }
+
+  constructor(props) {
+    super(props)
+    this.handleChange = this.handleChange.bind(this)
+  }
+
+  componentDidMount(){
+    const { uploads } = this.props.graph.show.res
+    const audioUploads = uploads
+      .filter(upload => upload.tag === 'audio')
+      .map(upload => ({ name: upload.id, label: unslugify(upload.fn) }))
+    let audioList = [
+      ...AUDIO_TOP_OPTIONS,
+      ...audioUploads,
+    ]
+    this.setState({
+      audioList,
+    })
+  }
+
+  handleChange(name, value) {
+    this.props.onChange(name, parseInt(value))
+  }
+
+  render() {
+    return (
+      <Select
+        title={this.props.title || "Audio"}
+        name={this.props.name}
+        selected={this.props.selected || NO_AUDIO}
+        options={this.state.audioList}
+        onChange={this.handleChange}
+      />
+    )
+  }
+}
+
+const mapStateToProps = state => ({
+  graph: state.graph,
+})
+
+export default connect(mapStateToProps)(AudioSelect)