librelad d39852aa3d refactor(webui): reorganize into components/ + core/ taxonomy
Final modularization layout (user-chosen): every page is a self-contained
folder under components/<id>/ (controllers + CSS + its html fragment), and all
shared/framework code folds into core/:
  core/kernel  (feature-registry, lifecycle, services, spa)
  core/boot    (auth, system-loader/orchestrator, setup, loaders)
  core/lib     (data-loader, router, helpers, the task kernel, shared modules)
  core/ui      (topbar, modal, notifications, … + topbar.html)
  core/css     (all shared stylesheets)
  core/icons
Top level is now just: components/, core/, themes/, index.html (+ runtime data/).

Every path reference rewritten (index.html, scripts arrays, fetch()/
loadFragment()/loadScript() literals, system-loader + config-manager controller
paths, kernel manifest URL, feature.json, backend FEATURES_DIR). The
/api/features/list endpoint NAME is unchanged (it now scans components/).
Deleted 3 dead files (app-content.html, apps-content.html, html-cache.js).
Verified: 0 stale prefixes, 0 double-rewrites, all JS/JSON valid.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Signed-off-by: librelad <librelad@digitalangels.vip>
2026-05-30 07:13:52 +01:00

129 lines
6.2 KiB
HTML
Executable File

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LibrePortal - Modern Docker Management</title>
<link rel="icon" type="image/svg+xml" href="/core/icons/libreportal.svg">
<link rel="icon" type="image/x-icon" href="/core/icons/favicon.ico" sizes="any">
<link rel="apple-touch-icon" href="/core/icons/libreportal.svg">
<!-- Styles -->
<!-- Base token layer (theme-agnostic): --font-mono, --page-* identity hues -->
<link rel="stylesheet" href="/core/css/tokens.css">
<link rel="stylesheet" href="/core/css/themes.css">
<link rel="stylesheet" href="/core/css/loading-screen.css">
<link rel="stylesheet" href="/core/css/setup-wizard.css">
<link rel="stylesheet" href="/core/css/style.css">
<link rel="stylesheet" href="/components/admin/ip-whitelist.css">
<link rel="stylesheet" href="/components/apps/port-manager.css">
<link rel="stylesheet" href="/components/backup/backup.css">
<link rel="stylesheet" href="/components/admin/ssh.css">
<link rel="stylesheet" href="/components/admin/admin.css">
<link rel="stylesheet" href="/components/apps/services.css">
<link rel="stylesheet" href="/core/css/modal.css">
<link rel="stylesheet" href="/components/apps/tools.css">
<link rel="stylesheet" href="/components/apps/routing.css">
<link rel="stylesheet" href="/core/css/login.css">
<link rel="stylesheet" href="/core/css/aurora-background.css">
<link rel="stylesheet" href="/core/css/topbar.css">
<link rel="stylesheet" href="/core/css/sidebar.css">
<link rel="stylesheet" href="/components/apps/apps-layout.css">
<link rel="stylesheet" href="/components/apps/apps.css">
<link rel="stylesheet" href="/core/css/forms.css">
<link rel="stylesheet" href="/core/css/config.css">
<link rel="stylesheet" href="/components/apps/service-buttons.css">
<link rel="stylesheet" href="/components/dashboard/dashboard.css">
<link rel="stylesheet" href="/components/tasks/tasks.css">
<link rel="stylesheet" href="/components/updater/updater.css">
<link rel="stylesheet" href="/core/css/update-notifier.css">
<script>
// Inline data-theme bootstrap — runs before any rendering so the right
// palette tokens resolve on first paint. Synchronously injects a
// <link> to the saved theme's CSS (which lives at
// /themes/<name>/theme.css) so even the very first frame paints with
// the correct palette. ThemeRegistry below additionally <link>s every
// discovered theme so the dropdown can switch between them without
// another fetch.
(function () {
var legacy = localStorage.getItem('selectedTheme');
if (legacy && !localStorage.getItem('theme')) localStorage.setItem('theme', legacy);
if (legacy) localStorage.removeItem('selectedTheme');
var theme = localStorage.getItem('theme');
if (theme === 'dark' || theme === 'blue') theme = 'dark-blue';
if (!theme) theme = 'nebula';
localStorage.setItem('theme', theme);
document.documentElement.setAttribute('data-theme', theme);
// Synchronous <link> injection. Inserted via document.write so the
// parser blocks on this stylesheet — guarantees first paint has
// the palette tokens defined. Marked with data-theme-css="<name>"
// so ThemeRegistry can detect and skip duplicates.
document.write(
'<link rel="stylesheet" href="/themes/' + theme +
'/theme.css" data-theme-css="' + theme + '">'
);
})();
</script>
<script src="/core/boot/theme-registry.js"></script>
<script src="/core/boot/custom-select.js"></script>
<script src="/core/boot/custom-number.js"></script>
</head>
<body>
<!-- Topbar Container -->
<div id="topbar-container">
<!-- Topbar will be loaded here -->
</div>
<!-- Main Content Container -->
<main id="main-content" class="main">
<div id="app-content">
<!-- App content will be loaded here -->
</div>
</main>
<!-- Scripts -->
<!-- Auth must load first — gates all other initialization -->
<script src="/core/boot/auth-manager.js"></script>
<!-- Essential Bootstrap -->
<!-- LpUi runs first so body.lp-ui--advanced / lp-ui--dev are set
before any page/component renders → no FOUC of advanced sections. -->
<script src="/core/lib/lp-ui.js"></script>
<script src="/core/lib/dom-helpers.js"></script>
<script src="/core/lib/ui-helpers.js"></script>
<script src="/core/lib/router.js"></script>
<script src="/core/lib/data-loader.js"></script>
<script src="/core/lib/system-live.js"></script>
<script src="/core/lib/dismissible.js"></script>
<script src="/core/ui/eo-modal.js"></script>
<script src="/core/lib/task-refresh-coordinator.js"></script>
<script src="/components/dashboard/dashboard.js"></script>
<script src="/core/boot/system-loader.js"></script>
<script src="/core/boot/loading-ui.js"></script>
<script src="/core/boot/setup-detector.js"></script>
<script src="/core/boot/setup-wizard.js"></script>
<script src="/core/boot/setup-completion-watcher.js"></script>
<script src="/core/boot/system-orchestrator.js"></script>
<!-- Feature-module kernel. Currently passive: defines window.LP.features and
loads the page manifest; spa.js consults it for routing. See
docs/frontend-modularization.md. -->
<script src="/core/kernel/feature-registry.js"></script>
<script src="/core/kernel/services.js"></script>
<script src="/core/kernel/lifecycle.js"></script>
<!-- Feature modules are NOT listed here: the kernel loads each feature's
self-registering index.js from the manifest (features/manifest.dev.json)
before routing. Adding a page = drop a features/<id>/ folder + a manifest
entry, no index.html edit. Heavy controllers stay lazy (loaded by mount). -->
<!--
Page-specific controllers are loaded on demand by spa.js / config-manager.js
when the user navigates to the relevant route. Keeping them out of the
initial <script> block trims ~200 KB raw (~50 KB gzipped) off the cold-load
cost AND avoids parsing them up front on the dashboard, which most users
land on. Each handler's loadScript() call is idempotent — subsequent
navigations to the same route are free.
-->
<script src="/core/kernel/spa.js"></script>
</body>
</html>