Fix rect selection to work on vault background, not just entriesContainer
The entriesContainer has no padding so cards fill the grid edge-to-edge; there is no clickable empty space at the left/top/bottom of the card area within entriesContainer. Moved rect-selection initiation into the document-level mousedown handler so it fires when clicking on ANY non-interactive element inside .vault (padding, grid gaps, etc.). Interactive elements (buttons, inputs, folders bar, toolbar, etc.) still clear selection as expected.
This commit is contained in:
@@ -1141,27 +1141,27 @@ if (token && curUser) {
|
||||
}
|
||||
})();
|
||||
|
||||
// Click outside any entry card → clear selection
|
||||
// Document mousedown: rect selection on vault background, clear outside vault
|
||||
document.addEventListener('mousedown', function(e) {
|
||||
if (e.button !== 0 || rectState.active) return;
|
||||
if (e.target?.closest?.('.entry-card,.entry-row,.entry-compact,.table-row-drag,#batchBar,.custom-modal-overlay.show,.edit-modal.show,.modal-overlay.show,#genModal,#settingsMenu')) return;
|
||||
if (selectedIds.size > 0) clearSelection();
|
||||
});
|
||||
|
||||
// Rectangle selection
|
||||
document.getElementById('entriesContainer').addEventListener('mousedown', function(e) {
|
||||
if (rectState.active || e.button !== 0) return;
|
||||
if (e.target?.closest?.('[draggable="true"]') || e.target?.closest?.('.action-btns')) return;
|
||||
rectState.active = true;
|
||||
rectState.startX = e.clientX;
|
||||
rectState.startY = e.clientY;
|
||||
rectState.started = false;
|
||||
rectState.el = null;
|
||||
// Clear selection without full re-render to avoid detaching event target
|
||||
selectedIds.clear();
|
||||
lastSelectedId = null;
|
||||
hideBatchBar();
|
||||
document.getElementById('entriesContainer')?.querySelectorAll('.selected').forEach(el => el.classList.remove('selected'));
|
||||
if (e.target?.closest?.('button,input,select,.folders-bar,.toolbar,#trashActions,.settings-dropdown,.fab,.view-toggle,.auth-section')) {
|
||||
if (selectedIds.size > 0) clearSelection();
|
||||
return;
|
||||
}
|
||||
if (e.target?.closest?.('.vault')) {
|
||||
rectState.active = true;
|
||||
rectState.startX = e.clientX;
|
||||
rectState.startY = e.clientY;
|
||||
rectState.started = false;
|
||||
rectState.el = null;
|
||||
selectedIds.clear();
|
||||
lastSelectedId = null;
|
||||
hideBatchBar();
|
||||
document.getElementById('entriesContainer')?.querySelectorAll('.selected').forEach(el => el.classList.remove('selected'));
|
||||
} else if (selectedIds.size > 0) {
|
||||
clearSelection();
|
||||
}
|
||||
});
|
||||
document.addEventListener('mousemove', function(e) {
|
||||
if (!rectState.active) return;
|
||||
|
||||
Reference in New Issue
Block a user