diff --git a/js/components/App.js b/js/components/App.js
index 2f939283..6e199f3c 100644
--- a/js/components/App.js
+++ b/js/components/App.js
@@ -13,7 +13,6 @@ import WindowManager from "./WindowManager";
import MainWindow from "./MainWindow";
import PlaylistWindow from "./PlaylistWindow";
import EqualizerWindow from "./EqualizerWindow";
-import GenWindow from "./GenWindow";
import Skin from "./Skin";
import "../../css/webamp.css";
@@ -123,23 +122,16 @@ class App extends React.Component {
}
const Component = genWindowComponents[id];
return (
- this._gotRef(id, component)}
+ this._gotRef(id, component)}
title={w.title}
windowId={id}
- >
- {({ height, width }) => (
- this._emitter.on(id, listener)}
- analyser={media.getAnalyser()}
- isEnabledVisualizer={this.props.visualizerStyle === id}
- width={width}
- height={height}
- playing={this.props.status === "PLAYING"}
- close={() => this.props.closeWindow(id)}
- />
- )}
-
+ onFocusedKeyDown={listener => this._emitter.on(id, listener)}
+ analyser={media.getAnalyser()}
+ isEnabledVisualizer={this.props.visualizerStyle === id}
+ playing={this.props.status === "PLAYING"}
+ close={() => this.props.closeWindow(id)}
+ />
);
}
});
diff --git a/js/components/MilkdropWindow/MilkdropContextMenu.js b/js/components/MilkdropWindow/MilkdropContextMenu.js
index 4746dc4c..159156c4 100644
--- a/js/components/MilkdropWindow/MilkdropContextMenu.js
+++ b/js/components/MilkdropWindow/MilkdropContextMenu.js
@@ -8,6 +8,7 @@ const MilkdropContextMenu = props => (
label="Fullscreen"
hotkey="Alt+Enter"
/>
+
diff --git a/js/components/MilkdropWindow/index.js b/js/components/MilkdropWindow/index.js
index 7769cbd8..22d13187 100644
--- a/js/components/MilkdropWindow/index.js
+++ b/js/components/MilkdropWindow/index.js
@@ -1,6 +1,7 @@
import React from "react";
import screenfull from "screenfull";
import ContextMenuWrapper from "../ContextMenuWrapper";
+import GenWindow from "../GenWindow";
import MilkdropContextMenu from "./MilkdropContextMenu";
import Desktop from "./Desktop";
@@ -12,7 +13,7 @@ import "../../../css/milkdrop-window.css";
// This component is just responsible for loading dependencies.
// This simplifies the inner component, by allowing
-// it to alwasy assume that it has it's dependencies.
+// it to alwasy assume that it has its dependencies.
export default class PresetsLoader extends React.Component {
constructor() {
super();
@@ -24,6 +25,7 @@ export default class PresetsLoader extends React.Component {
};
this._handleFullscreenChange = this._handleFullscreenChange.bind(this);
this._handleRequestFullsceen = this._handleRequestFullsceen.bind(this);
+ this._enableDesktop = this._enableDesktop.bind(this);
}
async componentDidMount() {
@@ -52,6 +54,10 @@ export default class PresetsLoader extends React.Component {
this.setState({ isFullscreen: screenfull.isFullscreen });
}
+ _enableDesktop() {
+ this.setState({ desktop: true });
+ }
+
_handleRequestFullsceen() {
if (screenfull.enabled) {
if (!screenfull.isFullscreen) {
@@ -62,42 +68,55 @@ export default class PresetsLoader extends React.Component {
}
}
- render() {
+ _renderMilkdrop({ width, height }) {
const { butterchurn, presets } = this.state;
const loaded = butterchurn != null && presets != null;
-
- let size = { width: this.props.width, height: this.props.height };
- if (this.state.isFullscreen) {
- size = { width: screen.width, height: screen.height };
- } else if (this.state.desktop) {
- size = { width: window.innerWidth, height: window.innerHeight };
- }
-
- const milkdrop = loaded && (
-
- );
-
return (
- (
- (this._wrapperNode = node)}>
+ {loaded && (
+
)}
+
+ );
+ }
+
+ render() {
+ if (this.state.isFullscreen) {
+ const size = { width: screen.width, height: screen.height };
+ return this._renderMilkdrop(size);
+ } else if (this.state.desktop) {
+ const size = { width: window.innerWidth, height: window.innerHeight };
+ return {this._renderMilkdrop(size)};
+ }
+
+ return (
+
- (this._wrapperNode = node)}>
- {this.state.desktop ? {milkdrop} : milkdrop}
-
-
+ {({ height, width }) => (
+ (
+
+ )}
+ >
+ {this._renderMilkdrop({ width, height })}
+
+ )}
+
);
}
}