Raspberry Pi alarm clock server.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

146 lines
5.4 KiB

<!DOCTYPE html>
<html>
<head>
<title>Sonar</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="content-type" value="text/html; encoding=UTF-8">
<link rel="stylesheet" href="/css/bootstrap.min.css">
<style type="text/css">
button {
min-height: 4rem;
}
code { /* comment out to see debug output from fork command */
display: inline;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col">
{{ range .Flashes }}
<div class="alert alert-info">{{ . }}</div>
{{ end }}
</div>
</div>
<div class="row">
<div class="col">
<div class="card mb-4">
<div class="card-header">
Volume Control: <strong>{{ .Volume }}</strong>%
</div>
<div class="card-body">
<div class="row">
<div class="col-4">
<form method="POST" action="/volume/lower">
<button name="action" value="vol-lower" class="form-control btn btn-danger">➖</button>
</form>
</div>
<div class="col-4">
<form method="POST" action="/volume/mute">
<button name="action" value="vol-mute" class="form-control btn btn-secondary">🚫</button>
</form>
</div>
<div class="col-4">
<form method="POST" action="/volume/higher">
<button name="action" value="vol-higher" class="form-control btn btn-success">➕</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card mb-4">
<div class="card-header">
Alarm Clock Playlist
</div>
<div class="card-body">
<p>
<strong>Status:</strong> {{ .PlaylistStatus }}
</p>
<form method="POST" action="/playlist/start">
<p>
<button name="action" value="playlist-start" class="form-control btn btn-success">Start Playlist</button>
</p>
</form>
<form method="POST" action="/playlist/stop">
<p>
<button name="action" value="playlist-stop" class="form-control btn btn-danger">Stop Playlist</button>
</p>
</form>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card mb-4">
<div class="card-header">
Schedule
</div>
<div class="card-body">
<form method="POST" action="/playlist/schedule">
<label for="time">Time:</label>
<input type="time" name="time" class="form-control mb-2" value="{{ printf "%02d" .Hour }}:{{ .Minute }}">
<label>Days of week:</label>
<ul class="list-unstyled">
<li>
<label>
<input type="checkbox" name="day" value="0"{{ if .Days.In "0" }} checked{{ end }}> Sunday
</label>
</li>
<li>
<label>
<input type="checkbox" name="day" value="1"{{ if .Days.In "1" }} checked{{ end }}> Monday
</label>
</li>
<li>
<label>
<input type="checkbox" name="day" value="2"{{ if .Days.In "2" }} checked{{ end }}> Tuesday
</label>
</li>
<li>
<label>
<input type="checkbox" name="day" value="3"{{ if .Days.In "3" }} checked{{ end }}> Wednesday
</label>
</li>
<li>
<label>
<input type="checkbox" name="day" value="4"{{ if .Days.In "4" }} checked{{ end }}> Thursday
</label>
</li>
<li>
<label>
<input type="checkbox" name="day" value="5"{{ if .Days.In "5" }} checked{{ end }}> Friday
</label>
</li>
<li>
<label>
<input type="checkbox" name="day" value="6"{{ if .Days.In "6" }} checked{{ end }}> Saturday
</label>
</li>
</ul>
<button name="action" value="schedule" class="form-control btn btn-primary">Set Schedule</button>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>