- New light UI: fixed 220px sidebar, single scrolling page, 8 named sections - Static files split by concern: style.css, app.js, loader.js, nav.js - Each page section is its own partial in static/sections/s-*.html - loader.js fetches all section partials in parallel, then loads app.js and nav.js - All original functionality, element IDs, and API endpoints preserved Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
37 lines
1.4 KiB
JavaScript
37 lines
1.4 KiB
JavaScript
(async function () {
|
|
'use strict';
|
|
|
|
const SECTIONS = ['s-voices', 's-clone', 's-design', 's-studio', 's-tryout', 's-routing', 's-connect', 's-settings'];
|
|
|
|
function loadScript(src) {
|
|
return new Promise(function (resolve, reject) {
|
|
var s = document.createElement('script');
|
|
s.src = src;
|
|
s.onload = resolve;
|
|
s.onerror = function () { reject(new Error('Failed to load ' + src)); };
|
|
document.body.appendChild(s);
|
|
});
|
|
}
|
|
|
|
// 1. Fetch all section partials in parallel and inject into their shells
|
|
await Promise.all(SECTIONS.map(async function (id) {
|
|
try {
|
|
var res = await fetch('/static/sections/' + id + '.html');
|
|
if (!res.ok) throw new Error(res.status + ' ' + res.statusText);
|
|
var html = await res.text();
|
|
var el = document.getElementById(id);
|
|
if (el) el.innerHTML = html;
|
|
} catch (e) {
|
|
console.error('[loader] section', id, 'failed:', e.message);
|
|
var el = document.getElementById(id);
|
|
if (el) el.innerHTML = '<p style="color:var(--red);padding:24px">Failed to load section <b>' + id + '</b>: ' + e.message + '</p>';
|
|
}
|
|
}));
|
|
|
|
// 2. Load main application logic (runs init immediately on parse — sections must exist first)
|
|
await loadScript('/static/app.js');
|
|
|
|
// 3. Apply scroll-based navigation overrides (must run after app.js defines switchTab etc.)
|
|
await loadScript('/static/nav.js');
|
|
})();
|