first commit

internal/web/templates/channel.html

@@ -0,0 +1,102 @@
+{{define "channel.html"}}<!doctype html>
+<html lang="pl">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Utwórz kanał</title>
+<link rel="stylesheet" href="/assets/app.css">
+</head>
+<body class="channel-page">
+<main class="channel-shell">
+  <section class="channel-card">
+    <div class="channel-topbar">
+      <a class="back-link" href="/stats">Statystyki
+      </a>
+      <a class="back-link" href="{{.VoiceURL}}" target="_top">Połącz z TS3</a>
+    </div>
+
+    <div class="channel-title">
+<div>
+        <p class="eyebrow">TeamSpeak 3</p>
+        <h1>Utwórz swój kanał</h1>
+        <p>Aplikacja wykryje Twojego klienta, utworzy kanał, nada prawa i przeniesie Cię automatycznie.</p>
+      </div>
+    </div>
+
+    {{if .Error}}<div class="alert alert-danger">{{.Error}}</div>{{end}}
+
+    {{if .Success}}
+      <div class="alert alert-success">
+        <strong>Kanał został utworzony.</strong>
+        <span>{{.Success}} ID kanału: {{.ChannelID}}</span>
+      </div>
+      <div class="button-row">
+        <a class="btn btn-primary grow" href="{{.VoiceURL}}" target="_top">Otwórz TeamSpeak</a>
+        <a class="btn btn-ghost" href="/stats">Statystyki</a>
+      </div>
+    {{else}}
+      {{if eq (len .Clients) 0}}{{if not .Client}}
+      <div class="empty-state">
+<h2>Nie wykryto klienta TS3</h2>
+        <p>Połącz się z serwerem TeamSpeak, a następnie odśwież stronę.</p>
+        <div class="button-row">
+          <a class="btn btn-primary grow" href="{{.VoiceURL}}" target="_top">Połącz z TeamSpeak</a>
+          <a class="btn btn-ghost" href="">Odśwież</a>
+        </div>
+      </div>
+      {{end}}{{end}}
+
+      {{if gt (len .Clients) 1}}
+      <div class="selection-box">
+        <h2>Wybierz swojego klienta</h2>
+        <p>Pod tym samym adresem IP jest kilka osób. Kod potwierdzający przyjdzie jako prywatna wiadomość na TS3.</p>
+        <div class="client-list">
+        {{range .Clients}}
+          <form method="post" action="/channel/verify/start">
+            <input type="hidden" name="form_token" value="{{$.FormToken}}">
+            <input type="hidden" name="clid" value="{{.ID}}">
+            <button type="submit" class="client-choice">
+              <span class="avatar" aria-hidden="true">{{printf "%.1s" .Nick}}</span>
+              <span><strong>{{.Nick}}</strong><small>Wyślij kod weryfikacyjny</small></span></button>
+          </form>
+        {{end}}
+        </div>
+      </div>
+      {{end}}
+
+      {{if .Client}}
+      <div class="client-badge">
+        <span class="online-dot" aria-hidden="true"></span>
+        <span>Wykryty klient</span>
+        <strong>{{.Client.Nick}}</strong>
+      </div>
+
+      <form method="post" action="/channel/create" class="channel-form">
+        <input type="hidden" name="form_token" value="{{.FormToken}}">
+        <input type="hidden" name="client_token" value="{{.ClientToken}}">
+
+        <div class="field">
+          <label for="channel-name">Nazwa kanału</label>
+          <input id="channel-name" name="name" maxlength="40" autocomplete="off" placeholder="Np. Pokój Mateusza">
+          <small>Pozostaw puste, aby wygenerować nazwę automatycznie.</small>
+        </div>
+
+        <div class="field">
+          <label for="channel-password">Hasło</label>
+          <input id="channel-password" name="password" maxlength="64" type="password" autocomplete="new-password" placeholder="Opcjonalne">
+        </div>
+
+        <div class="field">
+          <label for="channel-topic">Temat / opis</label>
+          <input id="channel-topic" name="topic" maxlength="255" autocomplete="off" placeholder="Opcjonalne">
+        </div>
+
+        <button class="btn btn-primary btn-large" type="submit">
+          Utwórz kanał i przenieś mnie</button>
+      </form>
+      {{end}}
+    {{end}}
+  </section>
+</main>
+</body>
+</html>{{end}}