@tekkare/romulus 0.1.234 → 0.1.235

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.16.0"
   },
-  "version": "0.1.233",
+  "version": "0.1.234",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/components/DocumentViewer.vue

@@ -24,7 +24,9 @@
   remonter dans une liste de resultats. Une liste cherche chaque terme
   separement ; une chaine, et tout ce que l'utilisateur tape ensuite, cherche
   une expression. La recherche ignore la casse et les accents, comme
-  `RmTextHighlight`.
+  `RmTextHighlight`. `anchor` vise un passage precis (l'extrait clique dans
+  une liste) : la lecture demarre sur la premiere occurrence de ce passage
+  plutot que sur la premiere du document (page HTML seulement).
 
   Le fichier est lu par `fetch` : il doit venir de la meme origine ou d'un
   serveur qui autorise CORS. Une app qui affiche des documents tiers les fait
@@ -37,12 +39,20 @@
 -->
 <script setup lang="ts">
 import { computed, nextTick, onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue'
+import { rmFoldSearchChar, rmFoldSearchQuery, rmLocateAnchor } from '../utils/documentSearch'
 
 const props = withDefaults(defineProps<{
   /** Adresse du document, lue par `fetch`. */
   src: string
   /** Terme(s) cherche(s) a l'ouverture. Une liste cherche chaque terme. */
   query?: string | readonly string[] | null
+  /**
+   * Passage a viser a l'ouverture : la premiere occurrence affichee est celle
+   * qui tombe dans ce passage (ou juste apres), pas la premiere du document.
+   * Un passage introuvable laisse la premiere. Page HTML seulement, sans
+   * effet sur un PDF.
+   */
+  anchor?: string | null
   /**
    * Adresse d'origine d'une page HTML servie par un proxy : sert de `<base>`
    * aux liens relatifs. Sans effet sur un PDF.
@@ -51,6 +61,7 @@ const props = withDefaults(defineProps<{
   lang?: 'fr' | 'en'
 }>(), {
   query: null,
+  anchor: null,
   base: null,
   lang: 'fr',
 })
@@ -98,8 +109,11 @@ const text = ref('')
 const terms = shallowRef<string[] | null>(null)
 const matches = ref({ current: 0, total: 0 })
 const pending = ref(false)
+/** `anchor` vaut tant que la recherche est celle de depart. */
+let anchored = true
 
 function seed() {
+  anchored = true
   const q = props.query
   if (Array.isArray(q)) {
     const list = q.map(x => String(x).trim()).filter(Boolean)
@@ -124,6 +138,7 @@ function find(type: '' | 'again' = '', findPrevious = false) {
 function onInput(event: Event) {
   text.value = (event.target as HTMLInputElement).value
   terms.value = null
+  anchored = false
   find()
 }
 
@@ -203,7 +218,7 @@ function destroy() {
 }
 
 watch(() => props.src, load)
-watch(() => props.query, () => {
+watch(() => [props.query, props.anchor], () => {
   seed()
   find()
 })
@@ -309,22 +324,6 @@ let index: { text: string, nodes: Text[], node: number[], offset: number[] } | n
 let ranges: Range[] = []
 let currentMatch = -1
 
-/** Un caractere, minuscule et sans accent, en un seul caractere. */
-function foldChar(char: string): string {
-  return char.normalize('NFD')[0]!.toLowerCase()[0]!
-}
-
-function foldQuery(value: string): string {
-  let out = ''
-  for (const char of value.trim()) {
-    if (/\s/.test(char)) {
-      if (!out.endsWith(' ')) out += ' '
-    }
-    else out += foldChar(char)
-  }
-  return out
-}
-
 function loadHtml(bytes: Uint8Array) {
   const html = new TextDecoder(charsetOf(bytes)).decode(bytes)
   // Couleurs du surlignage : l'iframe ne voit pas les jetons de la page, on
@@ -385,7 +384,7 @@ function indexHtml(doc: Document) {
         space = true
       }
       else {
-        out.text += foldChar(char)
+        out.text += rmFoldSearchChar(char)
         space = false
       }
       out.node.push(k)
@@ -402,7 +401,7 @@ function findHtml(type: '' | 'again', findPrevious: boolean) {
 
   if (type === '') {
     const queries = (Array.isArray(searched.value) ? searched.value : [searched.value])
-      .map(foldQuery)
+      .map(rmFoldSearchQuery)
       .filter(Boolean)
     const spans: [number, number][] = []
     for (const query of queries) {
@@ -413,16 +412,18 @@ function findHtml(type: '' | 'again', findPrevious: boolean) {
     // Dans l'ordre du document, sans chevauchement.
     spans.sort((a, b) => a[0] - b[0])
     ranges = []
+    const starts: number[] = []
     let end = -1
     for (const [start, stop] of spans) {
       if (start < end) continue
       end = stop
+      starts.push(start)
       const range = doc.createRange()
       range.setStart(index.nodes[index.node[start]!]!, index.offset[start]!)
       range.setEnd(index.nodes[index.node[stop - 1]!]!, index.offset[stop - 1]! + 1)
       ranges.push(range)
     }
-    currentMatch = ranges.length ? 0 : -1
+    currentMatch = ranges.length ? firstMatch(starts) : -1
   }
   else if (ranges.length) {
     currentMatch = (currentMatch + (findPrevious ? -1 : 1) + ranges.length) % ranges.length
@@ -448,6 +449,15 @@ function findHtml(type: '' | 'again', findPrevious: boolean) {
   }
 }
 
+/** La premiere occurrence du passage vise, la premiere du document sinon. */
+function firstMatch(starts: number[]): number {
+  if (!anchored || !props.anchor || !index) return 0
+  const at = rmLocateAnchor(index.text, props.anchor)
+  if (at === -1) return 0
+  const k = starts.findIndex(start => start >= at)
+  return k === -1 ? 0 : k
+}
+
 function destroyHtml() {
   frame.value?.contentDocument?.removeEventListener('keydown', onRootKeydown)
   index = null

package/dist/runtime/utils/documentSearch.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Recherche dans le texte d'un document (RmDocumentViewer) : repli du texte
+ * et reperage d'un passage.
+ *
+ * Le texte est replie caractere par caractere (minuscule, sans accent, un
+ * caractere pour un) et ses blancs fusionnes : une position dans le texte
+ * replie renvoie a un caractere du document.
+ */
+/** Un caractere, minuscule et sans accent, en un seul caractere. */
+export declare function rmFoldSearchChar(char: string): string;
+/** Une saisie, repliee comme le texte du document. */
+export declare function rmFoldSearchQuery(value: string): string;
+/**
+ * Position du passage `anchor` dans `text` (deja replie), -1 s'il n'y est pas.
+ *
+ * Le passage vient souvent d'une autre copie du texte (un index de recherche,
+ * une extraction) : une apostrophe, un tiret insecable ou un blanc peut
+ * differer. Faute de le retrouver d'un bloc, on cherche ses morceaux de
+ * quelques mots, dans l'ordre ; le premier retrouve situe le debut du passage.
+ */
+export declare function rmLocateAnchor(text: string, anchor: string): number;

package/dist/runtime/utils/documentSearch.js

@@ -0,0 +1,31 @@
+export function rmFoldSearchChar(char) {
+  return char.normalize("NFD")[0].toLowerCase()[0];
+}
+export function rmFoldSearchQuery(value) {
+  let out = "";
+  for (const char of value.trim()) {
+    if (/\s/.test(char)) {
+      if (!out.endsWith(" ")) out += " ";
+    } else out += rmFoldSearchChar(char);
+  }
+  return out;
+}
+const CHUNK_WORDS = 6;
+const CHUNK_MIN_LENGTH = 20;
+export function rmLocateAnchor(text, anchor) {
+  const folded = rmFoldSearchQuery(anchor);
+  if (!folded) return -1;
+  const whole = text.indexOf(folded);
+  if (whole !== -1) return whole;
+  const words = folded.split(" ");
+  let offset = 0;
+  for (let i = 0; i < words.length; i += CHUNK_WORDS) {
+    const chunk = words.slice(i, i + CHUNK_WORDS).join(" ");
+    if (chunk.length >= CHUNK_MIN_LENGTH) {
+      const at = text.indexOf(chunk);
+      if (at !== -1) return Math.max(0, at - offset);
+    }
+    offset += chunk.length + 1;
+  }
+  return -1;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/romulus",
-  "version": "0.1.234",
+  "version": "0.1.235",
   "description": "Romulus Design System - Nuxt module by Tekkare",
   "license": "MIT",
   "type": "module",