|
| 1 | + |
| 2 | +const char ECU_HOMEPAGE [] PROGMEM = R"=====( |
| 3 | +<!DOCTYPE html><html><head><meta charset='utf-8' name='viewport' content='width=device-width, initial-scale=1'><title>ESP-ECU</title><link rel="icon" type="image/x-icon" href="/favicon.ico" /><link rel='stylesheet' type='text/css' href='/STYLESHEET_HOME'><style>body { background-color: #EEE;}span {padding: 6px;}table, th, td {border: 2px solid blue; font-size:16px; padding:6px; text-align:center; border-collapse:collapse;backgound-color:#dfff80;}tr {background-color:#ccffcc;}td { width:70px; }.btn { background-color: #199319; color: white; padding: 5px 22px; border-radius:6px;}.btn:hover {background: #eeeF; color:black;} @media only screen and (max-width: 800px) {th, td { width:60px; font-size:11px;}tr {height:35px;} .btn { padding: 5px 18px; font-size:10px;}}</style> |
| 4 | +<script type="text/javascript" src="SECURITY"></script> |
| 5 | +<script type='text/javascript'> |
| 6 | +var term,table_row;window.addEventListener("visibilitychange",(()=>{"visible"===document.visibilityState&&(getGeneral(),setTimeout(getAll,300))}));var cnt=0,totalEn=0;function loadScript(){getGeneral(),setTimeout(getAll,300)}function celbgc(e){e.startsWith("e")||e.startsWith("i")?document.getElementById(e).style="background-color:#c6ff1a":document.getElementById(e).style="background-color:#a6a6a6"}function getAll(){totalEn=0;for(let e=0;e<cnt;e++)term="get.Power?inv="+e,table_row="inv"+e,getData(e)}function getData(e){var t=new XMLHttpRequest;t.onreadystatechange=function(){if(4==this.readyState&&200==this.status){var t=this.responseText,n=JSON.parse(t),l=n.eN,o="r"+String(e);document.getElementById(o).style.display="table-row";var a="i"+String(e);document.getElementById(a).innerHTML="<a href='/details?inv="+String(e)+"'><button class='btn'>"+String(e)+"</button</a>";for(let t=0;t<4;t++)a="p"+String(e)+t,"n/e"==n.p[t]?celbgc(a):"n/a"==n.p[t]?document.getElementById(a).innerHTML=n.p[t]:document.getElementById(a).innerHTML=n.p[t].toFixed(1);celbgc(a="e"+String(e)),"n/a"!=l?(cnt>1&&(totalEn+=parseFloat(l),celbgc("e9"),document.getElementById("r9").style.display="table-row",document.getElementById("e9").innerHTML=totalEn.toFixed(2)),document.getElementById(a).innerHTML=l.toFixed(2)):document.getElementById(a).innerHTML=l,document.getElementById("noOutput").style.display="none",document.getElementById("4channel").style.display="block";const d=(new Date).toString();document.getElementById("time").innerHTML=d.substr(16,8)}},t.open("GET",term,!0),t.send()}function getGeneral(){var e=new XMLHttpRequest;e.onreadystatechange=function(){if(4==this.readyState&&200==this.status){var e=this.responseText,t=JSON.parse(e);cnt=t.cnt,console.log("getGeneral cnt = "+cnt);var n="polling from "+t.ps+" to "+t.pe;document.getElementById("times").innerHTML=n;var l=t.st,o=t.sl;0==t.rm&&(document.getElementById("ml").style.display="block"),"11"==l?document.getElementById("busy").style.display="block":(document.getElementById("busy").style.display="none",document.getElementById("failed").style.display="none"),"0"!=l&&"25"!=l||(document.getElementById("failed").style.display="block");var a=document.getElementById("maindiv");document.getElementById("sleep");"1"==o?(a.style.background="grey",document.getElementById("noOutput").style.display="none"):a.style.background="linear-gradient(#e8edc8, #c8eaed)"}},e.open("GET","get.General",!0),e.send()}if(window.EventSource){var source=new EventSource("/events");source.addEventListener("open",(function(e){console.log("Events Connected")}),!1),source.addEventListener("error",(function(e){e.target.readyState!=EventSource.OPEN&&console.log("Events Disconnected")}),!1),source.addEventListener("message",(function(e){console.log("message",e.data),"getall"==e.data&&getAll(),"general"==e.data&&getGeneral(),"reload"==e.data&&(getGeneral(),setTimeout(getAll,300))}),!1)} |
| 7 | +</script></head><body onload='loadScript()'><div id='msect'><ul><li id='ml' style='float:right; display:none'><a id='haha' href='/MENU'>menu</a></li></ul></div><div id='msect'><center><h3>ESP ECU</h3></div><div id='msect'><div class='divstijl' id='maindiv'><center><p><span id='times'></span></p><h4>POWER / ENERGY @ <span id='time'></span></h4><div id='noOutput' style='display:block'><h4 style='color:red'>waiting for output</h4></div><div id='4channel' style='display:none;'><center><table><tr style='Background-color:lightblue; font-weight:bold; text-align:center; border:4px solid black;'><td>inverter<td>panel 0<td>panel 1<td>panel 2<td>panel 3<td>kWh</td></tr><tr id='r0' style='display:none;'><td id='i0'></td><td id='p00'></td><td id='p01'></td><td id='p02'></td><td id='p03'></td><td id='e0'></td></tr><tr id='r1' style='display:none;'><td id='i1'></td><td id='p10'></td><td id='p11'></td><td id='p12'></td><td id='p13'></td><td id='e1'></td></tr><tr id='r2' style='display:none;'><td id='i2'></td><td id='p20'></td><td id='p21'></td><td id='p22'></td><td id='p23'></td><td id='e2'></td></tr><tr id='r3' style='display:none;'><td id='i3'></td><td id='p30'></td><td id='p31'></td><td id='p32'></td><td id='p33'></td><td id='e3'></td></tr><tr id='r4' style='display:none;'><td id='i4'></td><td id='p40'></td><td id='p41'></td><td id='p42'></td><td id='p43'></td><td id='e4'></td></tr><tr id='r5' style='display:none;'><td id='i5'></td><td id='p50'></td><td id='p51'></td><td id='p52'></td><td id='p53'></td><td id='e5'></td></tr><tr id='r6' style='display:none;'><td id='i6'></td><td id='p60'></td><td id='p61'></td><td id='p62'></td><td id='p63'></td><td id='e6'></td></tr><tr id='r7' style='display:none;'><td id='i7'></td><td id='p70'></td><td id='p71'></td><td id='p72'></td><td id='p73'></td><td id='e7'></td></tr><tr id='r8' style='display:none;'><td id='i8'></td><td id='p80'></td><td id='p81'></td><td id='p82'></td><td id='p83'></td><td id='e8'></td></tr><tr id='r9' style='display:none;'><td colspan='5' style='text-align:right;'>total of all inverters </td><td id='e9'></td></tr></table></div><p>Powered by Hansiart</p><div id='busy'><span style='color:red;'><h3>checking / initialyzing zigbee network...</h3></span><br></div><div id='failed' style='display:none;'><span style='color:red;'><h3>the zigbee module is not working.</h3></span><br></div></center></div></div></body></html> |
| 8 | +)====="; |
| 9 | + |
| 10 | + |
| 11 | + |
| 12 | + |
| 13 | +// this is the original javascript. Made compact via https://www.digitalocean.com/community/tools/minify |
| 14 | +/* |
| 15 | +const char JAVA_SCRIPT[] PROGMEM = R"=====( |
| 16 | +window.addEventListener('visibilitychange', () =>{ |
| 17 | + if (document.visibilityState === 'visible') { |
| 18 | + //window.location.reload();} |
| 19 | + getGeneral(); |
| 20 | + setTimeout(getAll, 300); |
| 21 | + } |
| 22 | +}) |
| 23 | +
|
| 24 | +var term; |
| 25 | +var table_row; |
| 26 | +var cnt = 0; |
| 27 | +var totalEn = 0; |
| 28 | +
|
| 29 | +function loadScript() { |
| 30 | + getGeneral(); |
| 31 | + //console.log("getGeneral done, now getAll()"); |
| 32 | + setTimeout(getAll, 300); |
| 33 | +} |
| 34 | +function celbgc(cel) { |
| 35 | + if(cel.startsWith("e") || cel.startsWith("i")) { |
| 36 | + document.getElementById(cel).style = "background-color:#c6ff1a"; } |
| 37 | + else {document.getElementById(cel).style = "background-color:#a6a6a6"; |
| 38 | + } |
| 39 | +} |
| 40 | +
|
| 41 | +function getAll() { |
| 42 | + totalEn = 0; |
| 43 | + //console.log("getAll count = " + cnt); |
| 44 | + for (let i = 0; i < cnt; i++) { |
| 45 | + term = "get.Power?inv=" + i; |
| 46 | + table_row = "inv" + i; |
| 47 | + getData(i); |
| 48 | + } |
| 49 | +
|
| 50 | +} |
| 51 | +
|
| 52 | +function getData(invnr) { |
| 53 | + var xhttp = new XMLHttpRequest(); |
| 54 | + xhttp.onreadystatechange = function() { |
| 55 | + if (this.readyState == 4 && this.status == 200) { |
| 56 | + var antwoord = this.responseText; |
| 57 | + //console.log("inverter = " + invnr); |
| 58 | + var obj = JSON.parse(antwoord); |
| 59 | + //cnt = obj.cnt; |
| 60 | + //console.log("cnt = " + cnt); |
| 61 | + var eN = obj.eN; |
| 62 | + |
| 63 | + var regel = "r" + String(invnr); |
| 64 | + document.getElementById(regel).style.display="table-row"; |
| 65 | + var cel = "i" + String(invnr); |
| 66 | + //document.getElementById(cel).innerHTML = String(invnr); |
| 67 | + document.getElementById(cel).innerHTML = "<a href='/details?inv=" + String(invnr) + "'><button class='btn'>" + String(invnr) + "</button</a>"; |
| 68 | + var cel; |
| 69 | + for (let z=0; z < 4 ; z++) { |
| 70 | + //console.log("obj.p[z] = " + obj.p[z]); |
| 71 | + cel = "p" + String(invnr) + z; |
| 72 | + if (obj.p[z] == "n/e" ) { |
| 73 | + celbgc(cel); |
| 74 | + } |
| 75 | + else |
| 76 | + if (obj.p[z] == "n/a" ) {document.getElementById(cel).innerHTML = obj.p[z];} |
| 77 | + else { |
| 78 | + document.getElementById(cel).innerHTML = obj.p[z].toFixed(1); |
| 79 | + } |
| 80 | + } |
| 81 | +
|
| 82 | + cel = "e" + String(invnr); |
| 83 | + celbgc(cel); |
| 84 | + |
| 85 | + if(eN != "n/a") { |
| 86 | + if(cnt > 1){ |
| 87 | + totalEn = totalEn + parseFloat(eN); |
| 88 | + celbgc("e9"); |
| 89 | + document.getElementById("r9").style.display="table-row"; |
| 90 | + document.getElementById("e9").innerHTML = totalEn.toFixed(2); |
| 91 | + } |
| 92 | + document.getElementById(cel).innerHTML = eN.toFixed(2); |
| 93 | + } else { |
| 94 | + document.getElementById(cel).innerHTML = eN; |
| 95 | + } |
| 96 | + |
| 97 | + document.getElementById("noOutput").style.display = "none"; |
| 98 | + document.getElementById("4channel").style.display = "block"; |
| 99 | + const d = new Date().toString(); |
| 100 | + document.getElementById("time").innerHTML = d.substr(16,8); |
| 101 | + } |
| 102 | + } |
| 103 | + xhttp.open("GET", term, true); |
| 104 | + xhttp.send(); |
| 105 | +} |
| 106 | +
|
| 107 | +function getGeneral() { |
| 108 | +// console.log("term = " + term); |
| 109 | + var xhttp = new XMLHttpRequest(); |
| 110 | + xhttp.onreadystatechange = function() { |
| 111 | + if (this.readyState == 4 && this.status == 200) { |
| 112 | + var antwoord = this.responseText; |
| 113 | +// console.log("answer = " + antwoord); |
| 114 | + var obj = JSON.parse(antwoord); |
| 115 | + cnt = obj.cnt; |
| 116 | + console.log("getGeneral cnt = " + cnt); |
| 117 | + var times = "polling from " + obj.ps + " to " + obj.pe; |
| 118 | + document.getElementById("times").innerHTML=times; |
| 119 | + var st = obj.st; |
| 120 | + var sl = obj.sl; |
| 121 | + var rem = obj.rm; |
| 122 | + if(rem == 0) {document.getElementById("ml").style.display = "block";} // hide menu link |
| 123 | + if(st == "11") { |
| 124 | + document.getElementById("busy").style.display = "block"; |
| 125 | + } else { |
| 126 | + document.getElementById("busy").style.display = "none"; |
| 127 | + document.getElementById("failed").style.display = "none"; |
| 128 | + } |
| 129 | + if(st == "0" || st == "25") { |
| 130 | + document.getElementById("failed").style.display = "block"; |
| 131 | + } |
| 132 | + var main = document.getElementById("maindiv") |
| 133 | + var slp = document.getElementById("sleep") |
| 134 | + if(sl == "1") { |
| 135 | + main.style.background="grey"; |
| 136 | + document.getElementById("noOutput").style.display = "none"; |
| 137 | + } else { |
| 138 | + main.style.background="linear-gradient(#e8edc8, #c8eaed)"; |
| 139 | + } |
| 140 | + } |
| 141 | + } |
| 142 | + xhttp.open("GET", "get.General", true); |
| 143 | + xhttp.send(); |
| 144 | +
|
| 145 | +} |
| 146 | +
|
| 147 | +
|
| 148 | +if (!!window.EventSource) { |
| 149 | + var source = new EventSource('/events'); |
| 150 | +
|
| 151 | + source.addEventListener('open', function(e) { |
| 152 | + console.log("Events Connected"); |
| 153 | + }, false); |
| 154 | + source.addEventListener('error', function(e) { |
| 155 | + if (e.target.readyState != EventSource.OPEN) { |
| 156 | + console.log("Events Disconnected"); |
| 157 | + } |
| 158 | + }, false); |
| 159 | +
|
| 160 | + source.addEventListener('message', function(e) { |
| 161 | + console.log("message", e.data); |
| 162 | + if(e.data == "getall") { |
| 163 | + getAll(); |
| 164 | + } |
| 165 | + if(e.data == "general") { |
| 166 | + getGeneral(); |
| 167 | + } |
| 168 | + if (e.data == "reload") { |
| 169 | + //window.location.reload(1); |
| 170 | + getGeneral(); |
| 171 | + setTimeout(getAll, 300); |
| 172 | + } |
| 173 | + }, false); |
| 174 | +} |
| 175 | +
|
| 176 | +)====="; |
| 177 | +*/ |
0 commit comments