Revert "Refactoring + removed unused API args"

This reverts commit 945c09d.
recogito · Nov 21, 2024 · 97ddea3 · 97ddea3
1 parent f2341c3
commit 97ddea3
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 18 deletions.
diff --git a/packages/text-annotator-react/src/TextAnnotationPopup/TextAnnotationPopup.tsx b/packages/text-annotator-react/src/TextAnnotationPopup/TextAnnotationPopup.tsx
@@ -2,6 +2,7 @@ import { ReactNode, useEffect, useMemo, useRef, useState } from 'react';
 import { useAnnotator, useSelection } from '@annotorious/react';
 import {
   NOT_ANNOTATABLE_CLASS,
+  denormalizeRectWithOffset,
   toDomRectList,
   type TextAnnotation,
   type TextAnnotator,
@@ -49,12 +50,6 @@ export interface TextAnnotationPopupContentProps {
 
 }
 
-const toViewportBounds = (annotationBounds: DOMRect, container: HTMLElement): DOMRect => {
-  const { left, top, right, bottom } = annotationBounds;
-  const containerBounds = container.getBoundingClientRect();
-  return new DOMRect(left + containerBounds.left, top + containerBounds.top, right - left, bottom - top);
-}
-
 export const TextAnnotationPopup = (props: TextAnnotationPopupProps) => {
 
   const r = useAnnotator<TextAnnotator>();
@@ -107,16 +102,17 @@ export const TextAnnotationPopup = (props: TextAnnotationPopupProps) => {
     if (isOpen && annotation?.id) {
       refs.setPositionReference({
         getBoundingClientRect: () => {
-          // Annotation bounds are relative to the document element
           const bounds = r.state.store.getAnnotationBounds(annotation.id);
           return bounds
-            ? toViewportBounds(bounds, r.element)
+            ? denormalizeRectWithOffset(bounds, r.element.getBoundingClientRect())
             : new DOMRect();
         },
         getClientRects: () => {
           const rects = r.state.store.getAnnotationRects(annotation.id);
-          const viewportRects = rects.map(rect => toViewportBounds(rect, r.element));
-          return toDomRectList(viewportRects);
+          const denormalizedRects = rects.map((rect) =>
+            denormalizeRectWithOffset(rect, r.element.getBoundingClientRect())
+          );
+          return toDomRectList(denormalizedRects);
         }
       });
     } else {

diff --git a/packages/text-annotator/src/state/TextAnnotationStore.ts b/packages/text-annotator/src/state/TextAnnotationStore.ts
@@ -13,7 +13,7 @@ export interface TextAnnotationStore<T extends TextAnnotation = TextAnnotation>
 
   getAnnotationRects(id: string): DOMRect[];
 
-  getAnnotationBounds(id: string): DOMRect | undefined;
+  getAnnotationBounds(id: string, hintX?: number, hintY?: number, buffer?: number): DOMRect | undefined;
 
   getAnnotationRects(id: string): DOMRect[];
 

diff --git a/packages/text-annotator/src/state/TextAnnotatorState.ts b/packages/text-annotator/src/state/TextAnnotatorState.ts
@@ -114,9 +114,18 @@ export const createTextAnnotatorState = <I extends TextAnnotation = TextAnnotati
     return all ? filtered : filtered[0];
   }
 
-  const getAnnotationBounds = (id: string): DOMRect | undefined => {
+  const getAnnotationBounds = (id: string, x?: number, y?: number, buffer = 5): DOMRect | undefined => {
     const rects = tree.getAnnotationRects(id);
     if (rects.length === 0) return;
+
+    if (x && y) {
+      const match = rects.find(({ top, right, bottom, left }) =>
+        x >= left - buffer && x <= right + buffer && y >= top - buffer && y <= bottom + buffer);
+
+      // Preferred bounds: the rectangle
+      if (match) return match;
+    }
+
     return tree.getAnnotationBounds(id);
   }
 

diff --git a/packages/text-annotator/src/state/spatialTree.ts b/packages/text-annotator/src/state/spatialTree.ts
@@ -1,7 +1,12 @@
 import RBush from 'rbush';
 import type { Store } from '@annotorious/core';
 import type { TextAnnotation, TextAnnotationTarget } from '../model';
-import { isRevived, reviveSelector, mergeClientRects } from '../utils';
+import {
+  isRevived,
+  reviveSelector,
+  mergeClientRects,
+  normalizeRectWithOffset
+} from '../utils';
 import type { AnnotationRects } from './TextAnnotationStore';
 
 interface IndexedHighlightRect {
@@ -37,11 +42,11 @@ export const createSpatialTree = <T extends TextAnnotation>(store: Store<T>, con
       return Array.from(revivedRange.getClientRects());
     });
 
-    const merged = mergeClientRects(rects)
-      // Offset the merged client rects so that coords
-      // are relative to the parent container
-      .map(({ left, top, right, bottom }) =>  
-        new DOMRect(left - offset.left, top - offset.top, right - left, bottom - top));
+    /**
+     * Offset the merged client rects so that coords
+     * are relative to the parent container
+     */
+    const merged = mergeClientRects(rects).map(rect => normalizeRectWithOffset(rect, offset));
 
     return merged.map(rect => {
       const { x, y, width, height } = rect;

diff --git a/packages/text-annotator/src/utils/normalizeRects.ts b/packages/text-annotator/src/utils/normalizeRects.ts
@@ -0,0 +1,9 @@
+export const normalizeRectWithOffset = (rect: DOMRect, offset: DOMRect): DOMRect => {
+  const { left, top, right, bottom } = rect;
+  return new DOMRect(left - offset.left, top - offset.top, right - left, bottom - top);
+};
+
+export const denormalizeRectWithOffset = (rect: DOMRect, offset: DOMRect): DOMRect => {
+  const { left, top, right, bottom } = rect;
+  return new DOMRect(left + offset.left, top + offset.top, right - left, bottom - top);
+}