make screenshot cancellable via escape key, closes #37

This commit is contained in:
zadam 2022-02-19 19:37:23 +01:00
parent 20a4e2eb08
commit 66c8891fbb

View File

@ -59,6 +59,7 @@ function getRectangleArea() {
const messageComp = document.createElement('div'); const messageComp = document.createElement('div');
const messageCompWidth = 300; const messageCompWidth = 300;
messageComp.setAttribute("tabindex", "0"); // so that it can be focused
messageComp.style.position = 'fixed'; messageComp.style.position = 'fixed';
messageComp.style.opacity = '0.95'; messageComp.style.opacity = '0.95';
messageComp.style.fontSize = '14px'; messageComp.style.fontSize = '14px';
@ -89,6 +90,8 @@ function getRectangleArea() {
document.body.appendChild(selection); document.body.appendChild(selection);
messageComp.focus(); // we listen on keypresses on this element to cancel on escape
let isDragging = false; let isDragging = false;
let draggingStartPos = null; let draggingStartPos = null;
let selectionArea = {}; let selectionArea = {};
@ -126,9 +129,7 @@ function getRectangleArea() {
setSelectionSizeFromMouse(event); setSelectionSizeFromMouse(event);
} }
function selection_mouseUp(event) { function removeOverlay() {
setSelectionSizeFromMouse(event);
isDragging = false; isDragging = false;
overlay.removeEventListener('mousedown', selection_mouseDown); overlay.removeEventListener('mousedown', selection_mouseDown);
@ -138,6 +139,12 @@ function getRectangleArea() {
document.body.removeChild(overlay); document.body.removeChild(overlay);
document.body.removeChild(selection); document.body.removeChild(selection);
document.body.removeChild(messageComp); document.body.removeChild(messageComp);
}
function selection_mouseUp(event) {
setSelectionSizeFromMouse(event);
removeOverlay();
console.info('selectionArea:', selectionArea); console.info('selectionArea:', selectionArea);
@ -151,9 +158,17 @@ function getRectangleArea() {
setTimeout(() => resolve(selectionArea), 100); setTimeout(() => resolve(selectionArea), 100);
} }
function cancel(event) {
if (event.key === "Escape") {
removeOverlay();
}
}
overlay.addEventListener('mousedown', selection_mouseDown); overlay.addEventListener('mousedown', selection_mouseDown);
overlay.addEventListener('mousemove', selection_mouseMove); overlay.addEventListener('mousemove', selection_mouseMove);
overlay.addEventListener('mouseup', selection_mouseUp); overlay.addEventListener('mouseup', selection_mouseUp);
overlay.addEventListener('mouseup', selection_mouseUp);
messageComp.addEventListener('keydown', cancel);
}); });
} }
@ -265,7 +280,7 @@ async function prepareMessageResponse(message) {
}; };
} }
else if (message.name === 'trilium-save-screenshot') { else if (message.name === 'trilium-get-rectangle-for-screenshot') {
return getRectangleArea(); return getRectangleArea();
} }
else if (message.name === "trilium-save-page") { else if (message.name === "trilium-save-page") {