Disable movement of Text Annotations but allow editing the text.

There might be cases when you want to disable movements (dragging and resizing) of text annotation but allow the user to edit the text. You can do this by using the following code:

Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
PSPDFKit.load(options).then(instance => {
 const stopPropagation = (event) => event.stopImmediatePropagation();

 instance.addEventListener("annotationSelection.change", (ann) => {
     if (ann && ann instanceof PSPDFKit.Annotations.TextAnnotation) {
       instance.contentDocument.addEventListener(
         "pointermove",
         stopPropagation,
         { capture: true }
       );
       instance.contentDocument.addEventListener("mousemove", stopPropagation, {
         capture: true
       });
       instance.contentDocument.addEventListener("touchmove", stopPropagation, {
         capture: true
       });

       instance.contentDocument.addEventListener("keydown", stopPropagation, {
         capture: true
       });
     } else {
       instance.contentDocument.removeEventListener(
         "pointermove",
         stopPropagation,
         { capture: true }
       );

       instance.contentDocument.removeEventListener(
         "mousemove",
         stopPropagation,
         {
           capture: true
         }
       );
       instance.contentDocument.removeEventListener(
         "touchmove",
         stopPropagation,
         {
           capture: true
         }
       );

       instance.contentDocument.removeEventListener("keydown", stopPropagation, {
         capture: true
       });
     }
   });
})

All the other annotations except the Text annotation will work as expected.

This has been tested with PSPDFKit for Web 2020.6.0