Skip to content

fix(site): visible focus on selected filters, arrow keys stay in code blocks, pager polish #423

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
TMHSDigital merged 1 commit into from
Oct 5, 2026
Merged

fix(site): visible focus on selected filters, arrow keys stay in code blocks, pager polish #423

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 14 additions & 6 deletions docs/gallery/anvil/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
<link rel="preload" href="../../fonts/inter-medium.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="../../fonts/barlow-condensed-600.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="../../fonts/jetbrains-mono-regular.woff2" as="font" type="font/woff2" crossorigin />
<link rel="stylesheet" href="../gallery.css?v=40c1159600" />
<link rel="stylesheet" href="../gallery.css?v=64acd552f3" />
<script>document.documentElement.classList.add('js');</script>
</head>
<body>
Expand All @@ -48,7 +48,7 @@ <h1>Anvil</h1>
<p>A procedural blacksmith anvil on a timber stump through UVs, bake, LOD, collider, and Unity glTF, asserting recomputed budgets rather than an API contract.</p>
</header>
<main id="main">
<nav class="pager" aria-label="Showcase pieces"><a rel="prev" href="../wheelbarrow/" aria-label="Previous showcase piece: wheelbarrow"><span aria-hidden="true">&larr;</span> wheelbarrow</a><span class="pager-pos hud">14 of 76 showcase pieces<span class="pager-keys"> &middot; <kbd>&larr;</kbd><kbd>&rarr;</kbd></span></span><a rel="next" href="../water-trough/" aria-label="Next showcase piece: water-trough">water-trough <span aria-hidden="true">&rarr;</span></a></nav>
<nav class="pager" aria-label="Showcase pieces"><a rel="prev" href="../wheelbarrow/" aria-label="Previous showcase piece: wheelbarrow"><span aria-hidden="true">&larr;</span><span class="pager-label">wheelbarrow</span></a><span class="pager-pos hud">14 of 76 showcase pieces<span class="pager-keys"> &middot; <kbd>&larr;</kbd><kbd>&rarr;</kbd></span></span><a rel="next" href="../water-trough/" aria-label="Next showcase piece: water-trough"><span class="pager-label">water-trough</span><span aria-hidden="true">&rarr;</span></a></nav>
<button class="detail-hero" id="heroZoom" type="button" aria-label="View full size: A London-pattern forged anvil with a thick face block, tapered horn and broad flared foot on a hooped oak stand, a cross-peen hammer on the floor beside it.">
<img src="../assets/anvil-hero.webp" alt="A London-pattern forged anvil with a thick face block, tapered horn and broad flared foot on a hooped oak stand, a cross-peen hammer on the floor beside it." width="1280" height="720" fetchpriority="high" />
</button>
Expand All @@ -57,7 +57,7 @@ <h1>Anvil</h1>
<p class="taglist"><span class="tag">category</span> <a href="../#k=showcase&amp;c=village">Village</a></p>
<p class="taglist"><span class="tag">tags</span> <a href="../#tag=mesh">mesh</a> <a href="../#tag=export">export</a> <a href="../#tag=showcase">showcase</a></p>
<div class="runline">
<pre id="runCmd">blender --background --python showcase/anvil/anvil.py --</pre>
<pre id="runCmd" tabindex="0">blender --background --python showcase/anvil/anvil.py --</pre>
<button class="copy-btn" id="copyRun" type="button">Copy</button>
</div>
<nav class="jumpnav" aria-label="On this page"><span class="tag">jump to</span> <a href="#run">Run</a> <a href="#exit-codes">Exit codes</a> <a href="#source">Source</a> <a href="#related">Related</a></nav>
Expand Down Expand Up @@ -86,7 +86,7 @@ <h3 id="falsifiers">Falsifiers<a class="anchor" href="#falsifiers" aria-label="L
<p>Each violates one named budget. All seven were run on 4.5.11, 5.1.2 and 5.2.1 and returned the same code on each.</p>
<div class="table-wrap"><table><thead><tr><th scope="col">Flag</th><th scope="col">Budget violated</th><th scope="col">Exit</th></tr></thead><tbody><tr><td><code>--skip-decimate</code></td><td>LOD1 ratio band</td><td>9</td></tr><tr><td><code>--stray-vert</code></td><td>loose vertex count is 0</td><td>15</td></tr><tr><td><code>--lift-z</code></td><td>bounding box <code>zmin</code> is 0</td><td>16</td></tr><tr><td><code>--short-staves</code></td><td>named stave supports at Z=0</td><td>16</td></tr><tr><td><code>--float-anvil</code></td><td>foot-on-head gap</td><td>17</td></tr><tr><td><code>--round-band</code></td><td>hoop bite band</td><td>18</td></tr><tr><td><code>--round-waist</code></td><td>waist form</td><td>19</td></tr></tbody></table></div>
<h2 id="run">Run<a class="anchor" href="#run" aria-label="Link to this section">#</a></h2>
<pre><code>blender --background --python anvil.py --
<pre tabindex="0"><code>blender --background --python anvil.py --
blender --background --python anvil.py -- --skip-decimate
blender --background --python anvil.py -- --stray-vert
blender --background --python anvil.py -- --lift-z
Expand Down Expand Up @@ -139,7 +139,7 @@ <h3><a class="stretch" href="../wooden-barrel/">Wooden Barrel</a></h3>
</article>
</div>
</section>
<nav class="pager pager-foot" aria-label="Showcase pieces"><a rel="prev" href="../wheelbarrow/" aria-label="Previous showcase piece: wheelbarrow"><span aria-hidden="true">&larr;</span> wheelbarrow</a><span class="pager-pos hud">14 of 76 showcase pieces</span><a rel="next" href="../water-trough/" aria-label="Next showcase piece: water-trough">water-trough <span aria-hidden="true">&rarr;</span></a></nav>
<nav class="pager pager-foot" aria-label="Showcase pieces"><a rel="prev" href="../wheelbarrow/" aria-label="Previous showcase piece: wheelbarrow"><span aria-hidden="true">&larr;</span><span class="pager-label">wheelbarrow</span></a><span class="pager-pos hud">14 of 76 showcase pieces</span><a rel="next" href="../water-trough/" aria-label="Next showcase piece: water-trough"><span class="pager-label">water-trough</span><span aria-hidden="true">&rarr;</span></a></nav>
</main>
<dialog class="lightbox" id="lightbox" aria-label="Full-size render">
<div class="lightbox-bar"><button class="lightbox-close" id="lightboxNative" type="button" aria-pressed="false">Actual size</button><button class="lightbox-close" id="lightboxClose" type="button" autofocus>Close</button></div>
Expand Down Expand Up @@ -291,10 +291,18 @@ <h3><a class="stretch" href="../wooden-barrel/">Wooden Barrel</a></h3>

// Left/right arrows page between entries, but only when nothing has
// focus and nothing is selected: a focused control, a scrolled code
// block, or a text selection keeps its own arrow keys.
// block, or a text selection keeps its own arrow keys. A click inside a
// code block does not always move focus (or a selection), so also keep
// the arrows when the last click landed in one that scrolls sideways
// (#398).
var lastPointer = null;
document.addEventListener('pointerdown', function (e) { lastPointer = e.target; }, true);
document.addEventListener('keydown', function (e) {
if (e.ctrlKey || e.altKey || e.metaKey || e.shiftKey) return;
if (box && box.open) return;
var scroller = lastPointer && lastPointer.closest
&& lastPointer.closest('pre, .code-lines, .codewrap');
if (scroller && scroller.scrollWidth > scroller.clientWidth) return;
var ae = document.activeElement;
if (ae && ae !== document.body && ae !== document.documentElement) return;
var sel = window.getSelection && window.getSelection();
Expand Down
20 changes: 14 additions & 6 deletions docs/gallery/apothecary-shelf/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
<link rel="preload" href="../../fonts/inter-medium.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="../../fonts/barlow-condensed-600.woff2" as="font" type="font/woff2" crossorigin />
<link rel="preload" href="../../fonts/jetbrains-mono-regular.woff2" as="font" type="font/woff2" crossorigin />
<link rel="stylesheet" href="../gallery.css?v=40c1159600" />
<link rel="stylesheet" href="../gallery.css?v=64acd552f3" />
<script>document.documentElement.classList.add('js');</script>
</head>
<body>
Expand All @@ -48,7 +48,7 @@ <h1>Apothecary Shelf</h1>
<p>A procedural apothecary shelf — housed shelves, gallery rails, a drawer bank and an arched crest, stocked with fifteen lathed bottles, flasks and glazed jars, each corked or lidded and labelled — carried through UVs, bake, LOD, convex collider, and Unity glTF, asserting recomputed budgets rather than an API contract.</p>
</header>
<main id="main">
<nav class="pager" aria-label="Showcase pieces"><a rel="prev" href="../brazier/" aria-label="Previous showcase piece: brazier"><span aria-hidden="true">&larr;</span> brazier</a><span class="pager-pos hud">32 of 76 showcase pieces<span class="pager-keys"> &middot; <kbd>&larr;</kbd><kbd>&rarr;</kbd></span></span><a rel="next" href="../wooden-yoke/" aria-label="Next showcase piece: wooden-yoke">wooden-yoke <span aria-hidden="true">&rarr;</span></a></nav>
<nav class="pager" aria-label="Showcase pieces"><a rel="prev" href="../brazier/" aria-label="Previous showcase piece: brazier"><span aria-hidden="true">&larr;</span><span class="pager-label">brazier</span></a><span class="pager-pos hud">32 of 76 showcase pieces<span class="pager-keys"> &middot; <kbd>&larr;</kbd><kbd>&rarr;</kbd></span></span><a rel="next" href="../wooden-yoke/" aria-label="Next showcase piece: wooden-yoke"><span class="pager-label">wooden-yoke</span><span aria-hidden="true">&rarr;</span></a></nav>
<button class="detail-hero" id="heroZoom" type="button" aria-label="View full size: A stained wooden shelf with an arched crest, gallery rails and three brass-knobbed drawers, stocked with labelled glass bottles and flasks and cream and blue glazed jars.">
<img src="../assets/apothecary-shelf-hero.webp" alt="A stained wooden shelf with an arched crest, gallery rails and three brass-knobbed drawers, stocked with labelled glass bottles and flasks and cream and blue glazed jars." width="1280" height="720" fetchpriority="high" />
</button>
Expand All @@ -57,7 +57,7 @@ <h1>Apothecary Shelf</h1>
<p class="taglist"><span class="tag">category</span> <a href="../#k=showcase&amp;c=village">Village</a></p>
<p class="taglist"><span class="tag">tags</span> <a href="../#tag=mesh">mesh</a> <a href="../#tag=export">export</a> <a href="../#tag=showcase">showcase</a></p>
<div class="runline">
<pre id="runCmd">blender --background --python showcase/apothecary-shelf/apothecary_shelf.py --</pre>
<pre id="runCmd" tabindex="0">blender --background --python showcase/apothecary-shelf/apothecary_shelf.py --</pre>
<button class="copy-btn" id="copyRun" type="button">Copy</button>
</div>
<nav class="jumpnav" aria-label="On this page"><span class="tag">jump to</span> <a href="#exit-codes">Exit codes</a> <a href="#source">Source</a> <a href="#related">Related</a></nav>
Expand Down Expand Up @@ -90,7 +90,7 @@ <h2 id="exit-codes">Exit codes<a class="anchor" href="#exit-codes" aria-label="L
<p>File-local and sequential. <code>9</code> is a valid check code. <code>1</code> is the FATAL wrapper — a crash, never a named check. <code>19</code> (plumb and real-world size) is reserved across pieces and unused here.</p>
<div class="table-wrap"><table><thead><tr><th scope="col">Code</th><th scope="col">Meaning</th></tr></thead><tbody><tr><td>0</td><td>Success</td></tr><tr><td>1</td><td>Uncaught exception (FATAL wrapper)</td></tr><tr><td>2</td><td>argparse / usage</td></tr><tr><td>3</td><td>Mesh did not build, or has no UV layer</td></tr><tr><td>4</td><td>Base triangle count outside band</td></tr><tr><td>5</td><td>Material slots, or a material&#x27;s face floor</td></tr><tr><td>6</td><td>UVs outside 0..1</td></tr><tr><td>7</td><td>UV AABB overlap above tolerance</td></tr><tr><td>8</td><td>Outer AABB off declared size</td></tr><tr><td>9</td><td>LOD1 or LOD2 ratio outside band (<code>--skip-decimate</code>)</td></tr><tr><td>10</td><td>Framing gate (<code>examples/gallery_framing.py</code>, render path only)</td></tr><tr><td>11</td><td>Collider triangles above ceiling</td></tr><tr><td>12</td><td>Normal bake failed or produced no image data</td></tr><tr><td>13</td><td>glTF export missing or empty</td></tr><tr><td>14</td><td><code>--output</code> produced no file</td></tr><tr><td>15</td><td>Mesh hygiene (<code>--stray-vert</code>)</td></tr><tr><td>16</td><td>Grounded zmin, or a side floating (<code>--lift-z</code>, <code>--float-side</code>)</td></tr><tr><td>17</td><td>Dado, closure or knob bite (<code>--short-shelves</code>, <code>--pop-corks</code>, <code>--pull-knobs</code>)</td></tr><tr><td>18</td><td>Vessel, drawer or label seat (<code>--float-jars</code>, <code>--lift-drawers</code>, <code>--float-labels</code>)</td></tr><tr><td>20</td><td>Headroom under the member above (<code>--tall-flask</code>)</td></tr><tr><td>21</td><td>Vessels overlap each other or the carcass (<code>--crowd-jars</code>)</td></tr><tr><td>22</td><td>Form spread below floor (<code>--uniform-vessels</code>)</td></tr><tr><td>23</td><td>Right-angle wood edges (<code>--sharp-rail</code>)</td></tr><tr><td>24</td><td>Gallery asset-quality violation (render path; the floors&#x27; 11 is remapped here)</td></tr></tbody></table></div>
<h2 id="run-it">Run it<a class="anchor" href="#run-it" aria-label="Link to this section">#</a></h2>
<pre><code># Budget check, no render. ~4.5 s on 5.1 and 5.2.
<pre tabindex="0"><code># Budget check, no render. ~4.5 s on 5.1 and 5.2.
blender --background --python apothecary_shelf.py --

# Falsifier: the middle-shelf flask runs into the shelf above. Must exit 20.
Expand Down Expand Up @@ -144,7 +144,7 @@ <h3><a class="stretch" href="../wooden-barrel/">Wooden Barrel</a></h3>
</article>
</div>
</section>
<nav class="pager pager-foot" aria-label="Showcase pieces"><a rel="prev" href="../brazier/" aria-label="Previous showcase piece: brazier"><span aria-hidden="true">&larr;</span> brazier</a><span class="pager-pos hud">32 of 76 showcase pieces</span><a rel="next" href="../wooden-yoke/" aria-label="Next showcase piece: wooden-yoke">wooden-yoke <span aria-hidden="true">&rarr;</span></a></nav>
<nav class="pager pager-foot" aria-label="Showcase pieces"><a rel="prev" href="../brazier/" aria-label="Previous showcase piece: brazier"><span aria-hidden="true">&larr;</span><span class="pager-label">brazier</span></a><span class="pager-pos hud">32 of 76 showcase pieces</span><a rel="next" href="../wooden-yoke/" aria-label="Next showcase piece: wooden-yoke"><span class="pager-label">wooden-yoke</span><span aria-hidden="true">&rarr;</span></a></nav>
</main>
<dialog class="lightbox" id="lightbox" aria-label="Full-size render">
<div class="lightbox-bar"><button class="lightbox-close" id="lightboxNative" type="button" aria-pressed="false">Actual size</button><button class="lightbox-close" id="lightboxClose" type="button" autofocus>Close</button></div>
Expand Down Expand Up @@ -296,10 +296,18 @@ <h3><a class="stretch" href="../wooden-barrel/">Wooden Barrel</a></h3>

// Left/right arrows page between entries, but only when nothing has
// focus and nothing is selected: a focused control, a scrolled code
// block, or a text selection keeps its own arrow keys.
// block, or a text selection keeps its own arrow keys. A click inside a
// code block does not always move focus (or a selection), so also keep
// the arrows when the last click landed in one that scrolls sideways
// (#398).
var lastPointer = null;
document.addEventListener('pointerdown', function (e) { lastPointer = e.target; }, true);
document.addEventListener('keydown', function (e) {
if (e.ctrlKey || e.altKey || e.metaKey || e.shiftKey) return;
if (box && box.open) return;
var scroller = lastPointer && lastPointer.closest
&& lastPointer.closest('pre, .code-lines, .codewrap');
if (scroller && scroller.scrollWidth > scroller.clientWidth) return;
var ae = document.activeElement;
if (ae && ae !== document.body && ae !== document.documentElement) return;
var sel = window.getSelection && window.getSelection();
Expand Down
Loading
Loading