diff --git a/js/components/WindowManager.js b/js/components/WindowManager.js index 6f5fd8a8..2a18a3d6 100644 --- a/js/components/WindowManager.js +++ b/js/components/WindowManager.js @@ -11,7 +11,7 @@ import { applyDiff, applyMultipleDiffs } from "../snapUtils"; -import { getWindowPositions } from "../selectors"; +import { getWindowsInfo } from "../selectors"; import { updateWindowPositions } from "../actionCreators"; import { WINDOW_HEIGHT, WINDOW_WIDTH } from "../constants"; @@ -25,8 +25,6 @@ const abuts = (a, b) => { class WindowManager extends React.Component { constructor(props) { super(props); - this.windowNodes = {}; - this.getRef = this.getRef.bind(this); this.handleMouseDown = this.handleMouseDown.bind(this); this.centerWindows = this.centerWindows.bind(this); } @@ -70,31 +68,8 @@ class WindowManager extends React.Component { this.props.updateWindowPositions(windowPositions); } - getRef(key, node) { - // If we are unmounting, the node might be null; - this.windowNodes[key] = node; - } - - // - getWindowNodes() { - return this.windowKeys() - .map(key => { - const node = this.windowNodes[key]; - return node && this.nodeInfo(node, key); - }) - - .filter(Boolean); - } - - nodeInfo(node, key) { - const child = node.childNodes[0]; - const { height, width } = child.getBoundingClientRect(); - const { offsetLeft, offsetTop } = node; - return { key, x: offsetLeft, y: offsetTop, height, width }; - } - movingAndStationaryNodes(key) { - const windows = this.getWindowNodes(); + const windows = this.props.windowsInfo; const targetNode = windows.find(node => node.key === key); let movingSet = new Set([targetNode]); @@ -188,21 +163,15 @@ class WindowManager extends React.Component { }; return (
- {this.windowKeys().map(key => { - const position = this.props.windowPositions[key]; - return ( - position && ( -
this.handleMouseDown(key, e)} - ref={node => this.getRef(key, node)} - style={{ ...style, left: position.x, top: position.y }} - key={key} - > - {this.props.windows[key]} -
- ) - ); - })} + {this.props.windowsInfo.map(w => ( +
this.handleMouseDown(w.key, e)} + style={{ ...style, left: w.x, top: w.y }} + key={w.key} + > + {this.props.windows[w.key]} +
+ ))}
); } @@ -214,7 +183,7 @@ WindowManager.propTypes = { }; const mapStateToProps = state => ({ - windowPositions: getWindowPositions(state) + windowsInfo: getWindowsInfo(state) }); const mapDispatchToProps = { diff --git a/js/selectors.js b/js/selectors.js index 4c5ce5d1..03b32f2e 100644 --- a/js/selectors.js +++ b/js/selectors.js @@ -296,18 +296,15 @@ export function getWindowSizes(state) { return { main, equalizer, playlist, ...genWindowSizes }; } -export const getWindowGraph = createSelector( - getWindowPositions, +export const getWindowsInfo = createSelector( getWindowSizes, - (windowPositions, windowSizes) => { - const windowData = []; - for (const key of Object.keys(windowPositions)) { - windowData.push({ key, ...windowPositions[key], ...windowSizes[key] }); - } - return generateGraph(windowData); - } + getWindowPositions, + (sizes, positions) => + Object.keys(sizes).map(key => ({ key, ...sizes[key], ...positions[key] })) ); +export const getWindowGraph = createSelector(getWindowsInfo, generateGraph); + export const getGenWindows = state => { return state.windows.genWindows; };