diff --git a/js/actionCreators.js b/js/actionCreators.js
index f4af71e4..ad2cafde 100644
--- a/js/actionCreators.js
+++ b/js/actionCreators.js
@@ -1,6 +1,8 @@
import MyFile from './myFile';
import skinParser from './skinParser';
+import {clamp} from './utils';
+
export function play(mediaPlayer) {
return (dispatch, getState) => {
if (getState().media.status === 'PLAYING') {
@@ -43,6 +45,22 @@ export function close(mediaPlayer) {
};
}
+export function setVolume(mediaPlayer, volume) {
+ const realVolume = clamp(volume, 0, 100);
+ mediaPlayer.setVolume(volume);
+ return {
+ type: 'SET_VOLUME',
+ volume: realVolume
+ };
+}
+
+export function adjustVolume(mediaPlayer, volumeDiff) {
+ return (dispatch, getState) => {
+ const currentVolume = getState().media.volume;
+ return dispatch(setVolume(mediaPlayer, currentVolume + volumeDiff));
+ };
+}
+
export function setSkinFromFile(skinFile) {
return (dispatch) => {
dispatch({type: 'START_LOADING'});
diff --git a/js/components/MainWindow.jsx b/js/components/MainWindow.jsx
index 0e194b6d..a0bb1f23 100644
--- a/js/components/MainWindow.jsx
+++ b/js/components/MainWindow.jsx
@@ -75,7 +75,7 @@ const MainWindow = (props) => {
-
+
diff --git a/js/components/Volume.jsx b/js/components/Volume.jsx
index 0a706cc6..7ba5bacb 100644
--- a/js/components/Volume.jsx
+++ b/js/components/Volume.jsx
@@ -1,5 +1,6 @@
import React from 'react';
import {connect} from 'react-redux';
+import {setVolume} from '../actionCreators';
class Volume extends React.Component {
@@ -11,10 +12,9 @@ class Volume extends React.Component {
}
setVolume(e) {
- this.props.dispatch({
- type: 'SET_VOLUME',
- volume: e.target.value
- });
+ this.props.dispatch(
+ setVolume(this.props.mediaPlayer, e.target.value)
+ );
}
showMarquee() {
diff --git a/js/hotkeys.js b/js/hotkeys.js
index c0660ca1..921034ca 100644
--- a/js/hotkeys.js
+++ b/js/hotkeys.js
@@ -1,4 +1,4 @@
-import {play, pause, stop} from './actionCreators';
+import {play, pause, stop, adjustVolume} from './actionCreators';
module.exports = function(winamp, store) {
let keylog = [];
@@ -18,14 +18,12 @@ module.exports = function(winamp, store) {
case 37: winamp.seekForwardBy(-5); break; // left arrow
// up arrow
case 38:
- const incrementedVolume = Math.min(100, store.getState().media.volume + 1);
- store.dispatch({type: 'SET_VOLUME', volume: incrementedVolume});
+ store.dispatch(adjustVolume(winamp.media, 1));
break;
case 39: winamp.seekForwardBy(5); break; // right arrow
// down arrow
case 40:
- const decrementedVolume = Math.max(0, store.getState().media.volume - 1);
- store.dispatch({type: 'SET_VOLUME', volume: decrementedVolume});
+ store.dispatch(adjustVolume(winamp.media, -1));
break;
case 66: winamp.next(); break; // B
// C
diff --git a/js/reducers.js b/js/reducers.js
index fa92247a..8ba7e1c0 100644
--- a/js/reducers.js
+++ b/js/reducers.js
@@ -144,9 +144,6 @@ const createReducer = (winamp) => {
return (state, action) => {
state = reducer(state, action);
switch (action.type) {
- case 'SET_VOLUME':
- winamp.setVolume(action.volume);
- return state;
case 'SET_BALANCE':
winamp.setBalance(action.balance);
return state;
diff --git a/js/utils.js b/js/utils.js
index 6c12635b..92e5429f 100644
--- a/js/utils.js
+++ b/js/utils.js
@@ -39,8 +39,13 @@ const parseViscolors = (text) => {
return colors;
};
+const clamp = (value, min, max) => {
+ return Math.min(Math.max(value, min), max);
+};
+
module.exports = {
getTimeObj,
getTimeStr,
- parseViscolors
+ parseViscolors,
+ clamp
};
diff --git a/js/winamp.js b/js/winamp.js
index d333c859..5e6eda63 100755
--- a/js/winamp.js
+++ b/js/winamp.js
@@ -47,15 +47,6 @@ module.exports = {
this.media.seekToPercentComplete(percent);
},
- // From 0-100
- setVolume: function(volume) {
- // Ensure volume does not go out of bounds
- volume = Math.max(volume, 0);
- volume = Math.min(volume, 100);
-
- this.media.setVolume(volume);
- },
-
// From -100 to 100
setBalance: function(balance) {
this.media.setBalance(balance);