discoman/python-tdd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

z-index audit + aperture fill + resize:end debounce + landscape sig-grid cap
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
Details

Browse Source 
- #id_aperture_fill: position:fixed→absolute (clips to .room-page, avoids h2/navbar);
  z-index 105→90 (below blur backdrops at z-100); landscape override removed (inset:0 works both orientations)
- _base.scss: landscape footer z-index:100 (matches navbar); corrects unset z-index
- _room.scss: fix stale "navbar z-300" comment; landscape sig-deck-grid columns
  repeat(9,1fr)→repeat(9,minmax(0,90px)) to cap card size on wide viewports
- room.js: add resize:end listeners for scaleTable + sizeSigModal; new IIFE dispatches
  resize:end 500ms after resize stops so both functions re-measure settled layout
- tray.js: extract _reposition() from inline resize handler; wire to both resize and
  resize:end so tray repositions correctly after rapid resize or orientation change

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Disco DeDisco
2026-04-06 00:48:25 -04:00
parent e28d55ad58
commit 55bb450d27
5 changed files with 81 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/apps/epic/static/apps/epic/room.js
View File

@@ -17,7 +17,8 @@
} else {
scaleTable();
}
window.addEventListener('resize', scaleTable);
window.addEventListener('resize', scaleTable);
window.addEventListener('resize:end', scaleTable);
}());
(function () {
@@ -83,8 +84,20 @@
}
}
window.addEventListener('load', sizeSigModal);
window.addEventListener('resize', sizeSigModal);
window.addEventListener('load', sizeSigModal);
window.addEventListener('resize', sizeSigModal);
window.addEventListener('resize:end', sizeSigModal);
}());
// Dispatch a custom 'resize:end' event 500 ms after the last 'resize' fires.
// scaleTable, sizeSigModal, and Tray._reposition all subscribe to it so they
// re-measure with settled viewport dimensions after rapid resize sequences.
(function () {
var t;
window.addEventListener('resize', function () {
clearTimeout(t);
t = setTimeout(function () { window.dispatchEvent(new Event('resize:end')); }, 500);
});
}());
(function () {

74
src/apps/epic/static/apps/epic/tray.js
View File

@@ -290,6 +290,42 @@ var Tray = (function () {
}
}
// Force-close and reposition to settled bounds. Called on both 'resize'
// (snap without transition to avoid flicker during continuous events) and
// 'resize:end' (re-measures after the viewport has stopped moving).
function _reposition() {
_cancelPendingHide();
_open = false;
if (_btn) _btn.classList.remove('open');
if (_wrap) _wrap.classList.remove('wobble', 'snap', 'tray-dragging');
if (_isLandscape()) {
// Ensure tray is visible before measuring bounds.
if (_tray) _tray.style.display = 'grid';
if (_wrap) { _wrap.style.left = ''; _wrap.style.bottom = ''; _wrap.style.width = ''; }
_computeBounds();
_computeCellSize();
if (_wrap) {
_wrap.classList.add('tray-dragging');
_wrap.style.top = _maxTop + 'px';
void _wrap.offsetWidth; // flush reflow so position lands before transition restored
_wrap.classList.remove('tray-dragging');
}
} else {
if (_tray) _tray.style.display = 'none';
if (_wrap) { _wrap.style.top = ''; _wrap.style.height = ''; }
_computeBounds();
_applyVerticalBounds();
_computeCellSize();
if (_wrap) {
_wrap.classList.add('tray-dragging');
_wrap.style.left = _maxLeft + 'px';
void _wrap.offsetWidth; // flush reflow
_wrap.classList.remove('tray-dragging');
}
}
}
function init() {
_wrap = document.getElementById('id_tray_wrap');
_btn = document.getElementById('id_tray_btn');
@@ -403,42 +439,8 @@ var Tray = (function () {
};
_btn.addEventListener('click', _onBtnClick);
window.addEventListener('resize', function () {
// Always close on resize: bounds change invalidates current position.
// Cancel any in-flight close animation, then force-close state.
_cancelPendingHide();
_open = false;
if (_btn) _btn.classList.remove('open');
if (_wrap) _wrap.classList.remove('wobble', 'snap', 'tray-dragging');
if (_isLandscape()) {
// Ensure tray is visible before measuring bounds.
if (_tray) _tray.style.display = 'grid';
if (_wrap) { _wrap.style.left = ''; _wrap.style.bottom = ''; _wrap.style.width = ''; }
_computeBounds();
_computeCellSize();
// Snap to closed without transition (resize fires continuously).
if (_wrap) {
_wrap.classList.add('tray-dragging');
_wrap.style.top = _maxTop + 'px';
void _wrap.offsetWidth; // flush reflow so position lands before transition restored
_wrap.classList.remove('tray-dragging');
}
} else {
if (_tray) _tray.style.display = 'none';
if (_wrap) { _wrap.style.top = ''; _wrap.style.height = ''; }
_computeBounds();
_applyVerticalBounds();
_computeCellSize();
// Snap to closed without transition.
if (_wrap) {
_wrap.classList.add('tray-dragging');
_wrap.style.left = _maxLeft + 'px';
void _wrap.offsetWidth; // flush reflow
_wrap.classList.remove('tray-dragging');
}
}
});
window.addEventListener('resize', _reposition);
window.addEventListener('resize:end', _reposition);
}
// reset() — restores module state; used by Jasmine afterEach