Wordclock/webpage.html
2018-12-23 23:51:56 +01:00

67 lines
3.1 KiB
HTML

<!DOCTYPE html>
<html><head><title>WordClock Setup Page</title>
<style type="text/css">
#table-6 {
width: 100%
border: 1px solid #B0B0B0;
}
#table-6 tbody {
/* Kind of irrelevant unless your .css is alreadt doing something else */
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
#table-6 thead {
text-align: left;<tr><th>Three quater</th><td><input type="checkbox" name="threequater" ></td><td>Dreiviertel Joa/nei</td></tr>
}
#table-6 thead th {
background: -moz-linear-gradient(top, #F0F0F0 0, #DBDBDB 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F0F0F0), color-stop(100%, #DBDBDB));
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F0F0F0', endColorstr='#DBDBDB', GradientType=0);
border: 1px solid #B0B0B0;
color: #444;
font-size: 16px;
font-weight: bold;
padding: 3px 10px;
}
#table-6 td {
padding: 3px 10px;
}
#table-6 tr:nth-child(even) {
background: #F2F2F2;
}
</style></head>
<body>
<h1>Welcome to the WordClock</h1>
<h2>Initial Setup</h2>
Please note that all settings are mandatory<br /><br />
<form action="/" method="POST">
<table id="table-6">
<tr><th><b>WIFI-SSID</b></th><td><input id="ssid" name="ssid" value="$SSID"></td><td>SSID of the wireless network</td></tr>
<tr><th>WIFI-Password</th><td><input id="password" name="password"></td><td>Password of the wireless network</td></tr>
<tr><th>SNTP Server</th><td><input id="sntpserver" name="sntpserver" value="$SNTPSERVER"></td><td>Server to sync the time with. Only one ntp server is allowed.</tr>
<tr><th>Offset to UTC time</th><td><input id="timezoneoffset" name="timezoneoffset" value="$TIMEOFFSET"></td><td>Define the offset to UTC time in hours. For example +1 hour for Germany</tr>
<tr><th>Foreground Color</th><td><input type="color" name="fcolor" value="$HEXCOLORFG"></td><td>LED Color for all minutes, divisible by five</td></tr>
<tr><th>Background Color</th><td><input type="color" name="bcolor" value="$HEXCOLORBG"></td><td>Background LED Color</td></tr>
<tr><th>1. Minute Color</th><td><input type="color" name="colorMin1" value="$HEXCOLOR1"></td><td>First minute after</td></tr>
<tr><th>2. Minute Color</th><td><input type="color" name="colorMin2" value="$HEXCOLOR2"></td><td>Second minute after</td></tr>
<tr><th>3. Minute Color</th><td><input type="color" name="colorMin3" value="$HEXCOLOR3"></td><td>Third minute after</td></tr>
<tr><th>4. Minute Color</th><td><input type="color" name="colorMin4" value="$HEXCOLOR4"></td><td>Fourth minute after</td></tr>
<tr><th>Three quater</th><td><input type="checkbox" name="threequater" $THREEQUATER></td><td>Dreiviertel Joa/nei</td></tr>
<tr><th>Invert lines 4-6</th><td><input type="checkbox" name="inv46" $THREEQUATER></td><td>invert</td></tr>
<tr><td colspan="3"><div align="center"><input type="submit" value="Save Configuration" onclick="this.value='Submitting ..';this.disabled='disabled'; this.form.submit();"></div></td></tr>
<tr><td colspan="3"><div align="center"><input type="submit" name="action" value="Reboot"></div></td></tr>
</table>
</form>
$ADDITIONAL_LINE
</body>
</html>