naturallaw777andarena-agent
2622223033
Single source of truth (static/js/domain-prereqs.js) for the domain
prerequisite instructions so all three surfaces read identically:
- Server + Desktop first-boot onboarding wizard (step 3)
- Lightning Wallet Connections (NWC) enable modal (Node-only mode)
- BTCPay Server (web) enable modal (Node-only mode)
Both feature-enable flows share openDomainSetupModal(), which now drops
its role-branched intro and 'Option A/B' blocks in favor of the shared
renderers. All surfaces now consistently cover:
1. A domain from Njal.la (account, subdomain-vs-separate-domain,
Dynamic record with host-part-only Name field, auto-filled IP,
DDNS curl command)
2. Router access — forward ports 80 & 443 (TCP) to this computer's
internal IP, once, for HTTPS/SSL (with CGNAT note)
3. How to get Njal.la working, step by step
The reconfigure/troubleshooting modal gains the same router reminder,
since 'domain not reachable' is often the port forwarding rather than
DNS. domain-prereqs.js is loaded via asset_version cache busting and
ships automatically (installPhase copies the package wholesale).
Co-authored-by: arena-agent <297053741+arena-agent@users.noreply.github.com>
176 lines
8.2 KiB
HTML
176 lines
8.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Sovran_SystemsOS — First-Boot Setup</title>
|
|
<link rel="stylesheet" href="/static/css/base.css" />
|
|
<link rel="stylesheet" href="/static/css/buttons.css" />
|
|
<link rel="stylesheet" href="/static/css/header.css" />
|
|
<link rel="stylesheet" href="/static/css/layout.css" />
|
|
<link rel="stylesheet" href="/static/css/tiles.css" />
|
|
<link rel="stylesheet" href="/static/css/modals.css" />
|
|
<link rel="stylesheet" href="/static/css/features.css" />
|
|
<link rel="stylesheet" href="/static/css/onboarding.css" />
|
|
<link rel="stylesheet" href="/static/css/support.css" />
|
|
<link rel="stylesheet" href="/static/css/domain-setup.css" />
|
|
</head>
|
|
<body class="onboarding-body">
|
|
|
|
<!-- Onboarding wizard container -->
|
|
<div class="onboarding-shell">
|
|
|
|
<!-- Progress bar -->
|
|
<div class="onboarding-progress-bar" id="onboarding-progress-bar">
|
|
<div class="onboarding-progress-fill" id="onboarding-progress-fill"></div>
|
|
</div>
|
|
|
|
<!-- Step indicators -->
|
|
<div class="onboarding-steps-nav" id="onboarding-steps-nav">
|
|
<span class="onboarding-step-dot" data-step="1">1</span>
|
|
<span class="onboarding-step-connector"></span>
|
|
<span class="onboarding-step-dot" data-step="2">2</span>
|
|
<span class="onboarding-step-connector"></span>
|
|
<span class="onboarding-step-dot" data-step="3">3</span>
|
|
<span class="onboarding-step-connector"></span>
|
|
<span class="onboarding-step-dot" data-step="4">4</span>
|
|
</div>
|
|
|
|
<!-- Step panels -->
|
|
<div class="onboarding-panel-wrap">
|
|
|
|
<!-- ── Migration Password Gate (pre-step) ── -->
|
|
<div class="onboarding-panel" id="step-migration" style="display:none">
|
|
<div class="onboarding-hero">
|
|
<div class="onboarding-logo">🔐</div>
|
|
<h1 class="onboarding-title">Your system has been migrated to Sovran_SystemsOS</h1>
|
|
<p class="onboarding-subtitle">Important password update required</p>
|
|
</div>
|
|
<div class="onboarding-card">
|
|
<p class="onboarding-body-text" style="text-align:center; margin-bottom:4px;">
|
|
Your new login password is:
|
|
</p>
|
|
<div id="migration-password-value" style="font-family:monospace; font-size:1.35rem; font-weight:700; color:var(--text-primary); background:rgba(109, 191, 139, 0.10); border:1.5px solid rgba(109, 191, 139, 0.35); border-radius:8px; padding:14px 24px; letter-spacing:0.04em; text-align:center; word-break:break-all; margin-bottom:8px;">
|
|
|
|
</div>
|
|
<div style="padding:10px 14px; background-color:rgba(229, 165, 10, 0.1); border:1px solid rgba(229, 165, 10, 0.35); border-radius:8px; font-size:0.92rem; color:var(--yellow); line-height:1.55;">
|
|
⚠ Write this password down! You will need it to log in next time. This is also your Sovran Hub login password.
|
|
</div>
|
|
<div id="migration-password-status" class="onboarding-save-status" style="margin-top:8px;"></div>
|
|
</div>
|
|
<div class="onboarding-footer">
|
|
<div></div>
|
|
<button class="btn btn-primary" id="migration-password-continue">
|
|
I've written it down — Continue →
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ── Step 1: Welcome ── -->
|
|
<div class="onboarding-panel" id="step-1">
|
|
<div class="onboarding-hero">
|
|
<div class="onboarding-logo">
|
|
<img src="/static/logo-light.svg" alt="Sovran Systems" class="onboarding-logo-img" />
|
|
</div>
|
|
<h1 class="onboarding-title">Welcome to Sovran_SystemsOS!</h1>
|
|
<p class="onboarding-subtitle">Be Digitally Sovereign</p>
|
|
</div>
|
|
<div class="onboarding-card">
|
|
<p class="onboarding-body-text">
|
|
Your system is installed and ready to configure. This wizard will guide
|
|
you through the final setup steps so everything works perfectly.
|
|
</p>
|
|
<div class="onboarding-role-row" id="onboarding-role-row">
|
|
<span class="onboarding-role-label">Your Role:</span>
|
|
<span class="onboarding-role-badge" id="onboarding-role-badge">Loading…</span>
|
|
</div>
|
|
<p class="onboarding-body-text onboarding-body-text--dim">
|
|
This setup only takes a few minutes. You can always revisit these
|
|
settings from the main Hub dashboard.
|
|
</p>
|
|
</div>
|
|
<div class="onboarding-footer">
|
|
<div></div>
|
|
<button class="btn btn-primary onboarding-btn-next" id="step-1-next">
|
|
Let's Go →
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ── Step 2: Timezone & Locale ── -->
|
|
<div class="onboarding-panel" id="step-2" style="display:none">
|
|
<div class="onboarding-step-header">
|
|
<span class="onboarding-step-icon">🌍</span>
|
|
<h2 class="onboarding-step-title">Timezone & Locale</h2>
|
|
<p class="onboarding-step-desc">
|
|
Select your timezone and preferred language so your system clock, logs,
|
|
and services display the correct time and format.
|
|
</p>
|
|
</div>
|
|
<div class="onboarding-card" id="step-2-body">
|
|
<p class="onboarding-loading">Loading timezone data…</p>
|
|
</div>
|
|
<div id="step-2-status" class="onboarding-save-status"></div>
|
|
<div class="onboarding-footer">
|
|
<button class="btn btn-close-modal onboarding-btn-back" data-prev="1">← Back</button>
|
|
<button class="btn btn-primary onboarding-btn-next" id="step-2-next">
|
|
Save & Continue →
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ── Step 3: Domain Configuration ── -->
|
|
<div class="onboarding-panel" id="step-3" style="display:none">
|
|
<div class="onboarding-step-header">
|
|
<span class="onboarding-step-icon">🌐</span>
|
|
<h2 class="onboarding-step-title">Domain Configuration</h2>
|
|
<p class="onboarding-step-desc">
|
|
Sovran_SystemsOS uses <strong><a href="https://njal.la" target="_blank" style="color: var(--accent-color);">Njal.la</a></strong> for domains and Dynamic DNS, and your router needs ports <strong>80</strong> and <strong>443</strong> (TCP) forwarded to this computer.
|
|
Everything you need — Njal.la account, Dynamic records, and the one router task — is laid out step by step below.
|
|
</p>
|
|
</div>
|
|
<div class="onboarding-card" id="step-3-body">
|
|
<p class="onboarding-loading">Loading service information…</p>
|
|
</div>
|
|
<div id="step-3-status" class="onboarding-save-status"></div>
|
|
<div class="onboarding-footer">
|
|
<button class="btn btn-close-modal onboarding-btn-back" data-prev="2">← Back</button>
|
|
<button class="btn btn-primary onboarding-btn-next" id="step-3-next">
|
|
Save & Continue →
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ── Step 4: Complete ── -->
|
|
<div class="onboarding-panel" id="step-4" style="display:none">
|
|
<div class="onboarding-hero">
|
|
<div class="onboarding-logo">✅</div>
|
|
<h1 class="onboarding-title">Your Sovran_SystemsOS is Ready!</h1>
|
|
<p class="onboarding-subtitle">Setup complete</p>
|
|
</div>
|
|
<div class="onboarding-card">
|
|
<p class="onboarding-body-text">
|
|
All configuration steps are done. Head to the main Hub dashboard to
|
|
monitor your services, manage credentials, and make changes at any time.
|
|
</p>
|
|
<ul class="onboarding-checklist" id="onboarding-checklist">
|
|
<li>✅ Timezone & locale configured</li>
|
|
<li>✅ Domain configuration saved</li>
|
|
</ul>
|
|
</div>
|
|
<div class="onboarding-footer">
|
|
<button class="btn btn-close-modal onboarding-btn-back" data-prev="3">← Back</button>
|
|
<button class="btn btn-primary" id="step-4-finish">
|
|
Go to Dashboard →
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div><!-- /panel-wrap -->
|
|
</div><!-- /shell -->
|
|
|
|
<script src="/static/js/domain-prereqs.js?v={{ asset_version }}"></script>
|
|
<script src="/static/onboarding.js?v={{ onboarding_js_hash }}"></script>
|
|
</body>
|
|
</html>
|