95e5f60747
The package's design system, layouts and interactions on our tokens and self-hosted fonts (site/site.css section 10), our facts, numbers, records and live services on every page. The home page: the GPU hero (site/hero-scene.js, continuous while in view, labelled as drawn), the live DAG panel on scenes/feed.js and live-dag.js 2.0.2, three reasons, the economics split, the download row with the OS marks, the ledger line. The miner page: the download layout, platform tabs stamped from the live download index with sha256, the steps, the card table, the fee section (the one source of /dev-fee), the FAQ. The wallet page in the package's wallet-hero layout, the window slot ready for the wallet redesign. The secondary pages rendered by the build from one source each: /claims and /randomx from the litepaper's sections, /dev-fee from the miner's fee section, /provenance from docs/provenance.md through the scrub, /journey from journey.json; /benchmarks rewrites to /miners, /connect redirects to /metamask. The generated pages (bench, bench table, ledger) restyled onto the page hero and the docs layout with a section filter. The footer's secondary links point at the real pages. The copy pass on every served page (docs/plans/site-copy-pass.md). The package's data tests and the hero loop test in the gate (tools/site-redesign). No sample data is served; the package's review chrome is not. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
41 lines
3.5 KiB
JavaScript
41 lines
3.5 KiB
JavaScript
/* Shared page behaviour for the redesign (7 Oct 2026): reveal-once on .reveal, the platform tabs on the download card,
|
|
a text filter over [data-filter-list] records, and a details element opened when its id is the hash. No routing, no
|
|
sample data, nothing that writes anywhere. */
|
|
(function () {
|
|
'use strict';
|
|
var reduced = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
// reveal once, no scroll hijack
|
|
var els = document.querySelectorAll('.reveal');
|
|
if (els.length && 'IntersectionObserver' in window && !reduced) {
|
|
var io = new IntersectionObserver(function (es) { es.forEach(function (e) { if (e.isIntersecting) { e.target.classList.add('visible'); io.unobserve(e.target); } }); }, { threshold: .06 });
|
|
els.forEach(function (el) { el.classList.add('will-reveal'); io.observe(el); });
|
|
}
|
|
// platform tabs: [role=tab][data-platform] buttons and [data-platform-panel] panels
|
|
var tabs = Array.prototype.slice.call(document.querySelectorAll('[role="tab"][data-platform]'));
|
|
function select(tab) {
|
|
tabs.forEach(function (t) { var on = t === tab; t.setAttribute('aria-selected', String(on)); t.setAttribute('tabindex', on ? '0' : '-1'); });
|
|
document.querySelectorAll('[data-platform-panel]').forEach(function (p) { p.hidden = p.getAttribute('data-platform-panel') !== tab.getAttribute('data-platform'); });
|
|
}
|
|
tabs.forEach(function (t) {
|
|
t.addEventListener('click', function () { select(t); });
|
|
t.addEventListener('keydown', function (e) { var i = tabs.indexOf(t), n = null; if (e.key === 'ArrowRight') n = tabs[(i + 1) % tabs.length]; if (e.key === 'ArrowLeft') n = tabs[(i - 1 + tabs.length) % tabs.length]; if (e.key === 'Home') n = tabs[0]; if (e.key === 'End') n = tabs[tabs.length - 1]; if (n) { e.preventDefault(); select(n); n.focus(); } });
|
|
});
|
|
if (tabs.length) { var pre = tabs.filter(function (t) { return t.getAttribute('aria-selected') === 'true'; })[0] || tabs[0]; select(pre); }
|
|
// a text filter and category chips over a list of records
|
|
document.querySelectorAll('[data-filter-list]').forEach(function (list) {
|
|
var input = document.querySelector('[data-filter-input="' + list.getAttribute('data-filter-list') + '"]'), chips = document.querySelectorAll('[data-filter-chip="' + list.getAttribute('data-filter-list') + '"]'), count = document.querySelector('[data-filter-count="' + list.getAttribute('data-filter-list') + '"]'), empty = document.querySelector('[data-filter-empty="' + list.getAttribute('data-filter-list') + '"]'), cat = '';
|
|
function apply() {
|
|
var q = (input ? input.value : '').trim().toLowerCase(), n = 0;
|
|
Array.prototype.forEach.call(list.children, function (el) { var ok = (!cat || el.getAttribute('data-category') === cat) && (!q || el.textContent.toLowerCase().indexOf(q) >= 0); el.hidden = !ok; if (ok) n++; });
|
|
if (count) count.textContent = n + ' of ' + list.children.length;
|
|
if (empty) empty.hidden = n > 0;
|
|
chips.forEach(function (c) { c.setAttribute('aria-pressed', String((c.getAttribute('data-category') || '') === cat)); });
|
|
}
|
|
if (input) input.addEventListener('input', apply);
|
|
chips.forEach(function (c) { c.addEventListener('click', function () { cat = c.getAttribute('data-category') || ''; apply(); }); });
|
|
apply();
|
|
});
|
|
// a details element named by the hash opens on arrival
|
|
function openHash() { var id = location.hash.slice(1); if (!id) return; var el = document.getElementById(id); if (el && el.tagName === 'DETAILS') el.open = true; }
|
|
window.addEventListener('hashchange', openHash); openHash();
|
|
})();
|