ESPIoTBase/src/html_confTherm.h

/* clang-format off */

//static const char html_confbas_script[] PROGMEM = R"=====(
//<script>
//  function g(i) { return document.getElementById(i) };
//  function sp(i){g(i).type=(g(i).type==='text'?'password':'text');}
//  var xhttp, reqTime, reqFin;
//  function setCbx(el, da) {
//    if(da == '1') {
//      el.checked = true;
//      el.style.visibility = 'visible';
//    }
//    else {
//      el.checked = false;
//      el.style.visibility = 'visible';
//    }
//  }
//  function updCbxVal(el) {
//    if (el.checked) el.value = '1';
//    else {
//      el.checked = true;
//    el.value = '0';
//      el.style.visibility = 'hidden';
//    }
//  }

static const char html_confTherm_script[] PROGMEM = R"=====(
  function transmit(f) {
    if (!xhttp) {   
    reqTime = 0;
    reqFin = false;
    updCbxVal(g('autoSaveTemp'));
    updCbxVal(g('autoSaveMode'));
    updCbxVal(g('saveToMqttRet'));
    updCbxVal(g('PIRenDispPs0'));
    updCbxVal(g('togTHdisp'));
    xhttp = new XMLHttpRequest();
    xhttp.timeout = 1000;
    xhttp.overrideMimeType('application/json');
    xhttp.open('POST', 'confDataTherm');
    xhttp.send(f ? (new FormData(f)) : '');
    xhttp.onreadystatechange = function () {
      if (xhttp.readyState === XMLHttpRequest.DONE && xhttp.status === 200) {
        var data = JSON.parse(xhttp.responseText);
        g('tempMin').value = data.tempMin;
        g('tempMax').value = data.tempMax;
        setCbx(g('autoSaveTemp'), data.autoSaveTemp);
        setCbx(g('autoSaveMode'), data.autoSaveMode);
        setCbx(g('saveToMqttRet'), data.saveToMqttRet);
        setCbx(g('PIRenDispPs0'), data.PIRenDispPs0);
        setCbx(g('togTHdisp'), data.togTHdisp);
        g('tempDec').value = data.tempDec;
        g('hyst').value = data.hyst;
        g('minOffTime').value = data.minOffTime;
        g('offMsg').value = data.offMsg;
        g('iTempLab').value = data.iTempLab;
        g('oTempLab').value = data.oTempLab;
        g('modeName1').value = data.modeName1;
        g('modeName0').value = data.modeName0;
        g('psetName0').value = data.psetName0;
        g('psetName1').value = data.psetName1;
        g('psetName2').value = data.psetName2;
        g('pauseTout').value = data.pauseTout;
        xhttp = null;
        reqFin = true;
       }
       else {
         if(!reqFin && reqTime > 10) {
           xhttp = null;
           reqFin = true;
         }
       }
     }
   }
    return false;
  }
  //transmit();
  function saveConf() {
    updCbxVal(g('autoSaveTemp'));
    updCbxVal(g('autoSaveMode'));
    updCbxVal(g('saveToMqttRet'));
    updCbxVal(g('PIRenDispPs0'));
    updCbxVal(g('togTHdisp'));
    g('frmConf').submit();
  }
  function init() {
    transmit();
  }
)====="; // html_confTherm_script
//  setInterval(function () { ++reqTime; }, 1000);
//</script>
//)====="; // html_confTherm_script

static const char html_confTherm_body[] PROGMEM = R"=====(
<b>Configuration - Thermostat</b>
<div class='config'>
<form id='frmConf' action='setConfTherm' method='POST'>
<br>
<fieldset>
<legend>Thermostat</legend>
<p><b>Minimum Set Temperature [°C]</b><br><input type='text' name='tempMin' id='tempMin'></p>
<p><b>Maximum Set Temperature [°C]</b><br><input type='text' name='tempMax' id='tempMax'></p>
</fieldset>
<div></div><br>
<fieldset>
<legend>Auto Save</legend>
<p><b>Temperature *</b>&nbsp;<input type='checkbox' name='autoSaveTemp' id='autoSaveTemp'/></p>
<p><b>Mode/Preset *</b>&nbsp;<input type='checkbox' name='autoSaveMode' id='autoSaveMode'/></p>
<p class='n'>To minimize flash writes, this can also be <br>
achieved by using MQTT with retain flag, when using <br>
an external controller, especially for Mode/Preset, <br>
as these will change frequently in most cases. <br>
WiFiThermostat will receive the last value from retained MQTT <br>
message automatically on startup/reconnect.</p>
<p><b>Preserve States MQTT retained</b>&nbsp;<input type='checkbox' name='saveToMqttRet' id='saveToMqttRet'/></p>
</fieldset>

<div></div><br>
<fieldset>
<legend>Thermostat - Advanced</legend>
<p><b>Hysteresis [°C]</b><br><input type='text' name='hyst' id='hyst'></p><br>

<p><b>Min. Heating Off-Time [s]</b><br><input type='number' name='minOffTime' id='minOffTime'></p>
<p class='n'>Heating stays off for at least [x] seconds before it <br>can start again.</p><br>

<p><b>Set Temp. Decrease Value **</b><br><input type='text' name='tempDec' id='tempDec'></p>
<p class='n'>** the actual set temperatur is decreased by that value.<br>Can be a fraction. Can be used to prevent over-heating <br>when the thermostat is badly placed.<br></p><br>

<p><b>Heating Pause Timeout [s]</b><br><input type='text' name='pauseTout' id='pauseTout'></p>
<p class='n'>Heating Pause can be enabled via MQTT /cmd/setPause=1. <br>
Set Timeout in seconds here.</p><br>
</fieldset>
<div></div><br>

<fieldset>
<legend>Names and Labels</legend>
<p class='n'>Used in some MQTT status/commands, <br>and also for the LCD and Web interface.<br></p><br>
<p><b>Off-Message</b><br><input type='text' name='offMsg' id='offMsg'></p>
<p class='n'>Shown on LCD in OFF mode. <br><b>max. 13 chars!</b></p>
<br>
<p>Labels</p>
<p class='n'>Used on LCD to identify the data displayed. <br><b>MUST be 1 char</b> or empty for default</p>
<p><b>Inside</b><br><input type='text' name='iTempLab' id='iTempLab'/></p>
<p><b>Outside</b><br><input type='text' name='oTempLab' id='oTempLab'/></p>
<br>
<p>Mode</p>
<p class='n'>Used in web interface and for Home Assistant <br>MQTT Climate component support. <br>Should be 'heat' and 'off' normally. <br><b>Case sensitive! Lower case recommended.</b><br>Web interface shows all in capitals.</p>
<p><b>On</b><br><input type='text' name='modeName1' id='modeName1'></p>
<p><b>Off</b><br><input type='text' name='modeName0' id='modeName0'></p>
<br>
<p>Preset Names</p>
<p class='n'>Used in web interface and for Home Assistant <br>MQTT Climate component support.<br>
Also shown on LCD at preset change, <br>therefore may not exceed <b>13 chars!</b><br><b>Case sensitive!</b> Type exactly as in HA!</p>
<p><b>Normal *</b><br><input type='text' name='psetName0' id='psetName0'></p>
<p class='n'>* always sends/receives "<i>none</i>" as this is hardcoded in <br>Home Assistant MQTT Climate component</p>
<p><b>Reduction 1 **</b><br><input type='text' name='psetName1' id='psetName1'></p>
<p><b>Reduction 2 **</b><br><input type='text' name='psetName2' id='psetName2'></p>
<p class='n'>** sent/received as defined</p>
</fieldset>

<div></div><br>
<fieldset>
<legend>Display</legend>
<p><b>PIR enables LCD backlight <br>only in normal heating mode</b>&nbsp;<input type='checkbox' name='PIRenDispPs0' id='PIRenDispPs0'/></p>
<br>
<p><b>Toggling I/O-Temp/Hum on LCD</b>&nbsp;<input type='checkbox' name='togTHdisp' id='togTHdisp'/></p>
</fieldset>
<br>
</form>
<div></div>
<table style='width:100%'>
<td style='width:50%'><button onclick='location="conf";' class='bgrey'>Cancel</button></td>
<td style='width:50%'><button onclick='return saveConf()' class='bred'>Save</button></td>
</tr></table>
</div>
)====="; // html_confTherm_body