diff --git a/js/actionCreators.js b/js/actionCreators.js
index 3ada2ea0..e7c5b19d 100644
--- a/js/actionCreators.js
+++ b/js/actionCreators.js
@@ -70,8 +70,7 @@ export function toggleRepeat() {
return {type: TOGGLE_REPEAT};
}
-export function toggleShuffle(mediaPlayer) {
- mediaPlayer.toggleShuffle();
+export function toggleShuffle() {
return {type: TOGGLE_SHUFFLE};
}
diff --git a/js/actionTypes.js b/js/actionTypes.js
index d0d87615..c8a77db8 100644
--- a/js/actionTypes.js
+++ b/js/actionTypes.js
@@ -4,6 +4,7 @@ export const IS_PLAYING = 'IS_PLAYING';
export const IS_STOPPED = 'IS_STOPPED';
export const PAUSE = 'PAUSE';
export const PLAY = 'PLAY';
+export const SEEK_TO_PERCENT_COMPLETE = 'SEEK_TO_PERCENT_COMPLETE';
export const SET_BALANCE = 'SET_BALANCE';
export const SET_BAND_VALUE = 'SET_BAND_VALUE';
export const SET_FOCUS = 'SET_FOCUS';
diff --git a/js/components/MainWindow.jsx b/js/components/MainWindow.jsx
index 8f2f0a1f..4c420ead 100644
--- a/js/components/MainWindow.jsx
+++ b/js/components/MainWindow.jsx
@@ -110,8 +110,8 @@ export class MainWindow extends React.Component {
-
-
+
+
diff --git a/js/components/Position.jsx b/js/components/Position.jsx
index 3b693658..00dfba5c 100644
--- a/js/components/Position.jsx
+++ b/js/components/Position.jsx
@@ -19,7 +19,7 @@ const Position = ({position, seekToPercentComplete, displayedPosition, setPositi
max='100'
step='1'
value={displayedPosition}
- onChange={seekToPercentComplete}
+ onChange={setPosition}
onInput={setPosition}
onMouseUp={seekToPercentComplete}
onMouseDown={setPosition}
@@ -30,7 +30,7 @@ const mapStateToProps = ({media, userInput}) => {
const position = media.length ? (media.timeElapsed / media.length) * 100 : 0;
const displayedPosition = (userInput.focus === 'position') ?
- userInput.scrubbingPosition :
+ userInput.scrubPosition :
position;
return {
@@ -39,9 +39,9 @@ const mapStateToProps = ({media, userInput}) => {
};
};
-const mapDispatchToProps = (dispatch, ownProps) => ({
+const mapDispatchToProps = (dispatch) => ({
seekToPercentComplete: (e) => {
- ownProps.mediaPlayer.seekToPercentComplete(e.target.value);
+ dispatch({type: 'SEEK_TO_PERCENT_COMPLETE', percent: e.target.value});
dispatch({type: 'UNSET_FOCUS'});
},
setPosition: (e) => {
diff --git a/js/components/Shuffle.jsx b/js/components/Shuffle.jsx
index d723374c..9fe170f0 100644
--- a/js/components/Shuffle.jsx
+++ b/js/components/Shuffle.jsx
@@ -1,17 +1,21 @@
import React from 'react';
import {connect} from 'react-redux';
import classnames from 'classnames';
+import toggleShuffle from '../actionCreators';
-const Shuffle = ({shuffle, toggleShuffle}) => (
+const Shuffle = ({shuffle, handleClick}) => (
);
-const mapStateToProps = (state) => state.media;
+const mapStateToProps = (state) => ({
+ shuffle: state.media.shuffle
+});
+
const mapDispatchToProps = (dispatch) => ({
- toggleShuffle: () => dispatch({type: 'TOGGLE_SHUFFLE'})
+ handleClick: () => dispatch(toggleShuffle())
});
module.exports = connect(mapStateToProps, mapDispatchToProps)(Shuffle);
diff --git a/js/hotkeys.js b/js/hotkeys.js
index 50511096..8057877f 100644
--- a/js/hotkeys.js
+++ b/js/hotkeys.js
@@ -59,7 +59,7 @@ module.exports = function(winamp, {dispatch}) {
dispatch(toggleRepeat());
break;
case 83: // S
- dispatch(toggleShuffle(winamp.media));
+ dispatch(toggleShuffle());
break;
case 86: // V
dispatch(stop());
diff --git a/js/mediaMiddleware.js b/js/mediaMiddleware.js
index 12a339c1..11e493ae 100644
--- a/js/mediaMiddleware.js
+++ b/js/mediaMiddleware.js
@@ -3,12 +3,14 @@ import {
IS_STOPPED,
PAUSE,
PLAY,
+ SEEK_TO_PERCENT_COMPLETE,
SET_BALANCE,
SET_VOLUME,
START_WORKING,
STOP,
STOP_WORKING,
TOGGLE_REPEAT,
+ TOGGLE_SHUFFLE,
UPDATE_TIME_ELAPSED
} from './actionTypes';
@@ -54,6 +56,12 @@ export default (media) => (
case TOGGLE_REPEAT:
media.toggleRepeat();
break;
+ case TOGGLE_SHUFFLE:
+ media.toggleShuffle();
+ break;
+ case SEEK_TO_PERCENT_COMPLETE:
+ media.seekToPercentComplete(action.percent);
+ break;
}
return next(action);
};