feat(annotator): show the loupe when selecting text in instant annotation, closes #3539 (#3565)

apps/readest-app/src/app/reader/utils/annotatorUtil.ts

@@ -1,6 +1,7 @@
 import { HIGHLIGHT_COLOR_HEX } from '@/services/constants';
 import { HighlightColor } from '@/types/book';
 import { SystemSettings } from '@/types/settings';
+import { Point } from '@/utils/sel';
 
 export const getHighlightColorHex = (
   settings: SystemSettings,
@@ -11,3 +12,32 @@ export const getHighlightColorHex = (
   const customColors = settings.globalReadSettings.customHighlightColors;
   return customColors?.[color] ?? HIGHLIGHT_COLOR_HEX[color];
 };
+
+export function getEffectiveLoupePoint(
+  loupePoint: Point | null,
+  externalDragPoint: Point | null | undefined,
+): Point | null {
+  return loupePoint ?? externalDragPoint ?? null;
+}
+
+export function getExternalDragHandle(
+  externalDragPoint: Point,
+  currentStart: Point,
+  currentEnd: Point,
+): 'start' | 'end' {
+  const distToStart = Math.hypot(
+    externalDragPoint.x - currentStart.x,
+    externalDragPoint.y - currentStart.y,
+  );
+  const distToEnd = Math.hypot(
+    externalDragPoint.x - currentEnd.x,
+    externalDragPoint.y - currentEnd.y,
+  );
+  return distToStart < distToEnd ? 'start' : 'end';
+}
+
+export function toParentViewportPoint(doc: Document, x: number, y: number): Point {
+  const frameElement = doc.defaultView?.frameElement;
+  const frameRect = frameElement?.getBoundingClientRect() ?? { top: 0, left: 0 };
+  return { x: x + frameRect.left, y: y + frameRect.top };
+}