diff --git a/js/actionTypes.js b/js/actionTypes.js index 1bedbbbc..2fa5a591 100644 --- a/js/actionTypes.js +++ b/js/actionTypes.js @@ -37,3 +37,5 @@ export const TOGGLE_TIME_MODE = "TOGGLE_TIME_MODE"; export const TOGGLE_VISUALIZER_STYLE = "TOGGLE_VISUALIZER_STYLE"; export const UNSET_FOCUS = "UNSET_FOCUS"; export const UPDATE_TIME_ELAPSED = "UPDATE_TIME_ELAPSED"; +export const SET_USER_MESSAGE = "SET_USER_MESSAGE"; +export const UNSET_USER_MESSAGE = "UNSET_USER_MESSAGE"; diff --git a/js/components/MainWindow/Marquee.js b/js/components/MainWindow/Marquee.js index eb763960..a8b9c3fd 100644 --- a/js/components/MainWindow/Marquee.js +++ b/js/components/MainWindow/Marquee.js @@ -100,6 +100,9 @@ class Marquee extends React.Component { } getText() { + if (this.props.userInput.userMessage != null) { + return this.props.userInput.userMessage; + } switch (this.props.userInput.focus) { case "balance": return getBalanceText(this.props.media.balance); diff --git a/js/components/MainWindow/PlaylistToggleButton.js b/js/components/MainWindow/PlaylistToggleButton.js index d47f925c..859b1820 100644 --- a/js/components/MainWindow/PlaylistToggleButton.js +++ b/js/components/MainWindow/PlaylistToggleButton.js @@ -2,13 +2,19 @@ import React from "react"; import { connect } from "react-redux"; import classnames from "classnames"; -import { TOGGLE_PLAYLIST_WINDOW } from "../../actionTypes"; +import { + TOGGLE_PLAYLIST_WINDOW, + SET_USER_MESSAGE, + UNSET_USER_MESSAGE +} from "../../actionTypes"; const PlaylistToggleButton = props => (
); @@ -17,9 +23,16 @@ const mapStateToProps = state => ({ playlist: state.windows.playlist }); -const mapDispatchToProps = dispatch => ({ - handleClick: () => dispatch({ type: TOGGLE_PLAYLIST_WINDOW }) -}); +const mapDispatchToProps = { + handleClick: () => ({ type: TOGGLE_PLAYLIST_WINDOW }), + handleMouseDown: () => ({ + type: SET_USER_MESSAGE, + message: "Playlist not yet implemented" + }), + handleMouseUp: () => ({ + type: UNSET_USER_MESSAGE + }) +}; export default connect(mapStateToProps, mapDispatchToProps)( PlaylistToggleButton diff --git a/js/components/MainWindow/__snapshots__/index.test.js.snap b/js/components/MainWindow/__snapshots__/index.test.js.snap index 75fdd99f..0a5d8f98 100644 --- a/js/components/MainWindow/__snapshots__/index.test.js.snap +++ b/js/components/MainWindow/__snapshots__/index.test.js.snap @@ -294,6 +294,8 @@ exports[`MainWindow renders to snapshot 1`] = ` className="" id="playlist-button" onClick={[Function]} + onMouseDown={[Function]} + onMouseUp={[Function]} title="Toggle Playlist Editor" />
diff --git a/js/reducers.js b/js/reducers.js index 222d30cb..edd4da5c 100644 --- a/js/reducers.js +++ b/js/reducers.js @@ -30,14 +30,17 @@ import { TOGGLE_TIME_MODE, TOGGLE_VISUALIZER_STYLE, UNSET_FOCUS, - UPDATE_TIME_ELAPSED + UPDATE_TIME_ELAPSED, + SET_USER_MESSAGE, + UNSET_USER_MESSAGE } from "./actionTypes"; import { equalizerEnabled, playlistEnabled } from "./config"; const defaultUserInput = { focus: null, bandFocused: null, - scrubPosition: 0 + scrubPosition: 0, + userMessage: null }; export const userInput = (state = defaultUserInput, action) => { @@ -50,6 +53,10 @@ export const userInput = (state = defaultUserInput, action) => { return { ...state, focus: null, bandFocused: null }; case SET_SCRUB_POSITION: return { ...state, scrubPosition: action.position }; + case SET_USER_MESSAGE: + return { ...state, userMessage: action.message }; + case UNSET_USER_MESSAGE: + return { ...state, userMessage: null }; default: return state; } diff --git a/js/reducers.test.js b/js/reducers.test.js index 845200a7..3ef5441a 100644 --- a/js/reducers.test.js +++ b/js/reducers.test.js @@ -4,18 +4,25 @@ import { SET_FOCUS, SET_SCRUB_POSITION, UNSET_FOCUS } from "./actionTypes"; describe("userInput reducer", () => { const state = userInput(undefined, { type: "@@INIT" }); it("has sensible defaults", () => { - expect(state).toEqual({ focus: null, scrubPosition: 0, bandFocused: null }); + expect(state).toEqual({ + focus: null, + scrubPosition: 0, + bandFocused: null, + userMessage: null + }); }); it("can set focus", () => { const newState = userInput(state, { type: SET_FOCUS, input: "foo", - bandFocused: null + bandFocused: null, + userMessage: null }); expect(newState).toEqual({ focus: "foo", scrubPosition: 0, - bandFocused: null + bandFocused: null, + userMessage: null }); }); it("can unset focus", () => { @@ -26,19 +33,22 @@ describe("userInput reducer", () => { expect(newState).toEqual({ focus: null, scrubPosition: 0, - bandFocused: null + bandFocused: null, + userMessage: null }); }); it("can set scrub position", () => { const newState = userInput(state, { type: SET_SCRUB_POSITION, position: 5, - bandFocused: null + bandFocused: null, + userMessage: null }); expect(newState).toEqual({ focus: null, scrubPosition: 5, - bandFocused: null + bandFocused: null, + userMessage: null }); }); });