tricu

output-reveal.ts (1837B)

---

 // Reveal only the start of a foreground result, never its whole (possibly huge)
 // box. Bounds are visual-viewport coordinates, accounting for the sticky toolbar.
 export function revealDelta(top: number, height: number, toolbarHeight: number, viewportTop: number, viewportHeight: number): number {
   const safeTop = viewportTop + toolbarHeight + 12;
   const bottom = viewportTop + viewportHeight - 12;
   if (bottom <= safeTop) return 0;
   const visibleStart = Math.min(64, height, bottom - safeTop);
   return top >= safeTop && top + visibleStart <= bottom ? 0 : top - safeTop;
 }
 
 export function outputReveal(toolbar: HTMLElement) {
   let armed = false, revision = 0;
   const cancel = (): void => { armed = false; revision++; };
   // A user who scrolls elsewhere during a slow run has chosen what to read.
   window.addEventListener('pagehide', cancel);
   window.addEventListener('wheel', cancel, { passive: true });
   window.addEventListener('touchmove', cancel, { passive: true });
   window.addEventListener('keydown', event => {
     if (['PageUp', 'PageDown', 'Home', 'End', 'ArrowUp', 'ArrowDown', ' '].includes(event.key)) cancel();
   });
   function reveal(target: HTMLElement): void {
     if (!armed) return;
     armed = false; const current = revision;
     requestAnimationFrame(() => {
       if (current !== revision || !matchMedia('(max-width:740px)').matches || target.closest('[inert]') || !target.getClientRects().length) return;
       const rect = target.getBoundingClientRect(), viewport = window.visualViewport;
       const delta = revealDelta(rect.top, rect.height, toolbar.getBoundingClientRect().height, viewport?.offsetTop ?? 0, viewport?.height ?? innerHeight);
       if (delta) window.scrollBy({ top: delta, behavior: 'instant' });
     });
   }
   return { arm(): void { cancel(); armed = true; }, cancel, reveal };
 }