nexoniarz/Fry3DX
Watch
1
0
Fork
You've already forked Fry3DX
 0
mirror of https://github.com/Nexoniarz/Fry3DX.git synced 2026-11-03 04:24:26 +00:00
Code Issues Projects Releases Packages Wiki Activity

Site: Niveus Continuity throughout — features in tabs that hand over left or right, screenshot tabs likewise, the bar's marker travelling to the section on screen, theme cross-fades; a Scripting section

Browse source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Nexoniarz 2026-10-20 17:10:53 +02:00
commit 87436019b3
4 changed files with 103 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

56
docs/site.js
View file

@ -47,14 +47,28 @@
$("why-title").textContent = F.why.title;
for (const p of F.why.text) $("why-text").append(el("p", "nv-body", p));
// ── Features ──
for (const f of F.features) {
const card = el("article", "nv-card feature");
const body = el("div", "nv-card__body");
body.append(icon(f.icon), el("h3", "nv-card__title", f.title), el("p", "nv-body nv-text-secondary", f.text));
card.append(body);
$("feature-grid").append(card);
}
// ── Features: a tab each group, the cards in its panel ──
F.featureGroups.forEach((g, i) => {
const tab = el("button", "nv-nav__item", g.title);
tab.id = `feature-tab-${g.id}`;
tab.tabIndex = i ? -1 : 0;
tab.setAttribute("role", "tab");
tab.setAttribute("aria-controls", `features-${g.id}`);
tab.setAttribute("aria-selected", String(i === 0));
$("feature-tabs").append(tab);
const panel = el("div", "nv-tab-panel features");
Object.assign(panel, { id: `features-${g.id}`, hidden: i !== 0 });
panel.setAttribute("role", "tabpanel");
panel.setAttribute("aria-labelledby", tab.id);
for (const f of F.features.filter((f) => f.group === g.id)) {
const card = el("article", "nv-card feature");
const body = el("div", "nv-card__body");
body.append(icon(f.icon), el("h3", "nv-card__title", f.title), el("p", "nv-body nv-text-secondary", f.text));
card.append(body);
panel.append(card);
}
$("feature-panels").append(panel);
});
// ── Screenshots: a tab each, the picture in a window ──
F.shots.forEach((s, i) => {
@ -169,6 +183,32 @@
addEventListener("scroll", onScroll, { passive: true });
onScroll();
// The bar's marker travels to the section on screen (Niveus Continuity: it moves there, it
// doesn't jump), forward or back by which way you went.
const links = [...document.querySelectorAll("#nav-list .nv-nav__item")];
const sections = links.map((a) => document.querySelector(a.getAttribute("href")));
let current = -1;
const mark = (i) => {
if (i === current) return;
const forward = i > current;
const update = () => links.forEach((a, j) => (j === i ? a.setAttribute("aria-current", "location") : a.removeAttribute("aria-current")));
current = i;
// (Not over another change that's still moving — a tab handing over: starting one skips it.)
const busy = document.documentElement.hasAttribute("data-nv-direction");
if (window.nv && !busy) nv.transition(update, { direction: forward ? "forward" : "backward", scope: $("nav-list") });
else update();
};
let queued = false;
const spy = () => {
queued = false;
const line = innerHeight * 0.35;
let at = -1;
sections.forEach((sec, i) => { if (sec && !sec.hidden && sec.getBoundingClientRect().top <= line) at = i; });
mark(at);
};
addEventListener("scroll", () => { if (!queued) queued = true, requestAnimationFrame(spy); }, { passive: true });
spy();
// A little Lua colouring for the scripting sample.
function highlightLua(src) {
const esc = (t) => t.replace(/&/g, "&amp;").replace(/</g, "&lt;");