109 lines
4.5 KiB
HTML
109 lines
4.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>USB Server</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>USB Server</h1>
|
|
<div class="status" id="status">Nicht verbunden</div>
|
|
</header>
|
|
|
|
<nav>
|
|
<button class="tab active" data-tab="devices">Geraete</button>
|
|
<button class="tab" data-tab="settings">Einstellungen</button>
|
|
<button class="tab" data-tab="token">Token</button>
|
|
<button class="tab" data-tab="service">Service</button>
|
|
</nav>
|
|
|
|
<!-- Devices Tab -->
|
|
<section id="tab-devices" class="tab-content active">
|
|
<div id="mode-info" class="info-box"></div>
|
|
<div id="device-list" class="device-list">
|
|
<p class="loading">Lade Geraete...</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Settings Tab -->
|
|
<section id="tab-settings" class="tab-content">
|
|
<form id="settings-form">
|
|
<div class="form-group">
|
|
<label for="relay-addr">Relay Server Adresse</label>
|
|
<input type="text" id="relay-addr" placeholder="ws://localhost:8443">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="hash">Hash</label>
|
|
<input type="text" id="hash" placeholder="SHA256 Hash" readonly>
|
|
<small>Wird aus den 3 Tokens berechnet</small>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="mode">Modus</label>
|
|
<select id="mode">
|
|
<option value="share">Freigeben (Share)</option>
|
|
<option value="use">Empfangen (Use)</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="client-name">Client Name</label>
|
|
<input type="text" id="client-name" placeholder="Mein PC">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="web-port">Web-UI Port</label>
|
|
<input type="number" id="web-port" value="8080">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="auto-connect-label">
|
|
<input type="checkbox" id="allow-force-detach">
|
|
Andere Clients duerfen Geraete trennen (Share-Modus)
|
|
</label>
|
|
<small>Erlaubt Use-Clients, Geraete die von anderen benutzt werden zu trennen</small>
|
|
</div>
|
|
<button type="submit" class="btn primary">Speichern</button>
|
|
</form>
|
|
</section>
|
|
|
|
<!-- Token Tab -->
|
|
<section id="tab-token" class="tab-content">
|
|
<div class="form-group">
|
|
<label for="token1">Token 1</label>
|
|
<input type="text" id="token1" placeholder="Token 1">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="token2">Token 2</label>
|
|
<input type="text" id="token2" placeholder="Token 2">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="token3">Token 3</label>
|
|
<input type="text" id="token3" placeholder="Token 3">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>Berechneter Hash</label>
|
|
<div id="computed-hash" class="hash-display">-</div>
|
|
</div>
|
|
<div class="button-group">
|
|
<button id="generate-tokens" class="btn primary">Neue Tokens Generieren</button>
|
|
<button id="apply-tokens" class="btn">Tokens Anwenden</button>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Service Tab -->
|
|
<section id="tab-service" class="tab-content">
|
|
<div class="info-box">
|
|
<p>USB Client als Systemdienst installieren fuer automatischen Start.</p>
|
|
</div>
|
|
<div class="button-group">
|
|
<button id="install-service" class="btn primary">Service Installieren</button>
|
|
<button id="uninstall-service" class="btn danger">Service Deinstallieren</button>
|
|
</div>
|
|
<div id="service-status" class="info-box" style="margin-top: 1rem;"></div>
|
|
</section>
|
|
</div>
|
|
|
|
<script src="/static/app.js"></script>
|
|
</body>
|
|
</html>
|