-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
51 lines (51 loc) · 955 Bytes
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
buttons {
display: grid;
grid-template-columns: 14vh 14vh 14vh 14vh;
grid-template-rows: 14vh 14vh 14vh 14vh 14vh 14vh;
grid-gap: 2vh;
justify-content: center;
}
button {
cursor: pointer;
border-radius: 50%;
border: 0.8vh #bbb solid;
color: #fff;
font-weight: bold;
outline: none;
padding: 0;
font-size: 3vh;
}
button:active {
opacity: 0.75;
}
</style>
<script>
const repeater = {
start (cmd) {
this.stop()
fetch('/cmd/'+cmd)
this.intId = setInterval(fetch, 250, '/cmd/'+cmd)
},
stop () {
clearInterval(this.intId)
},
intId: 0,
}
</script>
<buttons>
{{ range $i, $btn := . }}
<button
onMouseDown="repeater.start({{$i}})"
onMouseUp="repeater.stop()"
onMouseLeave="repeater.stop()"
style="{{with $btn.Color}}background: rgb({{.R}}, {{.G}}, {{.B}});{{end}}"
>
{{ $btn.Name }}
</button>
{{ end }}
</buttons>
</html>