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

expanded margin of position spots on gatekeeper; cleaned up #id_tray scripts & styles
Some checks failed
ci/woodpecker/push/woodpecker Pipeline failed
Details

Browse Source
This commit is contained in:
Disco DeDisco
2026-03-29 15:22:00 -04:00
parent 39db59c71a
commit 6c91ec0385
5 changed files with 184 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -71,29 +71,36 @@ var Tray = (function () {
if (_isLandscape()) {
// Landscape: the wrap slides on the Y axis.
// Structure (column-reverse): tray above, handle below.
// Tray has an explicit CSS height (80vh) so offsetHeight is real.
// Closed: wrap top = -(trayH) so tray is above viewport, handle at y=0.
// Open: wrap top = gearBtnTop - wrapH so handle bottom = gear btn top.
// Wrap height is fixed to gearBtnTop so the handle bottom always
// meets the gear button when open. Tray is flex:1 and fills the rest.
// Open: wrap top = 0 (pinned to viewport top).
// Closed: wrap top = -(gearBtnTop - handleH) = tray fully above viewport.
var gearBtn = document.getElementById('id_gear_btn');
var gearBtnTop = window.innerHeight;
if (gearBtn) {
gearBtnTop = Math.round(gearBtn.getBoundingClientRect().top);
}
var handleH = (_btn && _btn.offsetHeight) || 48;
var wrapH = (_wrap && _wrap.offsetHeight) || (handleH + 280);
var handleH = (_btn && _btn.offsetHeight) || 48;
// Pin wrap height so handle bottom = gear btn top when open.
if (_wrap) _wrap.style.height = gearBtnTop + 'px';
// Open: wrap pinned to viewport top.
_minTop = 0;
// Closed: tray hidden above viewport, handle visible at y=0.
_maxTop = -(wrapH - handleH);
// Open: handle bottom at gear btn top.
_minTop = gearBtnTop - wrapH;
_maxTop = -(gearBtnTop - handleH);
} else {
// Portrait: slide on X axis.
var rightPx = parseInt(getComputedStyle(_wrap).right, 10);
if (isNaN(rightPx)) rightPx = 0;
// Wrap width is pinned to viewportW (JS) so its right edge only
// reaches the viewport boundary when left = 0 (fully open).
// This mirrors landscape: the open edge appears only at the last moment.
// Open: left = 0 → wrap right = viewportW exactly.
// Closed: left = viewportW - handleW → tray fully off-screen right.
var handleW = _btn.offsetWidth || 48;
if (_wrap) _wrap.style.width = window.innerWidth + 'px';
_minLeft = 0;
_maxLeft = window.innerWidth - rightPx - handleW;
_maxLeft = window.innerWidth - handleW;
}
}
@@ -322,21 +329,39 @@ 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 = ''; }
if (_wrap) { _wrap.style.left = ''; _wrap.style.bottom = ''; _wrap.style.width = ''; }
_computeBounds();
_computeCellSize();
if (!_open && _wrap) _wrap.style.top = _maxTop + 'px';
// 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 {
// Switching to portrait: hide tray if closed.
if (!_open && _tray) _tray.style.display = 'none';
if (_wrap) _wrap.style.top = '';
if (_tray) _tray.style.display = 'none';
if (_wrap) { _wrap.style.top = ''; _wrap.style.height = ''; }
_computeBounds();
_applyVerticalBounds();
_computeCellSize();
if (!_open && _wrap) _wrap.style.left = _maxLeft + 'px';
// 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');
}
}
});
}
@@ -358,8 +383,10 @@ var Tray = (function () {
if (_btn) _btn.classList.remove('open');
if (_wrap) {
_wrap.classList.remove('wobble', 'snap', 'tray-dragging');
_wrap.style.left = '';
_wrap.style.top = '';
_wrap.style.left = '';
_wrap.style.top = '';
_wrap.style.height = '';
_wrap.style.width = '';
}
if (_onDocMove) {
document.removeEventListener('pointermove', _onDocMove);