karim
5f63c5032c
Adds the four onboarding pieces that were missing:
- flywithlua_present Tauri command + wizard step that checks the plugin and
links the FlyWithLua NG+ download when it's absent.
- Wizard step explaining how to enable X-Plane's Web/REST API (Settings>Network).
- FlyWithLua-Sync status row in the live diagnostics, from /api/health.lua
('N Skripte aktiv' / 'FlyWithLua fehlt' / 'kein X-Plane').
- 4-step guided wizard (X-Plane folder → FlyWithLua → Web-API → install+start)
that auto-opens on first launch and is reachable via the header Einrichten
button; the final step hands off to the normal server start (auto-installs Lua).
Verified the wizard DOM flow + the dLua status against a live bridge.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
156 lines
6.5 KiB
HTML
156 lines
6.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>X-Plane Cockpit</title>
|
|
<link rel="stylesheet" href="styles.css" />
|
|
</head>
|
|
<body>
|
|
<div class="panel">
|
|
<header class="hd">
|
|
<div class="brand">G1000<span>·web</span></div>
|
|
<button id="setupBtn" class="link" title="Einrichtungs-Assistent">⚙ Einrichten</button>
|
|
<div id="status" class="status off"><span class="dot"></span><span id="statusText">Gestoppt</span></div>
|
|
</header>
|
|
|
|
<main>
|
|
<div id="updateBanner" class="update-banner hidden">
|
|
<div class="ub-text"><b id="ubTitle">Update verfügbar</b><span id="ubNotes"></span></div>
|
|
<div class="ub-actions">
|
|
<button id="ubInstall" class="btn ok sm">Installieren</button>
|
|
<button id="ubDismiss" class="btn ghost sm">Später</button>
|
|
</div>
|
|
</div>
|
|
|
|
<section class="card">
|
|
<label class="lbl">X-Plane 12 Ordner</label>
|
|
<div class="row">
|
|
<input id="xpPath" type="text" placeholder="z.B. /Users/du/X-Plane 12" spellcheck="false" />
|
|
<button id="browse" class="btn ghost">Suchen…</button>
|
|
</div>
|
|
<div id="xpHint" class="hint"></div>
|
|
|
|
<div class="row gap">
|
|
<div class="field">
|
|
<label class="lbl">Port</label>
|
|
<input id="port" type="number" value="8080" min="1024" max="65535" />
|
|
</div>
|
|
<label class="toggle">
|
|
<input id="demo" type="checkbox" />
|
|
<span>Demo-Modus (ohne X-Plane)</span>
|
|
</label>
|
|
</div>
|
|
<div id="portHint" class="hint"></div>
|
|
</section>
|
|
|
|
<button id="startBtn" class="btn primary big">Server starten</button>
|
|
|
|
<section id="liveCard" class="card live hidden">
|
|
<label class="lbl">Auf Tablets / Laptops öffnen</label>
|
|
<div class="url-row">
|
|
<code id="url">—</code>
|
|
<button id="copy" class="btn ghost sm" title="Kopieren">⧉</button>
|
|
</div>
|
|
<div class="quick">
|
|
<button class="btn ghost sm" data-page="pfd">PFD</button>
|
|
<button class="btn ghost sm" data-page="mfd">MFD</button>
|
|
<button class="btn ghost sm" data-page="map">Map</button>
|
|
<button class="btn ghost sm" data-page="fms">FMS</button>
|
|
</div>
|
|
<button id="openBtn" class="btn ok">Cockpit im Browser öffnen</button>
|
|
|
|
<div class="diag">
|
|
<div class="diag-row"><span>X-Plane</span><b id="dXp">—</b></div>
|
|
<div class="diag-row"><span>Verbundene Geräte</span><b id="dClients">—</b></div>
|
|
<div class="diag-row"><span>Navdata</span><b id="dNav">—</b></div>
|
|
<div class="diag-row"><span>Datarefs</span><b id="dRefs">—</b></div>
|
|
<div class="diag-row"><span>FlyWithLua-Sync</span><b id="dLua">—</b></div>
|
|
</div>
|
|
|
|
<details class="asp-wrap">
|
|
<summary>Lufträume auf der Karte</summary>
|
|
<div class="asp-body">
|
|
<p class="asp-note">Wähle Regionen für die Luftraum-Anzeige (Class B/C/D, Restricted, MOA …). USA ist frei; Europa braucht einen kostenlosen <a href="#" id="aspKeyLink">OpenAIP-API-Key</a>.</p>
|
|
<input id="aspKey" type="password" placeholder="OpenAIP API-Key (für Europa)" spellcheck="false" />
|
|
<div id="aspRegions" class="asp-list"></div>
|
|
<div id="aspHint" class="hint"></div>
|
|
</div>
|
|
</details>
|
|
</section>
|
|
|
|
<details class="log-wrap">
|
|
<summary>Server-Log</summary>
|
|
<pre id="log"></pre>
|
|
</details>
|
|
</main>
|
|
|
|
<footer class="ft">
|
|
<span id="ver">v—</span>
|
|
<button id="updateBtn" class="link">Nach Updates suchen</button>
|
|
</footer>
|
|
</div>
|
|
|
|
<!-- First-run setup wizard: links X-Plane, checks FlyWithLua, installs the Lua
|
|
scripts, explains the Web-API, then starts. -->
|
|
<div id="wizard" class="wiz hidden">
|
|
<div class="wiz-box">
|
|
<div class="wiz-head">
|
|
<b>Einrichtung</b>
|
|
<div class="wiz-steps">
|
|
<span data-s="1" class="on">1</span><span data-s="2">2</span><span data-s="3">3</span><span data-s="4">4</span>
|
|
</div>
|
|
<button id="wizClose" class="wiz-x" title="Schließen">✕</button>
|
|
</div>
|
|
|
|
<!-- Step 1: X-Plane folder -->
|
|
<div class="wiz-step" data-step="1">
|
|
<h3>1 · X-Plane 12 Ordner</h3>
|
|
<p>Wähle deinen X-Plane-12-Ordner. (Demo ohne X-Plane: einfach überspringen.)</p>
|
|
<div class="row">
|
|
<input id="wizPath" type="text" placeholder="z.B. /Users/du/X-Plane 12" spellcheck="false" />
|
|
<button id="wizBrowse" class="btn ghost">Suchen…</button>
|
|
</div>
|
|
<div id="wizPathHint" class="hint"></div>
|
|
</div>
|
|
|
|
<!-- Step 2: FlyWithLua -->
|
|
<div class="wiz-step hidden" data-step="2">
|
|
<h3>2 · FlyWithLua NG+</h3>
|
|
<p>Für die zweiseitige FMS- und Terrain-Synchronisierung braucht X-Plane das kostenlose Plugin <b>FlyWithLua NG+</b>.</p>
|
|
<div id="wizFwl" class="wiz-status">—</div>
|
|
<p class="wiz-sub">Nicht installiert? <a href="#" id="wizFwlLink">FlyWithLua NG+ herunterladen</a>, in <code>X-Plane/Resources/plugins/</code> entpacken, X-Plane neu starten.</p>
|
|
<button id="wizFwlCheck" class="btn ghost sm">Erneut prüfen</button>
|
|
</div>
|
|
|
|
<!-- Step 3: Web API -->
|
|
<div class="wiz-step hidden" data-step="3">
|
|
<h3>3 · X-Plane Web-API aktivieren</h3>
|
|
<p>Damit das Cockpit Daten bekommt, muss X-Planes Web-Server an sein:</p>
|
|
<ol class="wiz-ol">
|
|
<li>X-Plane → <b>Settings</b> → <b>Network</b></li>
|
|
<li>Bereich <b>„Web/REST API"</b> (X-Plane 12.1.1+)</li>
|
|
<li><b>„Enable web server"</b> / API einschalten</li>
|
|
</ol>
|
|
<p class="wiz-sub">Ob's klappt, siehst du nach dem Start am Status „X-Plane: verbunden".</p>
|
|
</div>
|
|
|
|
<!-- Step 4: install + start -->
|
|
<div class="wiz-step hidden" data-step="4">
|
|
<h3>4 · Lua installieren & starten</h3>
|
|
<p>Beim Start kopiert der Server die Begleit-Skripte automatisch nach <code>FlyWithLua/Scripts/</code> und verbindet sich mit X-Plane.</p>
|
|
<label class="toggle"><input id="wizDemo" type="checkbox" /><span>Demo-Modus (ohne X-Plane)</span></label>
|
|
<div id="wizResult" class="wiz-status">Bereit.</div>
|
|
</div>
|
|
|
|
<div class="wiz-foot">
|
|
<button id="wizBack" class="btn ghost" disabled>Zurück</button>
|
|
<button id="wizNext" class="btn primary">Weiter</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="main.js"></script>
|
|
</body>
|
|
</html>
|