Cancel long-press on mouseup, touchend

Fixes menu opening multiple times in different position when a user selects quickly and ends with a long-press.
This commit is contained in:
artisticMink
2023-11-08 15:18:53 +01:00
parent d144831569
commit b7b478eea8

View File

@ -399,7 +399,7 @@ class BulkEditOverlay {
* set a click event to hide the custom context menu. * set a click event to hide the custom context menu.
*/ */
enableContextMenu = () => { enableContextMenu = () => {
document.getElementById('rm_print_characters_block').addEventListener('contextmenu', this.handleContextMenuShow); document.getElementById(BulkEditOverlay.containerId).addEventListener('contextmenu', this.handleContextMenuShow);
document.addEventListener('click', this.handleContextMenuHide); document.addEventListener('click', this.handleContextMenuHide);
} }
@ -408,7 +408,7 @@ class BulkEditOverlay {
* menu to be opened. * menu to be opened.
*/ */
disableContextMenu = () => { disableContextMenu = () => {
document.getElementById('rm_print_characters_block').removeEventListener('contextmenu', this.handleContextMenuShow); document.getElementById(BulkEditOverlay.containerId).removeEventListener('contextmenu', this.handleContextMenuShow);
document.removeEventListener('click', this.handleContextMenuHide); document.removeEventListener('click', this.handleContextMenuHide);
} }
@ -420,17 +420,33 @@ class BulkEditOverlay {
} }
} }
/**
* Opens menu on long-press.
*
* @param event - Pointer event
*/
handleHold = (event) => { handleHold = (event) => {
if (0 !== event.button && event.type !== 'touchstart') return; if (0 !== event.button && event.type !== 'touchstart') return;
let cancel = false;
const container = document.getElementById(BulkEditOverlay.containerId);
const cancelHold = (event) => cancel = true;
container.addEventListener('mouseup', cancelHold);
container.addEventListener('touchend', cancelHold);
this.isLongPress = true; this.isLongPress = true;
setTimeout(() => { setTimeout(() => {
if (this.isLongPress) { if (this.isLongPress && !cancel) {
if (this.state === BulkEditOverlayState.browse) if (this.state === BulkEditOverlayState.browse)
this.selectState(); this.selectState();
else if (this.state === BulkEditOverlayState.select) else if (this.state === BulkEditOverlayState.select)
CharacterContextMenu.show(...this.#getContextMenuPosition(event)); CharacterContextMenu.show(...this.#getContextMenuPosition(event));
} }
container.removeEventListener('mouseup', cancelHold);
container.removeEventListener('touchend', cancelHold);
}, BulkEditOverlay.longPressDelay); }, BulkEditOverlay.longPressDelay);
} }