Files

52 lines
2.7 KiB
HTML

{{define "setup"}}<!doctype html>
<html lang="en" data-bs-theme="dark">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Setup · VibeSonic</title>
<link rel="stylesheet" href="/static/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/css/bootstrap-icons.min.css">
<link rel="stylesheet" href="/static/css/app.css">
</head>
<body class="d-flex align-items-center justify-content-center" style="min-height:100vh;">
<div class="card" style="width: 28rem;">
<div class="card-body">
<h1 class="h4 mb-1"><i class="bi bi-vinyl-fill"></i> Welcome to VibeSonic</h1>
<p class="text-secondary small mb-3">Let's create your administrator account and your first music folder.</p>
{{if .Flash}}<div class="alert alert-{{if .FlashKind}}{{.FlashKind}}{{else}}danger{{end}}">{{.Flash}}</div>{{end}}
<form method="post" action="/setup">
{{template "csrf_field" .CSRFToken}}
<h2 class="h6 mt-2">Administrator account</h2>
<div class="mb-2">
<label class="form-label" for="username">Username</label>
<input type="text" class="form-control" id="username" name="username" autofocus required>
</div>
<div class="mb-2">
<label class="form-label" for="password">Password</label>
<input type="password" class="form-control" id="password" name="password" minlength="8" required>
</div>
<h2 class="h6 mt-3">First music folder</h2>
<div class="mb-2">
<label class="form-label" for="folder_name">Name</label>
<input type="text" class="form-control" id="folder_name" name="folder_name" value="Music" required>
</div>
<div class="mb-3">
<label class="form-label" for="folder_path">Path (on the server)</label>
<input type="text" class="form-control" id="folder_path" name="folder_path" placeholder="/music" required>
</div>
<div class="mb-3 small text-secondary">
ffmpeg: {{if .Data.FFmpegFound}}<span class="text-success"><i class="bi bi-check-circle"></i> found at {{.Data.FFmpegPath}}</span>{{else}}<span class="text-warning"><i class="bi bi-exclamation-triangle"></i> not found at {{.Data.FFmpegPath}} — streaming and metadata will be limited</span>{{end}}<br>
ffprobe: {{if .Data.FFprobeFound}}<span class="text-success"><i class="bi bi-check-circle"></i> found at {{.Data.FFprobePath}}</span>{{else}}<span class="text-warning"><i class="bi bi-exclamation-triangle"></i> not found at {{.Data.FFprobePath}}</span>{{end}}
</div>
<button type="submit" class="btn btn-primary w-100">Create account and start scanning</button>
</form>
</div>
</div>
</body>
</html>
{{end}}