live.js

880 B · javascript · 30 lines

1import { figures, units } from 'live:figures';23const still = matchMedia('(prefers-reduced-motion: reduce)').matches;45/* MOUNT */67async function mount(host) {8  try {9    const [figure, { play }] = await Promise.all([figures[host.dataset.live](), import('../lib/figure.js')]);10    await play(host, figure, (unit) => new URL(units[unit], import.meta.url));11  } catch {}12}1314/* WATCH */1516function watch() {17  const eye = new IntersectionObserver((entries) => {18    for (const entry of entries) {19      if (!entry.isIntersecting) continue;20      eye.unobserve(entry.target);21      mount(entry.target);22    }23  });24  for (const host of document.querySelectorAll('figure[data-live]')) if (Object.hasOwn(figures, host.dataset.live)) eye.observe(host);25}2627if (!still) {28  if (document.readyState === 'complete') watch();29  else window.addEventListener('load', watch, { once: true });30}