Saved in this browser. URL parameters such as ?quality=low&speed=2 override them for one visit.
Ink Bench: compare and score ink detection models against the published ink on a real winding.
'); let seen = false; try { seen = localStorage.getItem('unroll.benchHint') === '1'; localStorage.setItem('unroll.benchHint', '1'); } catch {} const b = $('btnBench'); if (!seen && b && S.inkBench) { const h = document.createElement('div'); h.className = 'ui-hint mono'; h.id = 'uiBenchHint'; h.setAttribute('role', 'status'); h.textContent = 'New: the Ink Bench scores ink detection models. Try it here.'; document.body.append(h); const r = b.getBoundingClientRect(); h.style.top = `${Math.max(8, innerWidth > 720 ? r.top : r.top - 52)}px`; h.style[innerWidth > 720 ? 'right' : 'left'] = innerWidth > 720 ? `${innerWidth - r.left + 10}px` : `${r.left}px`; setTimeout(() => h.remove(), 7000); } } function ready() { if ($('btnHelp') && window.unrollView && $('btnTear') && (!$('loader') || $('loader').classList.contains('gone'))) { build(); expose(); skipButton(); benchIntro(); tagApi(); urlActions(); setInterval(expose, 2000); } else setTimeout(ready, 60); } setTimeout(ready, 0); // after the whole module has run, so pwa (defined below) exists // ---------------------------------------------------------------- glossary (glossary.json), under About let GLOSS = []; const glossaryApi = { list: () => GLOSS.map((t) => ({ ...t })), get: (q) => { const s = String(q).toLowerCase(); return GLOSS.find((t) => t.id === s || t.term.toLowerCase() === s || t.aliases.some((a) => a.toLowerCase() === s)) || null; }, search: (q) => { const s = String(q || '').toLowerCase(); return GLOSS.filter((t) => (t.term + ' ' + t.aliases.join(' ') + ' ' + t.def).toLowerCase().includes(s)); }, open: (q) => openGlossary(q), json: () => JSON.stringify(GLOSS), }; uiApi.glossary = glossaryApi; (ACTIONS.glossary = { label: 'Open the glossary, optionally at a term', run: (q) => openGlossary(q) }); const escH = (s) => s.replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' }[c])); function openGlossary(q) { const ab = $('about'); if (!ab) return false; if (ab.hidden) $('btnInfo')?.click(); const g = $('uiGloss'); if (!g) return false; g.open = true; const t = q ? glossaryApi.get(q) : null; const el = t ? $(`g-${t.id}`) : $('uiGlossQ'); el?.scrollIntoView({ block: 'center' }); if (t) { el.classList.add('ui-flash'); setTimeout(() => el.classList.remove('ui-flash'), 1600); el.focus(); } else el?.focus(); return t ? t.id : true; } function buildGlossary() { const body = document.querySelector('#about .about-body'); if (!body || $('uiGloss')) return; const d = document.createElement('details'); d.id = 'uiGloss'; d.className = 'ui-gloss'; d.innerHTML = `Also at glossary.json and window.unrollView.glossary.
`; body.prepend(d); $('uiGlossQ').addEventListener('input', (e) => { const hit = new Set(glossaryApi.search(e.target.value).map((t) => t.id)); for (const dt of d.querySelectorAll('dt')) { const on = hit.has(dt.id.slice(2)); dt.hidden = !on; dt.nextElementSibling.hidden = !on; } }); const btn = document.createElement('p'); btn.innerHTML = ''; body.prepend(btn); $('uiGlossOpen').onclick = () => openGlossary(); tagApi(); } // dotted underline links from jargon in the page text to its glossary entry (every occurrence) function linkTerms(root, done = new Set()) { if (!root || !GLOSS.length) return; const pairs = GLOSS.flatMap((t) => [t.term, ...t.aliases].map((a) => [a, t])).filter(([a]) => a.length > 2).sort((a, b) => b[0].length - a[0].length); const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, { acceptNode: (n) => (n.parentElement.closest('a,button,select,option,kbd,code,summary,.ui-gloss,input,label') ? NodeFilter.FILTER_REJECT : NodeFilter.FILTER_ACCEPT) }); const nodes = []; while (walker.nextNode()) nodes.push(walker.currentNode); for (const n of nodes) { for (const [a, t] of pairs) { const re = new RegExp(`(^|[^\\w])(${a.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')})(?![\\w])`, 'i'); const m = re.exec(n.data); if (!m) continue; const at = m.index + m[1].length; const rest = n.splitText(at); const after = rest.splitText(m[2].length); const link = document.createElement('a'); link.className = 'ui-term'; link.href = `#g-${t.id}`; link.dataset.term = t.id; link.title = `${t.term}: ${t.def}`; link.textContent = rest.data; rest.replaceWith(link); return linkTerms(root, done); } } } function glossaryLinks() { for (const sel of ['#about .about-body > :not(.ui-gloss)', '#layerWhy p', '.hud.tl .lede', '#help .help-foot']) for (const el of document.querySelectorAll(sel)) linkTerms(el); const hint = $('layerHint'); if (hint) { let busy = false; const go = () => { if (busy) return; busy = true; linkTerms(hint); busy = false; }; new MutationObserver(() => queueMicrotask(go)).observe(hint, { childList: true }); go(); } document.addEventListener('click', (e) => { const a = e.target.closest?.('a.ui-term'); if (a) { e.preventDefault(); openGlossary(a.dataset.term); } }); } fetch('glossary.json?v=20261027one1').then((r) => r.json()).then((j) => { GLOSS = j.terms.slice().sort((a, b) => a.term.localeCompare(b.term)); const go = () => { if (!$('about') || !document.body.classList.contains('ui2')) return setTimeout(go, 200); buildGlossary(); glossaryLinks(); expose(); }; go(); }).catch((e) => console.warn('glossary', e)); // ---------------------------------------------------------------- install as an app (PWA) // sw.js is registered with the version and build sha from version.json in its URL, so each build gets its own caches. const pwa = { prompt: null, version: null, reg: null, standalone: () => matchMedia('(display-mode: standalone)').matches || matchMedia('(display-mode: fullscreen)').matches || navigator.standalone === true, framed: () => { try { return window.top !== window; } catch { return true; } }, ios: () => /iPad|iPhone|iPod/.test(navigator.userAgent) || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1), state() { if (this.standalone()) return 'installed'; if (this.prompt) return 'ready'; if (this.framed()) return 'framed'; if (this.ios()) return 'ios'; return 'unavailable'; }, canOffer() { return this.state() !== 'installed'; }, note() { return { installed: 'Running as an installed app. The default scroll works offline.', ready: 'Adds Unroll to your apps. The default scroll then works offline.', framed: 'Opens the app page in a new tab, where your browser can install it.', ios: 'In Safari: Share, then Add to Home Screen.', unavailable: 'Use your browser menu: Install app or Add to Home Screen.' }[this.state()]; }, paint() { const st = this.state(); for (const id of ['uiInstall', 'uiSetInstall']) { const b = $(id); if (!b) continue; b.hidden = st === 'installed' && id === 'uiInstall'; b.disabled = st === 'installed'; b.title = this.note(); } const n = $('uiInstallNote'); if (n) n.textContent = this.note() + (this.version ? ` Version ${this.version}.` : ''); }, async install() { const st = this.state(); if (st === 'installed') return 'installed'; if (st === 'ready') { const p = this.prompt; this.prompt = null; p.prompt(); const r = await p.userChoice.catch(() => ({ outcome: 'dismissed' })); this.paint(); return r.outcome; } if (st === 'framed') { window.open(location.href.split('#')[0], '_blank', 'noopener'); return 'opened'; } toggleSettings(true); this.paint(); $('uiInstallNote')?.focus?.(); return st; }, }; addEventListener('beforeinstallprompt', (e) => { e.preventDefault(); pwa.prompt = e; pwa.paint(); }); addEventListener('appinstalled', () => { pwa.prompt = null; pwa.paint(); }); if ('serviceWorker' in navigator && isSecureContext) { addEventListener('load', () => { fetch('version.json', { cache: 'no-store' }).then((r) => r.json()).then((v) => { pwa.version = v.version; pwa.paint(); const tag = v.sha ? `${v.version}-${v.sha}` : v.version; return navigator.serviceWorker.register(`sw.js?v=${encodeURIComponent(tag)}`, { scope: './' }); }).then((reg) => { pwa.reg = reg; }).catch((e) => console.warn('service worker', e)); }); }