me-no-dev/ESPAsyncWebServer
1
0
Fork 1
mirror of https://github.com/me-no-dev/ESPAsyncWebServer.git synced 2025-10-01 00:30:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

JS improvisations ...

Browse Source
This commit is contained in:
lorol
2020-03-13 23:41:33 -04:00
parent cc3c589133
commit f610c72612
9 changed files with 39 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
examples/SmartSwitch/1.PNG Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

BIN
examples/SmartSwitch/2.PNG Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
examples/SmartSwitch/3.PNG Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
examples/SmartSwitch/4.PNG Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
examples/SmartSwitch/AWIFIMAN.JPG
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 30 KiB

4
examples/SmartSwitch/README.md
View File

@@ -1,4 +1,6 @@
![](AWIFIMAN.JPG) ![](SCREENSHOT.PNG) ![](1.PNG) ![](2.PNG)
##
![](3.PNG) ![](4.PNG)
## SmartSwitch ## SmartSwitch
* Remote Temperature Control application with schedule (example car block heater or battery charger) * Remote Temperature Control application with schedule (example car block heater or battery charger)

BIN
examples/SmartSwitch/SCREENSHOT.PNG
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 50 KiB

24
examples/SmartSwitch/data/index.htm
View File

@@ -242,6 +242,7 @@
border-radius: 50%; border-radius: 50%;
background: white background: white
} }
</style> </style>
</head> </head>
@@ -251,13 +252,13 @@
<tr align="center"> <tr align="center">
<td colspan=3> <td colspan=3>
<form name="sched"> <form name="sched">
<label class="container">Auto&nbsp; <label class="container" id="LZ0">Auto&nbsp;&nbsp;&nbsp;
<input type="radio" name="radio" onclick="handleClick(this);" value="Z0"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z0"><span class="checkmark"></span></label>
<label class="container">M-F&nbsp; <label class="container" id="LZ1">M-F
<input type="radio" name="radio" onclick="handleClick(this);" value="Z1"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z1"><span class="checkmark"></span></label>
<label class="container">Sat <label class="container" id="LZ2">Sat
<input type="radio" name="radio" onclick="handleClick(this);" value="Z2"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z2"><span class="checkmark"></span></label>
<label class="container">Sun <label class="container" id="LZ3">Sun
<input type="radio" name="radio" onclick="handleClick(this);" value="Z3"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z3"><span class="checkmark"></span></label>
</form> </form>
</td> </td>
@@ -332,6 +333,7 @@
const MYCORS = '192.168.0.12'; const MYCORS = '192.168.0.12';
var g1, g2; var g1, g2;
var Analog0 = new Array(); var Analog0 = new Array();
var auto = true;
const successNotification = window.createNotification({ const successNotification = window.createNotification({
positionClass: 'nfc-bottom-right', positionClass: 'nfc-bottom-right',
@@ -454,9 +456,16 @@
else if (delta < -0.5) document.getElementById("W").style.backgroundColor = "#2196f3"; else if (delta < -0.5) document.getElementById("W").style.backgroundColor = "#2196f3";
break; break;
case "Clock": case "Clock":
var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thur', 'Fri', 'Sat']; var dn = parseInt(msgArray[3]);
var dayName = days[parseInt(msgArray[3])] || '*'; // 0...6 var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
var dayName = days[dn] || '*'; // 0...6
var shedtype = 0;
if (dn == 0) shedtype = 3;
else if (dn == 6) shedtype = 2;
else if ((dn > 0) && (dn < 6)) shedtype = 1;
document.getElementById('C').innerHTML = msgArray[2] + ' ' + dayName; document.getElementById('C').innerHTML = msgArray[2] + ' ' + dayName;
if (auto) document.getElementById('LZ' + shedtype).classList.add('son');
else document.getElementById('LZ' + shedtype).classList.remove('son');
break; break;
case "Setting": case "Setting":
document.getElementById('input-popup-start').value = msgArray[2]; document.getElementById('input-popup-start').value = msgArray[2];
@@ -545,6 +554,9 @@
}; };
function handleClick(e) { function handleClick(e) {
if (e.value == 'Z0' ) auto = true;
else auto = false;
document.getElementById('L' + e.value).classList.remove('son');
if (connection.readyState === WebSocket.OPEN) connection.send(e.value + "|"); if (connection.readyState === WebSocket.OPEN) connection.send(e.value + "|");
} }

24
examples/SmartSwitch/data_src/index.htm
View File

@@ -242,6 +242,7 @@
border-radius: 50%; border-radius: 50%;
background: white background: white
} }
</style> </style>
</head> </head>
@@ -251,13 +252,13 @@
<tr align="center"> <tr align="center">
<td colspan=3> <td colspan=3>
<form name="sched"> <form name="sched">
<label class="container">Auto&nbsp; <label class="container" id="LZ0">Auto&nbsp;&nbsp;&nbsp;
<input type="radio" name="radio" onclick="handleClick(this);" value="Z0"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z0"><span class="checkmark"></span></label>
<label class="container">M-F&nbsp; <label class="container" id="LZ1">M-F
<input type="radio" name="radio" onclick="handleClick(this);" value="Z1"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z1"><span class="checkmark"></span></label>
<label class="container">Sat <label class="container" id="LZ2">Sat
<input type="radio" name="radio" onclick="handleClick(this);" value="Z2"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z2"><span class="checkmark"></span></label>
<label class="container">Sun <label class="container" id="LZ3">Sun
<input type="radio" name="radio" onclick="handleClick(this);" value="Z3"><span class="checkmark"></span></label> <input type="radio" name="radio" onclick="handleClick(this);" value="Z3"><span class="checkmark"></span></label>
</form> </form>
</td> </td>
@@ -332,6 +333,7 @@
const MYCORS = '192.168.0.12'; const MYCORS = '192.168.0.12';
var g1, g2; var g1, g2;
var Analog0 = new Array(); var Analog0 = new Array();
var auto = true;
const successNotification = window.createNotification({ const successNotification = window.createNotification({
positionClass: 'nfc-bottom-right', positionClass: 'nfc-bottom-right',
@@ -454,9 +456,16 @@
else if (delta < -0.5) document.getElementById("W").style.backgroundColor = "#2196f3"; else if (delta < -0.5) document.getElementById("W").style.backgroundColor = "#2196f3";
break; break;
case "Clock": case "Clock":
var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thur', 'Fri', 'Sat']; var dn = parseInt(msgArray[3]);
var dayName = days[parseInt(msgArray[3])] || '*'; // 0...6 var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
var dayName = days[dn] || '*'; // 0...6
var shedtype = 0;
if (dn == 0) shedtype = 3;
else if (dn == 6) shedtype = 2;
else if ((dn > 0) && (dn < 6)) shedtype = 1;
document.getElementById('C').innerHTML = msgArray[2] + ' ' + dayName; document.getElementById('C').innerHTML = msgArray[2] + ' ' + dayName;
if (auto) document.getElementById('LZ' + shedtype).classList.add('son');
else document.getElementById('LZ' + shedtype).classList.remove('son');
break; break;
case "Setting": case "Setting":
document.getElementById('input-popup-start').value = msgArray[2]; document.getElementById('input-popup-start').value = msgArray[2];
@@ -545,6 +554,9 @@
}; };
function handleClick(e) { function handleClick(e) {
if (e.value == 'Z0' ) auto = true;
else auto = false;
document.getElementById('L' + e.value).classList.remove('son');
if (connection.readyState === WebSocket.OPEN) connection.send(e.value + "|"); if (connection.readyState === WebSocket.OPEN) connection.send(e.value + "|");
} }