diff --git a/js/actionCreators/index.ts b/js/actionCreators/index.ts
index f81b2273..e48a79d7 100644
--- a/js/actionCreators/index.ts
+++ b/js/actionCreators/index.ts
@@ -8,10 +8,12 @@ import {
SET_FOCUS,
UNSET_FOCUS,
LOAD_SERIALIZED_STATE,
- LOAD_DEFAULT_SKIN
+ LOAD_DEFAULT_SKIN,
+ SET_MILKDROP_DESKTOP
} from "../actionTypes";
+import { WINDOWS } from "../constants";
import { Dispatchable } from "../types";
-import { ensureWindowsAreOnScreen } from "./windows";
+import { ensureWindowsAreOnScreen, showWindow, hideWindow } from "./windows";
import { SerializedStateV1 } from "../serializedStates/v1Types";
export {
@@ -93,6 +95,8 @@ export {
dragSelected
} from "./playlist";
+import * as Selectors from "../selectors";
+
export function close(): Dispatchable {
return dispatch => {
// TODO: This could probably be improved by adding a "PREVENT_CLOSE" action
@@ -142,3 +146,15 @@ export function loadSerializedState(
export function loadDefaultSkin() {
return { type: LOAD_DEFAULT_SKIN };
}
+
+export function toggleMilkdropDesktop(): Dispatchable {
+ return (dispatch, getState) => {
+ if (Selectors.getMilkdropDesktopEnabled(getState())) {
+ dispatch(showWindow(WINDOWS.MILKDROP));
+ dispatch({ type: SET_MILKDROP_DESKTOP, enabled: false });
+ } else {
+ dispatch(hideWindow(WINDOWS.MILKDROP));
+ dispatch({ type: SET_MILKDROP_DESKTOP, enabled: true });
+ }
+ };
+}
diff --git a/js/actionTypes.ts b/js/actionTypes.ts
index 9783752f..4d93a3b7 100644
--- a/js/actionTypes.ts
+++ b/js/actionTypes.ts
@@ -76,3 +76,4 @@ export const BROWSER_WINDOW_SIZE_CHANGED = "BROWSER_WINDOW_SIZE_CHANGED";
export const LOAD_DEFAULT_SKIN = "LOAD_DEFAULT_SKIN";
export const ENABLE_MEDIA_LIBRARY = "ENABLE_MEDIA_LIBRARY";
export const ENABLE_MILKDROP = "ENABLE_MILKDROP";
+export const SET_MILKDROP_DESKTOP = "SET_MILKDROP_DESKTOP";
diff --git a/js/components/MilkdropWindow/index.js b/js/components/MilkdropWindow/index.js
index 16e0b7f4..b17047e0 100644
--- a/js/components/MilkdropWindow/index.js
+++ b/js/components/MilkdropWindow/index.js
@@ -26,13 +26,12 @@ class PresetsLoader extends React.Component {
presets: null,
initialPreset: null,
butterchurn: null,
- isFullscreen: false,
- desktop: false
+ isFullscren: false
};
}
isHidden() {
- return this.state.desktop;
+ return this.props.desktop;
}
async componentDidMount() {
@@ -68,16 +67,6 @@ class PresetsLoader extends React.Component {
this.setState({ isFullscreen: screenfull.isFullscreen });
};
- _toggleDesktop = () => {
- if (this.state.desktop) {
- this.props.showWindow();
- this.setState({ desktop: false });
- } else {
- this.props.hideWindow();
- this.setState({ desktop: true });
- }
- };
-
_handleRequestFullsceen = () => {
if (screenfull.enabled) {
if (!screenfull.isFullscreen) {
@@ -115,7 +104,7 @@ class PresetsLoader extends React.Component {
}
render() {
- if (this.state.desktop) {
+ if (this.props.desktop) {
const size = { width: window.innerWidth, height: window.innerHeight };
return (
)}
>
@@ -143,8 +132,8 @@ class PresetsLoader extends React.Component {
)}
>
@@ -212,13 +201,13 @@ async function fetchPreset(presetUrl, { isButterchurn }) {
const mapStateToProps = state => ({
isEnabledVisualizer: Selectors.getVisualizerStyle(state) === WINDOWS.MILKDROP,
- playing: Selectors.getMediaIsPlaying(state)
+ playing: Selectors.getMediaIsPlaying(state),
+ desktop: Selectors.getMilkdropDesktopEnabled(state)
});
const mapDispatchToProps = dispatch => ({
closeWindow: () => dispatch(Actions.closeWindow(WINDOWS.MILKDROP)),
- hideWindow: () => dispatch(Actions.hideWindow(WINDOWS.MILKDROP)),
- showWindow: () => dispatch(Actions.showWindow(WINDOWS.MILKDROP))
+ toggleDesktop: () => dispatch(Actions.toggleMilkdropDesktop())
});
export default connect(
diff --git a/js/reducers/index.ts b/js/reducers/index.ts
index 86fd2118..ecefdae6 100644
--- a/js/reducers/index.ts
+++ b/js/reducers/index.ts
@@ -10,6 +10,7 @@ import equalizer from "./equalizer";
import network from "./network";
import settings from "./settings";
import tracks from "./tracks";
+import milkdrop from "./milkdrop";
const reducer = combineReducers({
userInput,
@@ -20,7 +21,8 @@ const reducer = combineReducers({
playlist,
media,
network,
- tracks
+ tracks,
+ milkdrop
});
export default reducer;
diff --git a/js/reducers/milkdrop.ts b/js/reducers/milkdrop.ts
new file mode 100644
index 00000000..f30e6590
--- /dev/null
+++ b/js/reducers/milkdrop.ts
@@ -0,0 +1,24 @@
+import { Action } from "../types";
+import { SET_MILKDROP_DESKTOP } from "../actionTypes";
+
+export interface MilkdropState {
+ desktop: boolean;
+}
+
+const defaultMilkdropState = {
+ desktop: false
+};
+
+export const milkdrop = (
+ state: MilkdropState = defaultMilkdropState,
+ action: Action
+): MilkdropState => {
+ switch (action.type) {
+ case SET_MILKDROP_DESKTOP:
+ return { ...state, desktop: action.enabled };
+ default:
+ return state;
+ }
+};
+
+export default milkdrop;
diff --git a/js/selectors.ts b/js/selectors.ts
index 6950f829..1fca5d6a 100644
--- a/js/selectors.ts
+++ b/js/selectors.ts
@@ -602,3 +602,7 @@ export function getDebugData(state: AppState) {
}
};
}
+
+export function getMilkdropDesktopEnabled(state: AppState): boolean {
+ return state.milkdrop.desktop;
+}
diff --git a/js/types.ts b/js/types.ts
index fdc0b5af..f253607d 100644
--- a/js/types.ts
+++ b/js/types.ts
@@ -6,6 +6,7 @@ import { DisplayState } from "./reducers/display";
import { WindowsState, WindowPositions } from "./reducers/windows";
import { EqualizerState } from "./reducers/equalizer";
import { NetworkState } from "./reducers/network";
+import { MilkdropState } from "./reducers/milkdrop";
import { SerializedStateV1 } from "./serializedStates/v1Types";
import { TracksState } from "./reducers/tracks";
import { IAudioMetadata, IOptions } from "music-metadata-browser";
@@ -438,7 +439,11 @@ export type Action =
| { type: "BROWSER_WINDOW_SIZE_CHANGED"; height: number; width: number }
| { type: "LOAD_DEFAULT_SKIN" }
| { type: "ENABLE_MEDIA_LIBRARY" }
- | { type: "ENABLE_MILKDROP"; open: boolean };
+ | { type: "ENABLE_MILKDROP"; open: boolean }
+ | {
+ type: "SET_MILKDROP_DESKTOP";
+ enabled: boolean;
+ };
export type MediaTagRequestStatus =
| "INITIALIZED"
@@ -543,6 +548,7 @@ export interface AppState {
media: MediaState;
network: NetworkState;
tracks: TracksState;
+ milkdrop: MilkdropState;
}
/**