Initial commit: Haussteuerung V2/V3 Web-Interface
This commit is contained in:
Thebille
@@ -0,0 +1,307 @@
|
||||
<!-- AWP_In_Variable Name='"Steckdose Deele Garder"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Wohnen"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Essen"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Arbeiten"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Kind 1"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Bad / WC"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Kind 2"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Eltern"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Gäste"' -->
|
||||
<!-- AWP_In_Variable Name='"Steckdose Dusche Abstell"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."Funksteckdose 1 an"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."Funksteckdose 1 aus"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."KDY 1 an"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."KDY 1 aus"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."KDY 2 an"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."KDY 2 aus"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."Funksteckdose 4 an"' -->
|
||||
<!-- AWP_In_Variable Name='"Arduino Settimio"."Funksteckdose 4 aus"' -->
|
||||
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
|
||||
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
|
||||
|
||||
<head>
|
||||
<title>TTh</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
|
||||
<link href="form.css" rel="stylesheet" type="text/css" />
|
||||
<style type="text/css">
|
||||
.auto-style1 {
|
||||
color: #FF0000;
|
||||
font-family: "Arial";
|
||||
}
|
||||
.auto-style4 {
|
||||
font-family: "Arial";
|
||||
font-size: x-large;
|
||||
text-align: left;
|
||||
}
|
||||
.auto-style5 {
|
||||
font-family: "Arial";
|
||||
font-size: x-large;
|
||||
text-align: center;
|
||||
}
|
||||
.auto-style6 {
|
||||
color: #000000;
|
||||
font-size: xx-small;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<script src="Script/tth_script.js" type="text/javascript"> </script>
|
||||
|
||||
</head>
|
||||
|
||||
<body style="color: #00FF00; background-color: #000000">
|
||||
|
||||
<div id="masthead">
|
||||
</div>
|
||||
<div id="top_nav">
|
||||
</div>
|
||||
<div id="container">
|
||||
|
||||
<div id="page_content">
|
||||
<div class="ui-card">
|
||||
<table border="1" align="left" class="ui-table">
|
||||
<tr>
|
||||
<td class="auto-style1">Deele</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Deele Garder"' type="hidden" value=1>
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Deele Garder"' type="hidden" value=0>
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon1" class="ui-icon" height="75" width="37" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="auto-style1">Wohnzimmer</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Wohnen"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Wohnen"' type="hidden" value="0">
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon2" class="ui-icon" height="75" width="37" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Esszimmer</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Essen"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Essen"' type="hidden" value="0">
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon3" class="ui-icon" height="75" width="37" /><br>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Arbeitszimmer</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Arbeiten"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Arbeiten"' type="hidden" value="0">
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon4" class="ui-icon" height="75" width="37" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Steckdose Noah</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Kind 1"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Kind 1"' type="hidden" value="0">
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon5" class="ui-icon" height="75" width="37" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Steckdose Mika</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Kind 2"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Kind 2"' type="hidden" value="0">
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon6" class="ui-icon" height="75" width="37" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Steckdose Niko</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Gäste"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Gäste"' type="hidden" value="0">
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon7" class="ui-icon" height="75" width="37" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Steckdose Eltern</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Steckdose Eltern"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Steckdose Eltern"' type="hidden" value="0">
|
||||
</form>
|
||||
</td>
|
||||
<td class="auto-style5" style="width: 160px">
|
||||
<img id="strom_icon8" class="ui-icon" height="75" width="37" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Funksteckdose 1</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Arduino Settimio"."Funksteckdose 1 an"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Arduino Settimio"."Funksteckdose 1 aus"' type="hidden" value="1">
|
||||
</form>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Saunalampe</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Arduino Settimio"."KDY 1 an"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Arduino Settimio"."KDY 1 aus"' type="hidden" value="1">
|
||||
</form>
|
||||
</tr>
|
||||
|
||||
<td class="auto-style1">KDY2</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Arduino Settimio"."KDY 2 an"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Arduino Settimio"."KDY 2 aus"' type="hidden" value="1">
|
||||
</form>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="auto-style1">Poolpumpe</td>
|
||||
<td>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--on" style="height: 45px; width: 100px" type="submit" value="an">
|
||||
<input name='"Arduino Settimio"."Funksteckdose 4 an"' type="hidden" value="1">
|
||||
</form>
|
||||
<form action="" method="post">
|
||||
<input class="ui-btn ui-btn--off" style="height: 45px; width: 100px" type="submit" value="aus">
|
||||
<input name='"Arduino Settimio"."Funksteckdose 4 aus"' type="hidden" value="1">
|
||||
</form>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="footer">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
function showDataTable()
|
||||
{
|
||||
if (window.XMLHttpRequest) {
|
||||
// code fuer IE7+, Firefox, Chrome, Opera, Safari
|
||||
xmlhttp = new XMLHttpRequest();
|
||||
} else {
|
||||
// code fuer IE6, IE5
|
||||
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
|
||||
}
|
||||
|
||||
xmlhttp.open("GET", "steckdosen_state.html", true);
|
||||
|
||||
xmlhttp.onreadystatechange = function()
|
||||
{
|
||||
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
|
||||
{
|
||||
document.getElementById("OutputArea").innerHTML = xmlhttp.responseText;
|
||||
// Refresh Timeout zum Neuladen der Daten setzen
|
||||
|
||||
for (i = 1; i <= 8; i++) {
|
||||
var status = document.getElementById('stromx' + i).innerText;
|
||||
strom_icon(('strom_icon' + i), status);
|
||||
}
|
||||
|
||||
setTimeout("refreshOutputArea()", 1000);
|
||||
}
|
||||
}
|
||||
xmlhttp.send(null);
|
||||
}
|
||||
|
||||
function refreshOutputArea()
|
||||
{
|
||||
showDataTable();
|
||||
}
|
||||
|
||||
window.onload = function()
|
||||
{
|
||||
refreshOutputArea();
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="OutputArea" style="position:fixed;clip:rect(0,0,0,0);overflow:hidden;"></div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user