fix(layout): Phase-5-Review — off-screen-Clamp, Drag-Cleanup, Blur-Position, Import-pos
- Render + neuer debounced Resize-Handler clampen --board-x/y gegen den
aktuellen Viewport: ein auf breiterem Fenster platziertes Board rendert
nie mehr off-screen (und damit per Drag unerreichbar). board.pos bleibt
unveraendert, bei spaeterer Verbreiterung wird die Originalposition erreicht.
- drag.js: cleanup() + pointercancel-Listener. Die Klasse .board.dragging
klebte bei Touch-Interrupt/Browser-Geste sonst dauerhaft und legte den
app.js-Sync-Guard (Quick-Save-Render) still.
- main.css: '.board.blurred { position: relative }' entfernt — lag im
utilities-Layer und schlug das absolute Free-Layout (geblurrtes Board fiel
aus seiner Position + war nicht mehr drag-bar).
- data.js: board.pos wird beim JSON-Import durchgereicht (safePos-Validierung
via Number.isFinite), sonst Verlust des frei gesetzten Layouts beim Restore.
This commit is contained in:
@@ -27,6 +27,7 @@ async function init() {
|
||||
bindGlobalEvents();
|
||||
bindSettingsEvents();
|
||||
bindStorageSync();
|
||||
bindBoardResizeReclamp(); // Boards bei Fenster-Verkleinerung wieder in den sichtbaren Bereich holen
|
||||
await drainQuickSavePending(); // beim Start angesammelte Quick-Saves (kein Tab war offen) einlesen
|
||||
initSearch();
|
||||
initPalette();
|
||||
@@ -282,4 +283,20 @@ function bindStorageSync() {
|
||||
});
|
||||
}
|
||||
|
||||
// Freies Layout (LAYOUT-04): Boards stehen absolut positioniert. Schrumpft das Fenster, koennen
|
||||
// sie ganz aus dem sichtbaren Bereich rutschen. renderBoards() klemmt die --board-x/--board-y jedes
|
||||
// Boards beim Aufbau gegen die aktuelle Viewport — ein simpler Re-Render holt sie also zurueck.
|
||||
// Debounce (150ms), damit kontinuierliches Resizen nicht hunderte Renders ausloest. Waehrend eines
|
||||
// aktiven Drags NICHT neu rendern: renderBoards->replaceChildren wuerde den laufenden Drag abreissen.
|
||||
function bindBoardResizeReclamp() {
|
||||
let resizeTimer = null;
|
||||
window.addEventListener('resize', () => {
|
||||
clearTimeout(resizeTimer);
|
||||
resizeTimer = setTimeout(() => {
|
||||
if (document.querySelector('.board.dragging, .bm-item.dragging-source')) return;
|
||||
renderBoards();
|
||||
}, 150);
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
|
||||
Reference in New Issue
Block a user