dvorakmortonxd/dvorakmortonxd.dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

clamp window dragging to the screen; drop the coloured per-app tiles in the taskbar

Browse source
This commit is contained in:
Martin Dvořák 2026-09-24 13:43:26 +00:00
commit 415f48f3f0
4 changed files with 24 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/app/components/WindowsDesktop.tsx
View file

@ -240,19 +240,23 @@ export default function WindowsDesktop() {
prev.map((w) => (w.id === id ? { ...w, maximized: !w.maximized } : w))
);
const moveWin = (id: number, x: number, y: number) => {
const maxX = (typeof window !== "undefined" ? window.innerWidth : 1280) - 120;
const maxY = (typeof window !== "undefined" ? window.innerHeight : 800) - TASKBAR_HEIGHT;
const vw = typeof window !== "undefined" ? window.innerWidth : 1280;
const vh = (typeof window !== "undefined" ? window.innerHeight : 800) - TASKBAR_HEIGHT;
setWins((prev) =>
prev.map((w) =>
w.id === id
? {
...w,
centered: false,
x: Math.max(-w.w + 120, Math.min(maxX, x)),
y: Math.max(0, Math.min(maxY, y)),
}
: w
)
prev.map((w) => {
if (w.id !== id) return w;
// Keep the whole window on-screen: no dragging it off any edge or under
// the panel. (max() guards the case where the window is bigger than the
// viewport, which the open/resize clamps normally prevent.)
const maxX = Math.max(0, vw - w.w);
const maxY = Math.max(0, vh - w.h);
return {
...w,
centered: false,
x: Math.max(0, Math.min(maxX, x)),
y: Math.max(0, Math.min(maxY, y)),
};
})
);
};
const resizeWin = (id: number, x: number, y: number, w: number, h: number) => {
@ -532,7 +536,7 @@ export default function WindowsDesktop() {
onClick={() => taskbarClick(w)}
title={app.title}
>
<span className="win-tb-btn-icon" style={{ background: app.color }}>
<span className="win-tb-btn-icon" aria-hidden="true">
{app.icon}
</span>
<span className="win-tb-btn-label">{app.title}</span>

4
src/app/skeuo.css
View file

@ -1441,10 +1441,10 @@ a.win-icon {
.win-tb-btn-icon {
width: 18px;
height: 18px;
border-radius: 4px;
display: grid;
place-items: center;
font-size: 11px;
font-size: 14px;
line-height: 1;
flex-shrink: 0;
}
.win-tb-btn-label {