summaryrefslogtreecommitdiff
path: root/app/client/common
diff options
context:
space:
mode:
Diffstat (limited to 'app/client/common')
-rw-r--r--app/client/common/audioPlayer/audioPlayer.actions.js15
-rw-r--r--app/client/common/audioPlayer/audioPlayer.component.js (renamed from app/client/common/audioPlayer.component.js)18
-rw-r--r--app/client/common/audioPlayer/audioPlayer.reducer.js44
-rw-r--r--app/client/common/fileList.component.js6
4 files changed, 73 insertions, 10 deletions
diff --git a/app/client/common/audioPlayer/audioPlayer.actions.js b/app/client/common/audioPlayer/audioPlayer.actions.js
new file mode 100644
index 0000000..3d3ea10
--- /dev/null
+++ b/app/client/common/audioPlayer/audioPlayer.actions.js
@@ -0,0 +1,15 @@
+
+import types from '../../types'
+
+export const play = (file) => {
+ return { type: types.audioPlayer.play, file }
+}
+export const pause = () => {
+ return { type: types.audioPlayer.pause }
+}
+export const resume = () => {
+ return { type: types.audioPlayer.resume }
+}
+export const enqueue = (file) => {
+ return { type: types.audioPlayer.enqueue, file}
+} \ No newline at end of file
diff --git a/app/client/common/audioPlayer.component.js b/app/client/common/audioPlayer/audioPlayer.component.js
index f10a505..481a685 100644
--- a/app/client/common/audioPlayer.component.js
+++ b/app/client/common/audioPlayer/audioPlayer.component.js
@@ -1,9 +1,7 @@
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')
+import * as audioPlayerActions from './audioPlayer.actions'
class AudioPlayer extends Component {
constructor(props){
@@ -11,17 +9,22 @@ class AudioPlayer extends Component {
this.handleClick = this.handleClick.bind(this)
}
handleClick(e){
- this.props.onClick && this.props.onClick()
+ const { audioPlayer, actions } = this.props
+ if (audioPlayer.playing) {
+ actions.pause()
+ } else {
+ actions.resume()
+ }
}
render() {
- const { player={} } = this.props
+ const { audioPlayer } = this.props
return (
<div className='audioPlayer'>
<span>{this.props.title}</span>
<button
onClick={this.handleClick}
>
- {player.playing ? '>' : 'pause'}
+ {audioPlayer.playing ? '>' : 'pause'}
</button>
</div>
)
@@ -29,10 +32,11 @@ class AudioPlayer extends Component {
}
const mapStateToProps = state => ({
- player: state.audioPlayer,
+ audioPlayer: state.audioPlayer,
})
const mapDispatchToProps = (dispatch, ownProps) => ({
+ actions: bindActionCreators(audioPlayerActions, dispatch),
})
export default connect(mapStateToProps, mapDispatchToProps)(AudioPlayer)
diff --git a/app/client/common/audioPlayer/audioPlayer.reducer.js b/app/client/common/audioPlayer/audioPlayer.reducer.js
new file mode 100644
index 0000000..e249325
--- /dev/null
+++ b/app/client/common/audioPlayer/audioPlayer.reducer.js
@@ -0,0 +1,44 @@
+import types from '../../types'
+
+const audioPlayerInitialState = {
+ loading: false,
+ error: null,
+ status: '',
+ current: null,
+ index: -1,
+ playlist: [],
+}
+
+const audio = document.createElement('audio')
+
+const audioPlayerReducer = (state = audioPlayerInitialState, action) => {
+ switch(action.type) {
+ case types.audioPlayer.play:
+ if (! action.file.url) {
+ return state
+ }
+ audio.src = action.file.url
+ audio.play()
+ return {
+ ...state,
+ playing: true,
+ current: action.file,
+ }
+ case types.audioPlayer.pause:
+ audio.pause()
+ return {
+ ...state,
+ playing: false,
+ }
+ case types.audioPlayer.resume:
+ audio.play()
+ return {
+ ...state,
+ playing: true,
+ }
+ default:
+ return state
+ }
+}
+
+export default audioPlayerReducer
diff --git a/app/client/common/fileList.component.js b/app/client/common/fileList.component.js
index f596c8d..d060e01 100644
--- a/app/client/common/fileList.component.js
+++ b/app/client/common/fileList.component.js
@@ -27,7 +27,7 @@ export const FileList = props => {
fields={fieldSet(fields)}
className={rowClassName}
linkFiles
- onClick
+ onClick={onClick}
/>
})
if (! (files && files.length)) {
@@ -79,8 +79,8 @@ export const FileRow = props => {
{file.persisted === false
? <span className='unpersisted'>{file.name || file.url}</span>
: (linkFiles && file.url)
- ? <a target='_blank' href={file.url}>{file.name || file.url}</a>
- : <span class='link' onClick={() => onClick(file)}>{file.name || file.url}</span>
+ ? <a target='_blank' onClick={(e) => onClick && onClick(file, e)} href={file.url}>{file.name || file.url}</a>
+ : <span class='link' onClick={(e) => onClick && onClick(file, e)}>{file.name || file.url}</span>
}
</div>
}