Fixed unfocused windows not closing
This commit is contained in:
parent
e223747795
commit
271338cc60
1 changed files with 15 additions and 9 deletions
|
|
@ -6,9 +6,9 @@ import { ReactSVG } from "react-svg";
|
||||||
import { useWindowsManager } from "../../hooks/windows/WindowsManagerContext.js";
|
import { useWindowsManager } from "../../hooks/windows/WindowsManagerContext.js";
|
||||||
import Draggable from "react-draggable";
|
import Draggable from "react-draggable";
|
||||||
import { useEffect, useRef, useState } from "react";
|
import { useEffect, useRef, useState } from "react";
|
||||||
// eslint-disable-next-line no-unused-vars
|
|
||||||
import Application from "../../features/applications/application.js";
|
import Application from "../../features/applications/application.js";
|
||||||
// eslint-disable-next-line no-unused-vars
|
|
||||||
import Vector2 from "../../features/math/vector2.js";
|
import Vector2 from "../../features/math/vector2.js";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -42,10 +42,19 @@ export function Window({ id, app, size, position, focused = false, onInteract, o
|
||||||
resizeObserver.observe(document.getElementById("root"));
|
resizeObserver.observe(document.getElementById("root"));
|
||||||
});
|
});
|
||||||
|
|
||||||
const close = () => {
|
const close = (event) => {
|
||||||
|
event.preventDefault();
|
||||||
windowsManager.close(id);
|
windowsManager.close(id);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const focus = (event) => {
|
||||||
|
if (event.defaultPrevented)
|
||||||
|
return;
|
||||||
|
|
||||||
|
if ((event.target.closest(".Handle") == null || event.target.closest("button") == null))
|
||||||
|
onInteract(event);
|
||||||
|
};
|
||||||
|
|
||||||
const classNames = [styles["Window-container"]];
|
const classNames = [styles["Window-container"]];
|
||||||
if (maximized)
|
if (maximized)
|
||||||
classNames.push(styles.Maximized);
|
classNames.push(styles.Maximized);
|
||||||
|
|
@ -68,7 +77,7 @@ export function Window({ id, app, size, position, focused = false, onInteract, o
|
||||||
cancel="button"
|
cancel="button"
|
||||||
nodeRef={nodeRef}
|
nodeRef={nodeRef}
|
||||||
disabled={maximized}
|
disabled={maximized}
|
||||||
onMouseDown={onInteract}
|
onMouseDown={focus}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
className={classNames.join(" ")}
|
className={classNames.join(" ")}
|
||||||
|
|
@ -77,10 +86,7 @@ export function Window({ id, app, size, position, focused = false, onInteract, o
|
||||||
width: maximized ? null : size.x,
|
width: maximized ? null : size.x,
|
||||||
height: maximized ? null : size.y,
|
height: maximized ? null : size.y,
|
||||||
}}
|
}}
|
||||||
onClick={(event) => {
|
onClick={focus}
|
||||||
if (!event.defaultPrevented)
|
|
||||||
onInteract(event);
|
|
||||||
}}
|
|
||||||
>
|
>
|
||||||
<div className={`${styles.Header} Handle`}>
|
<div className={`${styles.Header} Handle`}>
|
||||||
<ReactSVG className={styles["Window-icon"]} src={process.env.PUBLIC_URL + `/media/applications/icons/${app.id}.svg`}/>
|
<ReactSVG className={styles["Window-icon"]} src={process.env.PUBLIC_URL + `/media/applications/icons/${app.id}.svg`}/>
|
||||||
|
|
@ -91,7 +97,7 @@ export function Window({ id, app, size, position, focused = false, onInteract, o
|
||||||
<button title="Maximize" onClick={() => setMaximized(!maximized)}>
|
<button title="Maximize" onClick={() => setMaximized(!maximized)}>
|
||||||
<FontAwesomeIcon icon={faSquare}/>
|
<FontAwesomeIcon icon={faSquare}/>
|
||||||
</button>
|
</button>
|
||||||
<button title="Close" onClick={close}>
|
<button title="Close" id="close-window" onClick={close}>
|
||||||
<FontAwesomeIcon icon={faXmark}/>
|
<FontAwesomeIcon icon={faXmark}/>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue