30:[] 2e:{"title":"Miscellany","cells":[{"id":0,"value":"Title = md`# Miscellany`","pinned":false,"hidden":false,"mode":"ojs"},{"id":38,"value":"md`\nThis notebook is a place for me to park odds and ends.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":43,"value":"md`\n* * *\n\nTo start, add some CSS for restyling math fonts.\n\nImport into another notebook by making two different cells:\n\n

${md`\n\\`\\`\\`js\n$css = html\\`\\${math_css}\\`\n\\`\\`\\`\n\n\\`\\`\\`js\nimport {math_css, $, $$} with {$css as $css} from \"@jrus/misc\"\n\\`\\`\\`\n`}

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"math_css = `\n`","pinned":true,"hidden":false,"mode":"ojs"},{"id":21,"value":"$$css = html`${math_css}`","pinned":true,"hidden":false,"mode":"ojs"},{"id":26,"value":"$$ = {\n $css;\n var $ = tex.options({trust: true});\n $.options = (opts) => tex.options(Object.assign({trust: true}, opts));\n return $;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":28,"value":"$$$ = $css, tex.options({displayMode: true, trust: true})","pinned":true,"hidden":false,"mode":"ojs"},{"id":75,"value":"md`\n* * *\n\nNow a wrapper to rescale rendered LaTeX formulas for small screens:\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"responsive_katex = (cell_invalidation, katex_root) => {\n const div = html`

${katex_root}`;\n div.style.transformOrigin = `top left`;\n\n const width_updates = width_observer();\n cell_invalidation.then(() => width_updates.return());\n \n (async function (){\n // wait for the content to render before measuring size\n await new Promise(callback => requestAnimationFrame(callback));\n const katex_width = [...katex_root.querySelectorAll('.katex-html .base')]\n .reduce((acc, elem) => acc + elem.getBoundingClientRect().width, 0);\n const katex_height = katex_root.getBoundingClientRect().height;\n\n // listen to changes in width and rescale as necessary.\n for await (const width of width_updates) {\n const scale = Math.min(width/katex_width, 1);\n const vertical_gap = (1-scale)*katex_height;\n div.style.transform = `scale(${scale})`;\n div.style.marginBottom = `-${vertical_gap}px`;\n }\n })();\n \n return div;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":66,"value":"width_observer = () => Generators.observe(callback => {\n let current_width, previous_width; \n const resized = () => {\n if ((current_width = document.body.clientWidth) !== previous_width)\n callback(previous_width = current_width); };\n resized(), window.addEventListener('resize', resized);\n return () => window.removeEventListener('resize', resized);\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":207,"value":"md`\n* * *\n\nDetect the [endianness](https://en.wikipedia.org/wiki/Endianness) of the platform. On little endian platforms, \\`little_endian == 1\\`; on big endian platforms, \\`little_endian == 0\\`.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":211,"value":"little_endian = new Int8Array(new Int16Array([0x0001]).buffer)[0];","pinned":true,"hidden":false,"mode":"ojs"},{"id":100,"value":"md`* * *\n\nDetect if the notebook is being rendered by the Observable thumbnail daemon:\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":103,"value":"thumbnail_daemon = navigator.userAgent.match('HeadlessChrome')","pinned":true,"hidden":false,"mode":"ojs"},{"id":110,"value":"md`\n* * *\n\nWrap animation boilerplate.\nIf the thumbnail daemon is looking, just draw one frame then bail.\nOtherwise, start requesting animation frames and drawing frames.\n\nIf the element scrolls entirely out of view or if the calling cell was disposed, stop animating.\n\nIf the element scrolls (even the tiniest bit) back into view, start animating again.\n\nReturn the element.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":113,"value":"animate = {\n intersection_observer_polyfill;\n return function animate(element, cell_invalidation, drawframe) {\n if (thumbnail_daemon) { drawframe(+new Date); return element }\n let frame, tick, cleanup, intersect;\n tick = function tick(timestamp) { drawframe(timestamp); frame = requestAnimationFrame(tick); }\n cleanup = function cleanup() { cancelAnimationFrame(frame); };\n intersect = function intersect(entries) {\n for (let e of entries) e.isIntersecting ? tick(+new Date) : cleanup(); }\n new IntersectionObserver(intersect).observe(element);\n cell_invalidation.then(cleanup);\n tick();\n return element;\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":115,"value":"intersection_observer_polyfill = {\n if (window.IntersectionObserver)\n return html`

native IntersectionObserver`;\n  \n  await require('intersection-observer@0.9/intersection-observer.js').catch(\n    () => window[\"IntersectionObserver\"])\n  return html`polyfilled IntersectionObserver`;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":173,"value":"IntersectionObserver = {\n  intersection_observer_polyfill;\n  return window.IntersectionObserver; }","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}