Added latest updates, make history page more useful

Author: steadramon

ESPGeiger/src/Counter/Counter.cpp

@@ -32,6 +32,7 @@
 #include "../GRNG/GRNG.h"
 #include "../WebPortal/WebPortal.h"
 #include "../UdpBlip/UdpBlip.h"
+#include "HIST_JS.gz.h"
 #ifdef ESPG_HV_ADC
 #include "../HV/HV.h"
 #endif
@@ -232,6 +233,15 @@ void Counter::save_lifetime() {
   rtc_life_stash(0, 0);
 }
 
+unsigned long Counter::get_lifetime_seconds() const {
+  unsigned long live = _lifetime_seconds_saved;
+  if (_last_save_time_t > 0 && ntpclient.synced) {
+    time_t now = time(nullptr);
+    if ((uint32_t)now >= _last_save_time_t) live += (uint32_t)now - _last_save_time_t;
+  }
+  return live;
+}
+
 void Counter::reset_lifetime() {
   total_clicks_lifetime = 0;
   total_clicks_lifetime_rollover = 0;
@@ -583,48 +593,73 @@ static void hJson(EGHttpRequest& req, EGHttpResponse& res, void*) {
   res.endChunked();
 }
 
-// /hist is a pure-JS render: lifetime block, 24h bar chart, hour table.
-// All values come from /clicks (single source of truth).
+// /hist body + /histjs. All values come from /clicks.
 static const char HISTORY_BODY[] PROGMEM = R"HTML(
 <div id=lf style=display:none><h2>Lifetime</h2><div class=card><div id=g2>
 <div><span class=muted>Clicks </span><b id=lfc>&mdash;</b></div>
-<div><span class=muted>&micro;Sv </span><b id=lfs>&mdash;</b></div>
+<div><span class=muted><span class=usvL data-on=µR data-off=µSv>&micro;Sv</span> </span><b id=lfs class=usv>&mdash;</b></div>
 <div><span class=muted>Tracked </span><b id=lfd>&mdash;</b></div>
 <div><span class=muted>Install age </span><b id=lfi>&mdash;</b></div>
 <div><span class=muted>Avg CPM </span><b id=lfa>&mdash;</b></div>
 </div><p style="margin:.8em 0 0"><button class=danger onclick="if(confirm('Reset lifetime counters?'))fetch('/life/reset',{method:'POST'}).then(()=>location.reload())">Reset lifetime</button></p></div></div>
 <h2>Last 24 hours</h2>
-<div id=bc style="display:flex;align-items:flex-end;gap:1px;height:80px;margin:.4em 0 1em;border-bottom:1px solid var(--border)"></div>
+<div class=card style="margin:.4em 0"><div id=g2>
+<div><span class=muted>Today </span><b id=hsT>&mdash;</b></div>
+<div><span class=muted>Yesterday </span><b id=hsY>&mdash;</b></div>
+<div><span class=muted id=hsAL>24h avg CPM </span><b id=hsA>&mdash;</b></div>
+<div><span class=muted>24h peak CPM </span><b id=hsP>&mdash;</b></div>
+<div><span class=muted>Today vs yesterday </span><b id=hsD>&mdash;</b></div>
+</div></div>
+<div id=bc style="display:flex;align-items:flex-end;gap:1px;height:80px;max-height:80px;width:100%;overflow:hidden;margin:.4em 0 1em;border-bottom:1px solid var(--border)"></div>
 <table>
-<thead><tr><th>Date</th><th>Clicks</th><th>Avg CPM</th><th>&micro;Sv</th></tr></thead>
+<thead><tr><th>Date</th><th>Clicks</th><th>Avg CPM</th><th><span class=usvL>&micro;Sv</span></th></tr></thead>
 <tbody id=tb></tbody>
 </table>
-<script>
+<script src=/histjs)HTML" EG_CACHE_BUST R"HTML(></script>
+)HTML";
+
+static const char HIST_JS[] PROGMEM = R"JS(
 fetch('/clicks').then(r=>r.json()).then(o=>{
-  var tb=byID('tb'),
+  var $=byID,N=Date.now()/1000|0,T=o.today||0,Y=o.yesterday||0,
+      tb=$('tb'),
       start='start' in o?new Date(o.start*1000):new Date(Date.now()-o.uptime*1000),
       rlv='roll' in o?o.roll*1000:3600000,
-      rows='',mx=0;
+      rows='',mx=0,sum=0,
+      F=s=>s>=86400?(s/86400).toFixed(1)+'d':s>=3600?(s/3600).toFixed(1)+'h':s>=60?(s/60|0)+'m':s+'s';
   if('life' in o){
-    var L=o.life;
-    var fmtDur=function(s){return s>=86400?(s/86400).toFixed(1)+'d':s>=3600?(s/3600).toFixed(1)+'h':s>=60?Math.floor(s/60)+'m':s+'s'};
-    byID('lfc').textContent=L.clk.toLocaleString();
-    byID('lfs').textContent=(L.clk/60/o.ratio).toFixed(3);
-    // Fallback to wall-clock-since-fbt for firmware predating the secs field.
-    var ts=L.secs>0?L.secs:(L.fbt>0?Math.floor(Date.now()/1000)-L.fbt:0);
-    if(ts>0){
-      byID('lfd').textContent=fmtDur(ts);
-      byID('lfa').textContent=(L.clk*60/ts).toFixed(1);
-    }
-    if(L.fbt>0) byID('lfi').textContent=fmtDur(Math.floor(Date.now()/1000)-L.fbt);
-    byID('lf').style.display='';
+    var L=o.life,ts=L.secs>0?L.secs:(L.fbt>0?N-L.fbt:0);
+    $('lfc').textContent=L.clk.toLocaleString();
+    setUsv($('lfs'),L.clk/60/o.ratio);
+    if(ts>0){$('lfd').textContent=F(ts);$('lfa').textContent=(L.clk*60/ts).toFixed(1)}
+    if(L.fbt>0)$('lfi').textContent=F(N-L.fbt);
+    $('lf').style.display='';
   }
-  o.last_day.forEach(function(n){if(n>mx)mx=n});
+  var nowMs=Date.now(),curB=Math.floor(nowMs/rlv)*rlv,pk=0,bs=o.start*1000;
+  o.last_day.forEach((n,i)=>{
+    sum+=n;if(n>mx)mx=n;
+    var sd=curB-i*rlv,ed=i?sd+rlv:nowMs;
+    if(i===o.last_day.length-1&&sd<bs)sd=bs;
+    var ms=ed-sd;
+    if(ms>0){var r=n*60000/ms;if(r>pk)pk=r}
+  });
+  $('hsT').textContent=T.toLocaleString();
+  $('hsY').textContent=Y.toLocaleString();
+  var es='start' in o?Math.max(0,N-o.start):o.uptime||0,
+      h60=rlv>=3600000&&es>=3600,
+      cpmA=h60?((o.last_day[1]||0)*(60-new Date().getMinutes())/60+(o.last_day[0]||0))/60
+              :es>0?sum*60/Math.min(es,86400):0,
+      p=Y>0?(T-Y)*100/Y:0;
+  $('hsA').textContent=Math.round(cpmA);
+  $('hsAL').textContent=(h60?'1h ':'')+'avg CPM ';
+  $('hsP').textContent=Math.round(pk);
+  $('hsD').textContent=Y>0?(p>=0?'+':'')+p.toFixed(1)+'%':'—';
   if(mx<1)mx=1;
   var bars='';
-  for(var i=o.last_day.length-1;i>=0;i--){
-    var v=o.last_day[i],h=(v/mx*100).toFixed(1);
-    bars+='<div style="flex:1;background:var(--accent);height:'+h+'%" title="'+v+'"></div>';
+  for(var i=23;i>=0;i--){
+    var v=o.last_day[i]||0,
+        h=v?(v/mx*100).toFixed(1)+'%':'3px',
+        bg=v?'var(--accent)':'var(--border)';
+    bars+='<div style="flex:1;min-width:0;background:'+bg+';height:'+h+';min-height:3px;max-height:100%" title="'+v+'"></div>';
   }
   byID('bc').innerHTML=bars;
   o.last_day.forEach(function(n,idx){
@@ -634,12 +669,13 @@ fetch('/clicks').then(r=>r.json()).then(o=>{
     if(idx==0)ed=new Date();
     if(idx==o.last_day.length-1&&sd<start)sd=start;
     var mins=(ed-sd)/60000;
-    rows+='<tr><td>'+sd.toLocaleString()+'</td><td>'+n+'</td><td>'+Math.ceil(n/mins)+'</td><td>'+(n/mins/o.ratio).toFixed(4)+'</td></tr>';
+    var uv=n/mins/o.ratio;
+    rows+='<tr><td>'+sd.toLocaleString()+'</td><td>'+n+'</td><td>'+Math.ceil(n/mins)+'</td><td class=usv data-uv="'+uv+'">'+uv.toFixed(4)+'</td></tr>';
   });
   tb.innerHTML=rows;
+  if(window.applyRad)applyRad();
 });
-</script>
-)HTML";
+)JS";
 
 static void hHistory(EGHttpRequest& req, EGHttpResponse& res, void*) {
   res.beginChunked(200, "text/html");
@@ -649,6 +685,15 @@ static void hHistory(EGHttpRequest& req, EGHttpResponse& res, void*) {
   res.endChunked();
 }
 
+static void hHistJs(EGHttpRequest& req, EGHttpResponse& res, void*) {
+  res.addHeader("Cache-Control", "public, max-age=31536000, immutable");
+#if EG_GZ_HIST_JS
+  res.sendGzipP(200, "application/javascript", HIST_JS_GZ, HIST_JS_GZ_LEN);
+#else
+  res.send(200, "application/javascript", FPSTR(HIST_JS));
+#endif
+}
+
 static void hLifeReset(EGHttpRequest& req, EGHttpResponse& res, void*) {
   gcounter.reset_lifetime();
   res.send(200, "text/plain", "OK");
@@ -659,6 +704,7 @@ void CounterRoutes::registerRoutes(EGHttpServer& http) {
   http.on("/lastdata", EGHttpRequest::GET,  hLastData);
   http.on("/json",     EGHttpRequest::GET,  hJson);
   http.on("/hist",     EGHttpRequest::GET,  hHistory);
+  http.on("/histjs",   EGHttpRequest::GET,  hHistJs);
   http.on("/life/reset", EGHttpRequest::POST, hLifeReset);
 #if GEIGER_IS_TEST(GEIGER_TYPE)
   http.on("/cpm",      EGHttpRequest::GET,  hSetCPM);

ESPGeiger/src/Counter/Counter.h

@@ -187,7 +187,7 @@ class Counter {
       void set_first_boot_ts(uint32_t v) { _first_boot_ts = v; }
       uint32_t get_first_boot_ts() const { return _first_boot_ts; }
       void set_lifetime_seconds(unsigned long v) { _lifetime_seconds_saved = v; }
-      unsigned long get_lifetime_seconds() const { return _lifetime_seconds_saved; }
+      unsigned long get_lifetime_seconds() const;  // live: saved + uncommitted delta
       void save_lifetime();
       void reset_lifetime();
       CircularBuffer<int,45> cpm_history;

ESPGeiger/src/WebPortal/WebPortal.cpp

@@ -393,17 +393,34 @@ void WebPortal::hFavicon(EGHttpRequest& req, EGHttpResponse& res, void*) {
 static const char THEME_JS[] PROGMEM = R"JS(var byID=t=>document.getElementById(t);
 !function(){
 var d=document.documentElement,L=addEventListener,
-TE=()=>dispatchEvent(new Event('themechange'));
+TE=()=>dispatchEvent(new Event('themechange')),
+AR=el=>{
+  var u=d.classList.contains('crt'),
+      list=el&&el.dataset?[el]:document.querySelectorAll('.usv');
+  list.forEach(e=>{
+    var v=parseFloat(e.dataset.uv);
+    if(isNaN(v))return;
+    e.textContent=u?(v*114).toFixed(v*114>=10?1:2):v.toFixed(3);
+    e.title=u?v.toFixed(3)+' µSv/h':'';
+  });
+  document.querySelectorAll('.usvL').forEach(e=>{e.textContent=u?(e.dataset.on||'µR/h'):(e.dataset.off||'µSv/h')});
+};
+window.setUsv=(el,v)=>{el.dataset.uv=v;AR(el)};
+window.applyRad=AR;
 function C(){var s=localStorage.crt,a=new Date();
 if(s==='1'||(s==null&&a.getMonth()===3&&a.getDate()===1))d.classList.add('crt');
-else if(s==='0')d.classList.remove('crt')}
+else if(s==='0')d.classList.remove('crt');
+AR();}
 window.theme=()=>{var t=d.dataset.theme=='dark'?'light':'dark';
 d.dataset.theme=localStorage.theme=t;TE()};
 d.dataset.theme=localStorage.theme||(matchMedia('(prefers-color-scheme:dark)').matches?'dark':'light');
 C();L('pageshow',C);
 var k=[38,38,40,40,37,39,37,39,66,65],i=0;
 L('keydown',e=>{i=e.keyCode===k[i]?i+1:0;
-if(i===k.length){localStorage.crt=d.classList.toggle('crt')?'1':'0';TE();i=0}})
+if(i===k.length){
+  localStorage.crt=d.classList.toggle('crt')?'1':'0';
+  AR();TE();i=0;
+}})
 }();)JS";
 #endif
 
@@ -1892,7 +1909,7 @@ static const char STATUS_BODY[] PROGMEM = R"HTML(
 <div id=g2></div>
 <table>
 <tr><th>CPM</th><td><span id=blip></span><span id=cpm>-</span></td><th>CPS</th><td><span id=cs>-</span></td></tr>
-<tr><th>&micro;Sv/h</th><td><span id=usv>-</span></td><th>Total clicks</th><td><span id=tc>-</span></td></tr>
+<tr><th><span class=usvL>&micro;Sv/h</span></th><td><span id=usv class=usv>-</span></td><th>Total clicks</th><td><span id=tc>-</span></td></tr>
 <tr><th>Uptime</th><td><span id=upt>-</span></td><th>Signal</th><td><span id=rssi>-</span></td></tr>
 </table>
 <h2>Console</h2>
@@ -2035,7 +2052,7 @@ setInterval(function(){A+=100/I;if(A>=1){F();if((A-=1)>3)A=3}},100);
 var Q=function(){if(!window._csk){window._csk=1;O(f,100)}},t=function(){var n=new X;n.open("GET","/json",!0);
 n.onload=function(){if(n.status>=200&&n.status<400){var o=JSON.parse(n.responseText),u=o.ut;
 U.textContent=(u/86400|0)+"T"+P((u/3600|0)%24)+":"+P((u/60|0)%60)+":"+P(u%60);
-C.textContent=o.c.toFixed(2);T.textContent=o.tc;V.textContent=(o.c/o.r).toFixed(4);S.textContent=o.cs.toFixed(2);
+C.textContent=o.c.toFixed(2);T.textContent=o.tc;setUsv(V,o.c/o.r);S.textContent=o.cs.toFixed(2);
 var v=o.rssi,p=v<=-100?0:v>=-50?100:2*(v+100);R.textContent=v+' dBm ('+p+'%)';
 e.update([o.c,o.c5,o.c15]);var r=o.c5>0&&o.c>0?o.c/o.c5:1;
 I=Math.max(100,Math.min(4e3,2e3/r));

docs/configuration/configuration.md

@@ -26,7 +26,7 @@ Settings changed on the Config page take effect immediately (or on next submissi
 | Warning CPM | Int 0-9999 | `50` | CPM threshold for warning state |
 | Alert CPM | Int 0-9999 | `100` | CPM threshold for alert state |
 | Web password | String (32) | `(empty)` | Optional HTTP Basic Auth password (user is `admin`). Blank disables auth. Sensitive. |
-| Track lifetime | Boolean | `true` | Persist total clicks + first-boot timestamp across reboots. Toggling off pauses the counter without losing the saved value. View totals and reset from `/hist`. |
+| Track lifetime | Boolean | `true` | Persist total clicks + first-boot timestamp + tracked seconds across reboots. Tracked seconds advance only over spans where clicks were persisted, so the lifetime CPM on `/hist` stays accurate across crashes. Toggling off pauses the counter without losing the saved value. View totals and reset from `/hist`. |
 
 ### Config import / export
 

docs/outputs/webportal.md

@@ -38,7 +38,7 @@ The ESPGeiger web portal exposes a number of HTTP endpoints that are useful for
 | `/` | Main home page |
 | `/status` | Detailed device status page (live readings, uptime, build info) |
 | `/hist` | Rolling 24 h CPM history view with bar chart, hour-by-hour table, and (when enabled) a lifetime stats card with a **Reset lifetime** button |
-| `/clicks` | JSON feed of the 24 h hourly bucket array plus today/yesterday totals and (when enabled) the lifetime block - powers `/hist` |
+| `/clicks` | JSON feed of the 24 h hourly bucket array plus today/yesterday totals and (when enabled) the lifetime block `{clk, fbt, secs}` - powers `/hist`. `secs` = tracked seconds (CPM denominator, advances only over persisted spans); `fbt` = first-boot epoch (install age). |
 | `/json` | Machine-readable status snapshot - see [JSON Endpoint](/output/integrations#json-endpoint) |
 | `/lastdata` | GeigerLog-compatible CSV line - see [GeigerLog](/output/integrations#geigerlog) |
 | `/info` | Human-readable HTML page with full device + network identity - see [/info page](#info-page) |

scripts/gzip_assets.py

@@ -25,6 +25,7 @@
     ("ESPGeiger/src/NTP/NTP.cpp",             "NTP_PAGE_JS", "application/javascript"),
     ("ESPGeiger/src/WebPortal/WebPortal.cpp", "STYLE_CSS",   "text/css"),
     ("ESPGeiger/src/WebPortal/WebPortal.cpp", "THEME_JS",    "application/javascript"),
+    ("ESPGeiger/src/Counter/Counter.cpp",     "HIST_JS",     "application/javascript"),
 ]
 
 ASSETS_COMBINED = [