Skip to content

Commit ac32e45

Browse files
ModischFabricationsModischFabrications
committed
show build time on website, show snackbar only on errors
1 parent debeb35 commit ac32e45

File tree

3 files changed

+403
-398
lines changed

3 files changed

+403
-398
lines changed

‎src/inputs/website.h‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -188,8 +188,8 @@ void setup() {
188188
server.serveStatic("/favicon.ico", LittleFS, "/favicon.png").setCacheControl("max-age=600");
189189
server.onNotFound(RedirectUnknown);
190190

191-
server.on("/health", HTTP_ANY, GetHealth);
192-
server.on("/build_time", HTTP_ANY, GetBuildTime);
191+
server.on("/health", HTTP_GET, GetHealth);
192+
server.on("/build_time", HTTP_GET, GetBuildTime);
193193
server.on("/brightness", HTTP_POST, PostBrightness);
194194
server.on("/timeout", HTTP_POST, PostTimeout);
195195
server.on("/mode", HTTP_GET, GetMode);

‎website/index.html‎

Lines changed: 165 additions & 165 deletions
Original file line numberDiff line numberDiff line change
@@ -1,166 +1,166 @@
1-
<!DOCTYPE html>
2-
<html lang="en">
3-
4-
<head>
5-
<meta http-equiv="Content-type" content="text/html" ; charset="utf-8" />
6-
<meta name="viewport" content="width=device-width,initial-scale=1.0, shrink-to-fit=no" />
7-
<meta name="author" content="Modisch Fabrications">
8-
<meta name="description" content="Remote control page for ModischMatrix">
9-
<meta name="theme-color" content="#858585" />
10-
<title>ModischMatrix</title>
11-
<link rel="stylesheet" href="style.css" />
12-
<link rel="shortcut icon" type="image/x-icon" href="favicon.png">
13-
<script src="script.js"></script>
14-
</head>
15-
16-
<body onload="init()">
17-
<div id="page-container">
18-
19-
<h1 class="title">
20-
ModischMatrix
21-
</h1>
22-
23-
<noscript>
24-
No JavaScript, no function. Sorry buddy!
25-
</noscript>
26-
27-
<section>
28-
<!-- Tab links -->
29-
<div class="tab">
30-
<button class="tablinks" id="mode_0" onclick="openTab(this)">Off</button>
31-
<button class="tablinks" id="mode_1" onclick="openTab(this)">Static</button>
32-
<button class="tablinks" id="mode_2" onclick="openTab(this)">Login</button>
33-
<button class="tablinks" id="mode_3" onclick="openTab(this)">Clock</button>
34-
<button class="tablinks" id="mode_4" onclick="openTab(this)">Dashboard</button>
35-
<button class="tablinks" id="mode_5" onclick="openTab(this)">Colorwave</button>
36-
<button class="tablinks" id="mode_6" onclick="openTab(this)">Fire</button>
37-
<button class="tablinks" id="mode_7" onclick="openTab(this)">Sprinkles</button>
38-
<button class="tablinks" id="mode_8" onclick="openTab(this)">Game of Life</button>
39-
<button class="tablinks" id="mode_9" onclick="openTab(this)">Snake</button>
40-
<button class="tablinks" id="mode_10" onclick="openTab(this)">Freedraw</button>
41-
</div>
42-
43-
<!-- Tab content -->
44-
<div>
45-
<div id="mode_0_tab" class="tabcontent"></div>
46-
47-
<div id="mode_1_tab" class="tabcontent">
48-
<p>Print text:</p>
49-
<!-- wrap="hard" doesn't always add \n, but it's not that important; &#10; is newline -->
50-
<textarea id="printInput" class="matrixText" cols="10" rows="4" maxlength="40"
51-
placeholder="Row1&#10;Row2&#10;..." wrap="hard"
52-
onkeydown="checkEnter(event, sendText)">Hello&#10;World!</textarea>
53-
<input id="printSubmit" type="submit" onclick="sendText()">
54-
<p>Some symbols are supported, try <code>-></code> or <code>♥</code>. </p>
55-
</div>
56-
57-
<div id="mode_2_tab" class="tabcontent">
58-
<p> <input id="URL_FIELD" class="formText" type="text" readonly>
59-
<button onclick="copyToClipboard(URL_FIELD.value)">Copy</button>
60-
</p>
61-
62-
<p> <input id="MDNS_FIELD" class="formText" type="text" readonly>
63-
<button onclick="copyToClipboard(MDNS_FIELD.value)">Copy</button>
64-
</p>
65-
</div>
66-
67-
<div id="mode_3_tab" class="tabcontent"></div>
68-
<div id="mode_4_tab" class="tabcontent"></div>
69-
<div id="mode_5_tab" class="tabcontent"></div>
70-
<div id="mode_6_tab" class="tabcontent"></div>
71-
<div id="mode_7_tab" class="tabcontent"></div>
72-
73-
<div id="mode_8_tab" class="tabcontent">
74-
<p>Use custom ruleset:</p>
75-
<textarea id="golRuleInput" class="golRulesText" cols="20" rows="1" maxlength="20"
76-
placeholder="B3/S23" wrap="hard" onkeydown="checkEnter(event, sendGOLRules)">B36/S23</textarea>
77-
<input type="submit" onclick="sendGOLRules()">
78-
<p>Each Cell is: (B)orn from exactly {} neighbors, (S)urviving with exactly {} neighbors, dying
79-
otherwise.
80-
</p>
81-
<p>HighLife: B36/S23</p>
82-
<p>Seeds: B2/S</p>
83-
</div>
84-
85-
<div id="mode_9_tab" class="tabcontent">
86-
<div class="radio">
87-
<p>Choose your Snake: </p>
88-
<input type="radio" id="playerSlotRadio1" name="playerIndex" value="0" checked>
89-
<input type="radio" id="playerSlotRadio2" name="playerIndex" value="1">
90-
<input type="radio" id="playerSlotRadio3" name="playerIndex" value="2">
91-
<input type="radio" id="playerSlotRadio4" name="playerIndex" value="3">
92-
</div>
93-
94-
<div class="keys">
95-
<div class="up arr" onpointerdown="arrowPressed(1)">↑</div>
96-
<br />
97-
<div class="left arr" onpointerdown="arrowPressed(3)">←</div>
98-
<div class="down arr" onpointerdown="arrowPressed(2)">↓</div>
99-
<div class="right arr" onpointerdown="arrowPressed(4)">→</div>
100-
</div>
101-
</div>
102-
103-
<div id="mode_10_tab" class="tabcontent">
104-
<div id="freeDrawSettings">
105-
<div class="colorSelection">
106-
<input type="radio" id="drawColorRadio1" class="autoload" name="drawColorRadio" value="1"
107-
onclick="c.setColor(drawColor1.value)" checked>
108-
<input id="drawColor1" type="color" value="#ffffff">
109-
</div>
110-
<div class="colorSelection">
111-
<input type="radio" id="drawColorRadio2" name="drawColorRadio" value="2"
112-
onclick="c.setColor(drawColor2.value)">
113-
<input id="drawColor2" type="color" value="#999999">
114-
</div>
115-
<div class="colorSelection">
116-
<input type="radio" id="drawColorRadio3" name="drawColorRadio" value="3"
117-
onclick="c.setColor(drawColor3.value)">
118-
<input id="drawColor3" type="color" value="#aa2222">
119-
</div>
120-
<div class="colorSelection">
121-
<input type="radio" id="drawColorRadio4" name="drawColorRadio" value="4"
122-
onclick="c.setColor(drawColor4.value)">
123-
<input id="drawColor4" type="color" value="#11cc22">
124-
</div>
125-
<div class="colorSelection">
126-
<input type="radio" id="drawColorRadio5" name="drawColorRadio" value="5"
127-
onclick="c.setColor(drawColor5.value)">
128-
<input id="drawColor5" type="color" value="#1111cc">
129-
</div>
130-
<button onclick="c.fill()">Fill</button>
131-
<button onclick="c.clear()">Clear</button>
132-
</div>
133-
<canvas id="freeDrawCanvas" width="64" height="32"></canvas>
134-
135-
</div>
136-
</div>
137-
</section>
138-
139-
<section>
140-
<div class="rangeInput">
141-
<p>Back to OFF after:</p>
142-
<input id="timeoutSlider" class="slider autoload" type="range" min="10" max="3600" value="60"
143-
oninput='onTimeoutChanged(this)' />
144-
<p><output id="timeoutOutput"></output></p>
145-
<input type="submit" onclick="postValue('/timeout', timeoutSlider.value)">
146-
</div>
147-
148-
<div class="rangeInput">
149-
<p>Set brightness to:</p>
150-
<input id="brightnessSlider" class="slider autoload" type="range" min="1" max="100" value="50"
151-
oninput='brightnessOutput.value = value + "%"' />
152-
<p><output id="brightnessOutput"></output></p>
153-
<input type="submit" onclick="postValue('/brightness', Math.round(brightnessSlider.value*2.55))">
154-
</div>
155-
</section>
156-
</div>
157-
158-
<div class="footer">
159-
<p>© Modisch Fabrications</p>
160-
</div>
161-
162-
<div id="snackbar"></div>
163-
164-
</body>
165-
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta http-equiv="Content-type" content="text/html" ; charset="utf-8" />
6+
<meta name="viewport" content="width=device-width,initial-scale=1.0, shrink-to-fit=no" />
7+
<meta name="author" content="Modisch Fabrications">
8+
<meta name="description" content="Remote control page for ModischMatrix">
9+
<meta name="theme-color" content="#858585" />
10+
<title>ModischMatrix</title>
11+
<link rel="stylesheet" href="style.css" />
12+
<link rel="shortcut icon" type="image/x-icon" href="favicon.png">
13+
<script src="script.js"></script>
14+
</head>
15+
16+
<body onload="init()">
17+
<div id="page-container">
18+
19+
<h1 class="title">
20+
ModischMatrix
21+
</h1>
22+
23+
<noscript>
24+
No JavaScript, no function. Sorry buddy!
25+
</noscript>
26+
27+
<section>
28+
<!-- Tab links -->
29+
<div class="tab">
30+
<button class="tablinks" id="mode_0" onclick="openTab(this)">Off</button>
31+
<button class="tablinks" id="mode_1" onclick="openTab(this)">Static</button>
32+
<button class="tablinks" id="mode_2" onclick="openTab(this)">Login</button>
33+
<button class="tablinks" id="mode_3" onclick="openTab(this)">Clock</button>
34+
<button class="tablinks" id="mode_4" onclick="openTab(this)">Dashboard</button>
35+
<button class="tablinks" id="mode_5" onclick="openTab(this)">Colorwave</button>
36+
<button class="tablinks" id="mode_6" onclick="openTab(this)">Fire</button>
37+
<button class="tablinks" id="mode_7" onclick="openTab(this)">Sprinkles</button>
38+
<button class="tablinks" id="mode_8" onclick="openTab(this)">Game of Life</button>
39+
<button class="tablinks" id="mode_9" onclick="openTab(this)">Snake</button>
40+
<button class="tablinks" id="mode_10" onclick="openTab(this)">Freedraw</button>
41+
</div>
42+
43+
<!-- Tab content -->
44+
<div>
45+
<div id="mode_0_tab" class="tabcontent"></div>
46+
47+
<div id="mode_1_tab" class="tabcontent">
48+
<p>Print text:</p>
49+
<!-- wrap="hard" doesn't always add \n, but it's not that important; &#10; is newline -->
50+
<textarea id="printInput" class="matrixText" cols="10" rows="4" maxlength="40"
51+
placeholder="Row1&#10;Row2&#10;..." wrap="hard"
52+
onkeydown="checkEnter(event, sendText)">Hello&#10;World!</textarea>
53+
<input id="printSubmit" type="submit" onclick="sendText()">
54+
<p>Some symbols are supported, try <code>-></code> or <code>♥</code>. </p>
55+
</div>
56+
57+
<div id="mode_2_tab" class="tabcontent">
58+
<p> <input id="URL_FIELD" class="formText" type="text" readonly>
59+
<button onclick="copyToClipboard(URL_FIELD.value)">Copy</button>
60+
</p>
61+
62+
<p> <input id="MDNS_FIELD" class="formText" type="text" readonly>
63+
<button onclick="copyToClipboard(MDNS_FIELD.value)">Copy</button>
64+
</p>
65+
</div>
66+
67+
<div id="mode_3_tab" class="tabcontent"></div>
68+
<div id="mode_4_tab" class="tabcontent"></div>
69+
<div id="mode_5_tab" class="tabcontent"></div>
70+
<div id="mode_6_tab" class="tabcontent"></div>
71+
<div id="mode_7_tab" class="tabcontent"></div>
72+
73+
<div id="mode_8_tab" class="tabcontent">
74+
<p>Use custom ruleset:</p>
75+
<textarea id="golRuleInput" class="golRulesText" cols="20" rows="1" maxlength="20"
76+
placeholder="B3/S23" wrap="hard" onkeydown="checkEnter(event, sendGOLRules)">B36/S23</textarea>
77+
<input type="submit" onclick="sendGOLRules()">
78+
<p>Each Cell is: (B)orn from exactly {} neighbors, (S)urviving with exactly {} neighbors, dying
79+
otherwise.
80+
</p>
81+
<p>HighLife: B36/S23</p>
82+
<p>Seeds: B2/S</p>
83+
</div>
84+
85+
<div id="mode_9_tab" class="tabcontent">
86+
<div class="radio">
87+
<p>Choose your Snake: </p>
88+
<input type="radio" id="playerSlotRadio1" name="playerIndex" value="0" checked>
89+
<input type="radio" id="playerSlotRadio2" name="playerIndex" value="1">
90+
<input type="radio" id="playerSlotRadio3" name="playerIndex" value="2">
91+
<input type="radio" id="playerSlotRadio4" name="playerIndex" value="3">
92+
</div>
93+
94+
<div class="keys">
95+
<div class="up arr" onpointerdown="arrowPressed(1)">↑</div>
96+
<br />
97+
<div class="left arr" onpointerdown="arrowPressed(3)">←</div>
98+
<div class="down arr" onpointerdown="arrowPressed(2)">↓</div>
99+
<div class="right arr" onpointerdown="arrowPressed(4)">→</div>
100+
</div>
101+
</div>
102+
103+
<div id="mode_10_tab" class="tabcontent">
104+
<div id="freeDrawSettings">
105+
<div class="colorSelection">
106+
<input type="radio" id="drawColorRadio1" class="autoload" name="drawColorRadio" value="1"
107+
onclick="c.setColor(drawColor1.value)" checked>
108+
<input id="drawColor1" type="color" value="#ffffff">
109+
</div>
110+
<div class="colorSelection">
111+
<input type="radio" id="drawColorRadio2" name="drawColorRadio" value="2"
112+
onclick="c.setColor(drawColor2.value)">
113+
<input id="drawColor2" type="color" value="#999999">
114+
</div>
115+
<div class="colorSelection">
116+
<input type="radio" id="drawColorRadio3" name="drawColorRadio" value="3"
117+
onclick="c.setColor(drawColor3.value)">
118+
<input id="drawColor3" type="color" value="#aa2222">
119+
</div>
120+
<div class="colorSelection">
121+
<input type="radio" id="drawColorRadio4" name="drawColorRadio" value="4"
122+
onclick="c.setColor(drawColor4.value)">
123+
<input id="drawColor4" type="color" value="#11cc22">
124+
</div>
125+
<div class="colorSelection">
126+
<input type="radio" id="drawColorRadio5" name="drawColorRadio" value="5"
127+
onclick="c.setColor(drawColor5.value)">
128+
<input id="drawColor5" type="color" value="#1111cc">
129+
</div>
130+
<button onclick="c.fill()">Fill</button>
131+
<button onclick="c.clear()">Clear</button>
132+
</div>
133+
<canvas id="freeDrawCanvas" width="64" height="32"></canvas>
134+
135+
</div>
136+
</div>
137+
</section>
138+
139+
<section>
140+
<div class="rangeInput">
141+
<p>Back to OFF after:</p>
142+
<input id="timeoutSlider" class="slider autoload" type="range" min="10" max="3600" value="60"
143+
oninput='onTimeoutChanged(this)' />
144+
<p><output id="timeoutOutput"></output></p>
145+
<input type="submit" onclick="postValue('/timeout', timeoutSlider.value)">
146+
</div>
147+
148+
<div class="rangeInput">
149+
<p>Set brightness to:</p>
150+
<input id="brightnessSlider" class="slider autoload" type="range" min="1" max="100" value="50"
151+
oninput='brightnessOutput.value = value + "%"' />
152+
<p><output id="brightnessOutput"></output></p>
153+
<input type="submit" onclick="postValue('/brightness', Math.round(brightnessSlider.value*2.55))">
154+
</div>
155+
</section>
156+
</div>
157+
158+
<div class="footer">
159+
<p id="BUILD_FIELD">© Modisch Fabrications - Build </p>
160+
</div>
161+
162+
<div id="snackbar"></div>
163+
164+
</body>
165+
166166
</html>

0 commit comments

Comments
 (0)