<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Home - RN+ Smartswitch</title> <link rel="stylesheet" type="text/css" href="style.css"> <script src="switchery.min.js"></script> </head> <body onload="start()"> <div class="header"> <div class="float_left"> <h1><a href="http://www.rnplus.nl">RN+</a> SMARTSWITCH</h1> </div> <div class="float_right"><a href="/">Home</a>&nbsp;<a href="/wifi">Network settings</a></div> </div> <div class="home"> <table> <tr><td>Output 1</td><td class="switch"><input type="checkbox" class="js-switch1" %output1check% /></td><td class="check"><div class="js-check1">%output1state%</div></td></tr> <tr><td>Output 2</td><td class="switch"><input type="checkbox" class="js-switch2" %output2check% /></td><td class="check"><div class="js-check2">%output2state%</div></td></tr> <tr><td>Temperature</td><td><div class="temperature">---</div></td><td>°C</td></tr> <tr><td>Humidity</td><td><div class="humidity">---</div></td><td>%p%</td></tr> </table> <!-- <p>You can download the raw <a href="flash.bin">contents</a> of the SPI flash rom</p> --> <!-- <p>Page has been loaded <b>%counter%</b> times.</p> --> </div> <script> var switch1 = document.querySelector('.js-switch1'); var switch2 = document.querySelector('.js-switch2'); var init1 = new Switchery(switch1, { color: '#268BD2' }); var init2 = new Switchery(switch2, { color: '#268BD2' }); var check1 = document.querySelector('.js-check1'); var check2 = document.querySelector('.js-check2'); var temperature = document.querySelector('.temperature'); var humidity = document.querySelector('.humidity'); var cnt = 0;function get(url) {var xmlhttp;if (window.XMLHttpRequest){xmlhttp=new XMLHttpRequest();}else{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.open("GET",url,false);xmlhttp.send();return xmlhttp.responseText;}function getoutput() { var output1 = get("output/1/get"); var output2 = get("output/2/get"); if (output1==1) { check1.innerHTML = "On"; switch1.checked = true; } else { check1.innerHTML = "Off"; switch1.checked = false; } if (output2==1) { check2.innerHTML = "On"; switch2.checked = true; } else { check2.innerHTML = "Off"; switch2.checked = false; } } function gettemperature() { temperature.innerHTML = get("temperature"); } function gethumidity() { humidity.innerHTML = get("humidity"); } function getsomething() { if (cnt == 0) { gettemperature() } if (cnt == 1) { gethumidity() } if (cnt == 2) { getoutput() } cnt++; if (cnt > 2) { cnt = 0 } } function start() { gettemperature(); gethumidity(); setInterval(function () {getsomething()}, 5000); } switch1.onchange = function() { var state = 0; if (switch1.checked) { state = 1; } var result = get("output/1/set?state="+state); if (result==1) { check1.innerHTML = "On"; } else { check1.innerHTML = "Off"; } }; switch2.onchange = function() { var state = 0; if (switch2.checked) { state = 1; } var result = get("output/2/set?state="+state); if (result==1) { check2.innerHTML = "On"; } else { check2.innerHTML = "Off"; } }; </script> </body> </html>
