123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136 |
- /* clang-format off */
- #ifdef FIRMWARE_VARIANT_HEATCONTROL
- static const char html_main_script[] PROGMEM = R"=====(
- <script>
- function g(i) { return document.getElementById(i) };
- var xhttp, updateTime, reqTime, reqFin;
- function sendBtn(btn, conf) {
- var frmn='BtnFrm'+btn;
- var form = g(frmn);
- if(conf !== undefined) {
- if(confirm(conf)) return transmit(form);
- else return false;
- }
- else return transmit(form);
- }
- function transmit(f) {
- if (!xhttp) {
- reqTime = 0;
- reqFin = false;
- xhttp = new XMLHttpRequest();
- xhttp.timeout = 1000;
- xhttp.overrideMimeType("application/json");
- xhttp.open('POST', 'api');
- xhttp.send(f ? (new FormData(f)) : '');
- xhttp.onreadystatechange = function () {
- if (xhttp.readyState === XMLHttpRequest.DONE && xhttp.status === 200) {
- var data = JSON.parse(xhttp.responseText);
- if(data.heatReq == '1') { g('heatReq').innerHTML = 'ACTIVE'; g('heatReq').style = 'color:red;'; }
- else { g('heatReq').innerHTML = 'INACTIVE'; g('heatReq').style = 'color:black;'; }
- if(data.statHeat == '1') { g('statHeat').innerHTML = 'ACTIVE'; g('statHeat').style = 'color:red;'; }
- else { g('statHeat').innerHTML = 'INACTIVE'; g('statHeat').style = 'color:black;'; }
- if(data.outHeat == '1') { g('outHeat').innerHTML = 'ACTIVE'; g('outHeat').style = 'color:red;'; }
- else { g('outHeat').innerHTML = 'INACTIVE'; g('outHeat').style = 'color:black;'; }
- if(data.outPump == '1') { g('outPump').innerHTML = 'ACTIVE'; g('outPump').style = 'color:red;'; }
- else { g('outPump').innerHTML = 'INACTIVE'; g('outPump').style = 'color:black;'; }
- if(data.pumpNL == '0') { g('pumpNL').innerHTML = 'INACTIVE'; g('pumpNL').style = 'color:black;'; }
- else { g('pumpNL').innerHTML = data.pumpNL + ' min'; g('pumpNL').style = 'color:red;'; }
- if(data.statTest == '1') { g('statTest').innerHTML = 'ACTIVE'; g('statTest').style = 'color:red;'; }
- else { g('statTest').innerHTML = 'INACTIVE'; g('statTest').style = 'color:black;'; }
- if(data.cDisHeat == '1') { g('cDisHeat').innerHTML = 'ACTIVE'; g('cDisHeat').style = 'color:red;'; }
- else { g('cDisHeat').innerHTML = 'INACTIVE'; g('cDisHeat').style = 'color:black;'; }
- if(data.cDisPump == '1') { g('cDisPump').innerHTML = 'ACTIVE'; g('cDisPump').style = 'color:red;'; }
- else { g('cDisPump').innerHTML = 'INACTIVE'; g('cDisPump').style = 'color:black;'; }
- if(data.tempFeed !== undefined) g('tempFeed').innerHTML = data.tempFeed + '°';
- if(data.tempReturn !== undefined) g('tempReturn').innerHTML = data.tempReturn + '°';
- if(data.tempOut !== undefined) g('tempOut').innerHTML = data.tempOut + '°';
- if(data.temp !== undefined && data.hum !== undefined) g('currTempHum').innerHTML = data.temp.toFixed(1) + '° ' + data.hum.toFixed(0) + '%';
- else if(data.temp !== undefined) g('currTempHum').innerHTML = data.temp.toFixed(1) + '°';
-
- var APname;
- if(data.WiFiNum == 1) APname='Default-AP';
- else if(data.WiFiNum == 1) APname='Fallback-AP';
-
- if(data.ssid !== undefined && data.WiFiNum !== undefined && data.WiFiNum > 0) g('ssid').innerHTML = data.ssid + ' (' + APname + ')';
- else if(data.ssid !== undefined) g('ssid').innerHTML = data.ssid;
- if(data.mqttstate !== undefined) {
- if(data.mqttstate == "CONNECTED") { g('mqttstate').innerHTML = ' connected to <i>' + data.mqtthost + '</i>'; }
- else g('mqttstate').innerHTML = data.mqttstate;
- }
- if(data.uptime !== undefined) g('uptime').innerHTML = data.uptime;
-
- if(data.date !== undefined) g('date').innerHTML = data.date;
- else g('date').innerHTML = '-';
-
- if(data.time !== undefined) g('time').innerHTML = data.time;
- else g('time').innerHTML = '-';
-
- if(data.mqttreconn !== undefined) g('mqttreconn').innerHTML = data.mqttreconn;
-
- xhttp = null;
- updateTime = 0;
- reqFin = true;
- }
- else {
- if(!reqFin && reqTime > 10) {
- xhttp = null;
- reqFin = true;
- }
- }
- }
- }
- return false;
- }
- function init() {
- transmit();
- }
- setInterval(transmit, 2500);
- </script>
- )====="; // html_main_script
- static const char html_main_body_app[] PROGMEM = R"=====(
- <p><b>Status</b></p>
- <table style='width:100%'>
- <tr><td style='width:50%'>Heat Demand </td><td><b><span id='heatReq'></span></td></tr>
- <tr><td> </td><td> </td></tr>
- <tr><td>Heating Control</td><td><b><span id='outHeat'></span></b></td></tr>
- <tr><td>Heating Feedback</td><td><b><span id='statHeat'></span></td></tr>
- <tr><td> </td><td> </td></tr>
- <tr><td>Pump Control</td><td><b><span id='outPump'></span></b></td></tr>
- <tr><td>Pump Backlash </td><td><b><span id='pumpNL'></span></b></td></tr>
- <tr><td> </td><td> </td></tr>
- <tr><td>Test Mode </td><td><b><span id='statTest'></span></b></td></tr>
- <tr><td> </td><td> </td></tr>
- </table>
- <div></div>
- <div></div>
- <p><b>Bypass Control</b></p>
- <table style='width:100%'>
- <tr><td style='width:50%'>Heating </td><td><b><span id='cDisHeat'></span></b></td></tr>
- <tr><td>Pump </td><td><b><span id='cDisPump'></span></b></td></tr>
- </table>
- <div></div>
- <div></div>
- <p><b>Temperatures</b></p>
- <table style='width:100%'>
- <tr><td style='width:50%'>Heating Feed </td><td><b><span id='tempFeed'></span></td></tr>
- <tr><td>Heating Return </td><td><b><span id='tempReturn'></span></td></tr>
- <tr><td>Outside </td><td><b><span id='tempOut'></span></b></td></tr>
- <tr><td>Heating Room </td><td><b><span id='currTempHum'></span></td></tr>
- </table>
- )====="; // html_main_body_app
- #endif
|