Fixed unfocused windows not closing

This commit is contained in:
Prozilla 2023-08-06 13:53:46 +02:00
parent e223747795
commit 271338cc60
No known key found for this signature in database
GPG key ID: 5858DFE71CAF31EE

View file

@ -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>