feat: add r2-naigator-js

build/demo/index.mjs

@@ -7,6 +7,7 @@ import { createCssSelectorMatcher } from "../vendor/apache-annotator/dom/css.js"
 import { normalizeRange } from "../vendor/apache-annotator/dom/normalize-range.js";
 import { toRange } from "../vendor/apache-annotator/dom/to-range.js";
 import { ownerDocument } from "../vendor/apache-annotator/dom/owner-document.js";
+import { convertRangeInfo, getCurrentSelectionInfo } from "r2-navigator-js/dist/es8-es2017/src/electron/renderer/webview/selection.js";
 import { finder } from "@medv/finder";
 import { makeRefinable } from "../vendor/apache-annotator/selector/refinable.js";
 import { anchor, cleanup } from "./highlight.mjs";
@@ -311,6 +312,7 @@ const selectorRangeXPathTextQuoteElem = document.getElementById("selector-out-ra
 const selectorElements = [selectorTextPositionElem, selectorTextPositionHypoElem, selectorTextQuoteElem, selectorTextQuoteHypoElem, selectorRangeElem, selectorTextFragment, selectorRangeCssTextPositionElem, selectorRangeCssTextQuoteElem, selectorRangeXPathTextPositionElem, selectorRangeXPathTextQuoteElem];
 const results = document.getElementById("results");
 const inputTextArea = document.getElementById("input");
+const selectorR2NavigatorJS = document.getElementById("selector-out-r2-navigator-js");
 const debounceOnSelectionChange = debounce(async function onSelectionChange() {
     const selection = document.getSelection();
     if (!selection)
@@ -456,6 +458,24 @@ const debounceOnSelectionChange = debounce(async function onSelectionChange() {
             console.log("highlight this Range: ", range);
             anchor(range, id);
         }
+        // r2-navigator-js
+        elem = selectorR2NavigatorJS;
+        try {
+            const r2Win = window;
+            r2Win.READIUM2 = {
+                DEBUG_VISUALS: false,
+            };
+            const r2NavSelector = getCurrentSelectionInfo(r2Win, (element) => finder(element), () => undefined, () => undefined);
+            const rangeInfo = r2NavSelector?.rangeInfo;
+            if (!rangeInfo)
+                throw new Error("no range found");
+            const range = convertRangeInfo(document, rangeInfo);
+            anchor(range, "r2-navigator-js");
+            elem.innerText = JSON.stringify(r2NavSelector, null, 4);
+        }
+        catch (e) {
+            elem.innerText = "r2-navigator-js error: " + e;
+        }
     }
 }, 500);
 document.addEventListener("selectionchange", debounceOnSelectionChange);

demo/index.mts

@@ -9,6 +9,9 @@ import { normalizeRange } from "../vendor/apache-annotator/dom/normalize-range.j
 import { toRange } from "../vendor/apache-annotator/dom/to-range.js";
 import { ownerDocument } from "../vendor/apache-annotator/dom/owner-document.js";
 
+import { convertRangeInfo, getCurrentSelectionInfo } from "r2-navigator-js/dist/es8-es2017/src/electron/renderer/webview/selection.js";
+import { type ReadiumElectronWebviewWindow } from "r2-navigator-js/dist/es8-es2017/src/electron/renderer/webview/state.js";
+
 import { finder } from "@medv/finder";
 
 import { makeRefinable } from "../vendor/apache-annotator/selector/refinable.js";
@@ -421,6 +424,7 @@ const selectorRangeXPathTextQuoteElem = document.getElementById("selector-out-ra
 const selectorElements = [selectorTextPositionElem, selectorTextPositionHypoElem, selectorTextQuoteElem, selectorTextQuoteHypoElem, selectorRangeElem, selectorTextFragment, selectorRangeCssTextPositionElem, selectorRangeCssTextQuoteElem, selectorRangeXPathTextPositionElem, selectorRangeXPathTextQuoteElem];
 const results = document.getElementById("results") as HTMLElement;
 const inputTextArea = document.getElementById("input") as HTMLTextAreaElement;
+const selectorR2NavigatorJS = document.getElementById("selector-out-r2-navigator-js") as HTMLElement;
 
 const debounceOnSelectionChange = debounce(async function onSelectionChange() {
   const selection = document.getSelection();
@@ -434,7 +438,6 @@ const debounceOnSelectionChange = debounce(async function onSelectionChange() {
   }
   console.log(`Selection Found: "${selection.toString()}"`);
 
-
   for (let i = 0; i < selection.rangeCount; i++) {
     const range = selection.getRangeAt(i);
     let selector: any;
@@ -575,6 +578,26 @@ const debounceOnSelectionChange = debounce(async function onSelectionChange() {
       console.log("highlight this Range: ", range);
       anchor(range, id);
     }
+
+
+    // r2-navigator-js
+
+    elem = selectorR2NavigatorJS;
+    try {
+      const r2Win: ReadiumElectronWebviewWindow = window as ReadiumElectronWebviewWindow;
+      r2Win.READIUM2 = {
+        DEBUG_VISUALS: false,
+      } as any;
+      const r2NavSelector = getCurrentSelectionInfo(r2Win, (element) => finder(element), () => undefined, () => undefined);
+      const rangeInfo = r2NavSelector?.rangeInfo;
+      if (!rangeInfo) throw new Error("no range found");
+      const range = convertRangeInfo(document, rangeInfo);
+      anchor(range, "r2-navigator-js");
+      elem.innerText = JSON.stringify(r2NavSelector, null, 4);
+    } catch (e) {
+      elem.innerText = "r2-navigator-js error: " + e; 
+    }
+
   }
 }, 500);
 document.addEventListener("selectionchange", debounceOnSelectionChange);

demo/index.xhtml

@@ -3991,6 +3991,10 @@
       <div>
         <pre id="results"></pre>
       </div>
+      <div>
+        <label for="selector-out-r2-navigator-js">R2-NAVIGATOR-JS :</label>
+        <pre id="selector-out-r2-navigator-js"></pre>
+      </div>
     </div>
   </div>