Description
Hello! Wondering about controlling selection behaviour from userland.
I am making an app that has different behaviours on selection when different keys are pressed, and needs to be able to conditionally select a group of related annotations when one of them are clicked, and toggle selection state of a single annotation without interfering with other annotations. Initially, looking at the interface of clickAnnotation
event here, I thought I would be able to retrieve whether modifier keys are pressed from the original event. However, it seems like clickAnnotation
is not implemented for @recogito/text-annotator
.
I then tried listening for DOM click events and checking whether they were on a range of an annotation:
document.querySelector('#annotator-target-example-6').addEventListener('click',(e) => {
let range,textNode,offset;
if (document.caretPositionFromPoint) {
range = document.caretPositionFromPoint(
e.clientX,
e.clientY,
);
textNode = range.offsetNode;
offset = range.offset;
} else if (document.caretRangeFromPoint) {
// Use WebKit-proprietary fallback method
range = document.caretRangeFromPoint(e.clientX, e.clientY);
textNode = range.startContainer;
offset = range.startOffset;
} else {
throw new Error('document.caretPositionFromPoint and document.caretRangeFromPoint are not supported');
}
let annotations = annotator.getAnnotations();
let annotationId = annotations.map((v) => [v.id, v.target.selector[0].range]).find(([k, r]) => { return r.isPointInRange(textNode, offset); })[0];
if (!annotationId) return;
if (e.altKey) {
let selectedIds = new Set(annotator.getSelected().map((a) => a.id));
if (selectedIds.has(annotationId)) {
selectedIds.delete(annotationId);
} else {
selectedIds.add(annotationId);
}
annotator.setSelected(
[...selectedIds]
)
} else {
annotator.setSelected(
[
annotationId
]
)
}
});
But it seems like internally, even with userSelectAction
set to UserSelectAction.NONE
, TextAnnotatorState
is calling userSelect
here:
Which in turn will either set the selected annotations to an empty array, or to a single one.
Is there any way around this? Would I need to maintain selection state in my own app or perhaps in an annotation's properties?