benmichael/gods-eye-view
1
0 Fork 0
mirror of https://github.com/bilawalsidhu/gods-eye-view.git synced 2026-11-05 02:44:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): floating windows stack above the docked rail panels

Browse Source 
A floating window restored after a reload had no z-index, and the z ladder
renumbered from 101, so the docked DISPLAY panel (#pp-toggles, z 110) painted
over it. The ladder now starts at 111 (PANEL_Z_FLOATING_FLOOR), a restored
window is promoted like a lifted one, docking drops the promotion, and
floating panels get a CSS floor of 111. Tests fail on the old code.

Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
Said TurkseverandClaude Opus 5.5 committed 2026-09-26 00:58:43 +01:00
1 parent e6c2c812f9
commit f7456f2436
3 files changed
+70 -1
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/ui/panelPositionControls.js
+13 -1
View File
@@ -12,6 +12,13 @@ const PANEL_POSITION_STORAGE_VERSION = 'v8';
/** Z ladder: panels promote within [100, 139]; voice pill 150, toast 200, clean-view-exit 300. */
const PANEL_Z_BASE = 100;
const PANEL_Z_MAX = 139;
/**
* Lowest z a promoted (dragged or floating) panel may take: above every panel
* docked in a rail, the highest of which is #pp-toggles at 110 (controls.css).
* Renumbering restarts here, so a floating window never slips under DISPLAY.
* Keep in step with `#right-context-rail > .panel-floating` in controls.css.
*/
const PANEL_Z_FLOATING_FLOOR = PANEL_Z_BASE + 11;
/** Pointer travel before a header press becomes a drag that lifts a portable panel out. */
const DRAG_THRESHOLD_PX = 4;
/**
@@ -37,6 +44,8 @@ const FLOATING_STYLE_PROPERTIES = [
'bottom',
'width',
'height',
// A docked panel takes the rail's stacking, not a floating window's.
'z-index',
];
function clamp(value, min, max) {
@@ -264,6 +273,9 @@ export class PanelPositionControls {
if (Boolean(pos.floating) !== Boolean(portable)) return;
if (portable) {
panelEl.classList.add('panel-floating', 'panel-draggable');
// A restored window must stack above the docked rail panels too, not
// only one that was lifted or clicked this session.
this._promotePanelZ(panelEl);
if (Number.isFinite(pos.width)) {
panelEl.style.width = `${clamp(
Math.round(pos.width),
@@ -337,7 +349,7 @@ export class PanelPositionControls {
const promoted = [...document.querySelectorAll('.panel-draggable')]
.filter((el) => el.style.zIndex)
.sort((a, b) => Number(a.style.zIndex) - Number(b.style.zIndex));
let z = PANEL_Z_BASE + 1;
let z = PANEL_Z_FLOATING_FLOOR;
for (const el of promoted) {
el.style.zIndex = String(z);
z += 1;