Sakurai/pdf.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Editor] Disable pointer events in the parent layer while an editor is resized

Browse Source
This commit is contained in:
Calixte Denizet 2023-09-28 15:09:50 +02:00
parent f78a5ff79e
commit 4f6fa35a28
3 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/display/editor/annotation_editor_layer.js
View File

@ -193,12 +193,16 @@ class AnnotationEditorLayer {
this.#uiManager.addCommands(params); this.#uiManager.addCommands(params);
} }
togglePointerEvents(enabled = false) {
this.div.classList.toggle("disabled", !enabled);
}
/** /**
* Enable pointer events on the main div in order to enable * Enable pointer events on the main div in order to enable
* editor creation. * editor creation.
*/ */
enable() { enable() {
this.div.style.pointerEvents = "auto"; this.togglePointerEvents(true);
const annotationElementIds = new Set(); const annotationElementIds = new Set();
for (const editor of this.#editors.values()) { for (const editor of this.#editors.values()) {
editor.enableEditing(); editor.enableEditing();
@ -235,7 +239,7 @@ class AnnotationEditorLayer {
*/ */
disable() { disable() {
this.#isDisabling = true; this.#isDisabling = true;
this.div.style.pointerEvents = "none"; this.togglePointerEvents(false);
const hiddenAnnotationIds = new Set(); const hiddenAnnotationIds = new Set();
for (const editor of this.#editors.values()) { for (const editor of this.#editors.values()) {
editor.disableEditing(); editor.disableEditing();

2
src/display/editor/editor.js
View File

@ -628,6 +628,7 @@ class AnnotationEditor {
const savedDraggable = this._isDraggable; const savedDraggable = this._isDraggable;
this._isDraggable = false; this._isDraggable = false;
const pointerMoveOptions = { passive: true, capture: true }; const pointerMoveOptions = { passive: true, capture: true };
this.parent.togglePointerEvents(false);
window.addEventListener( window.addEventListener(
"pointermove", "pointermove",
boundResizerPointermove, boundResizerPointermove,
@ -643,6 +644,7 @@ class AnnotationEditor {
window.getComputedStyle(event.target).cursor; window.getComputedStyle(event.target).cursor;
const pointerUpCallback = () => { const pointerUpCallback = () => {
this.parent.togglePointerEvents(true);
this.#toggleAltTextButton(true); this.#toggleAltTextButton(true);
this._isDraggable = savedDraggable; this._isDraggable = savedDraggable;
window.removeEventListener("pointerup", pointerUpCallback); window.removeEventListener("pointerup", pointerUpCallback);

4
web/annotation_editor_layer_builder.css
View File

@ -121,6 +121,10 @@
height: 100%; height: 100%;
} }
.annotationEditorLayer.disabled {
pointer-events: none;
}
.annotationEditorLayer.freetextEditing { .annotationEditorLayer.freetextEditing {
cursor: var(--editorFreeText-editing-cursor); cursor: var(--editorFreeText-editing-cursor);
} }