Careful, i'm saying fill in the Health Score, Fault Problem, Energy Ledger, Latency & Cost, and Recent Alerts with template data

index.html

@@ -168,34 +168,40 @@ function setTheme(darkMode){
 }
 setTheme(dark);
 document.getElementById('themeBtn').onclick = ()=>setTheme(!body.classList.contains('theme-dark'));
-
 /* DEMO DATA GENERATION */
-let lastHealth=0.85 + Math.random()*0.1, lastEta=30 + Math.random()*120;
-const dataHealth = Array(15*60).fill().map((_,i)=>({x:Date.now()-i*1000, y:0.7 + Math.random()*0.3}));
+let lastHealth=0.92, lastEta=120;
+const dataHealth = Array(15*60).fill().map((_,i)=>{
+  const x = Date.now()-i*1000;
+  // Simulate normal fluctuations with occasional dips
+  const base = 0.9 + Math.sin(i/300)*0.02;
+  const anomaly = i%500 < 10 ? -0.15 : 0; // Simulate brief anomalies
+  const noise = Math.random()*0.005;
+  return {x, y: Math.max(0.6, base + anomaly + noise)};
+});
+
 const dataSag = [], dataSwell=[], dataOsc=[], dataLatency=[], dataCost=[], dataEnergy=[];
 for(let i=0;i<60*24;i++){
-  const spike = Math.random() > 0.95 ? 0.9 + Math.random()*0.1 : Math.random();
-  dataSag.unshift({x:Date.now()-i*60000, y:spike});
-  dataSwell.unshift({x:Date.now()-i*60000, y:0.3 + Math.random()*0.5});
-  dataOsc.unshift({x:Date.now()-i*60000, y:0.4 + Math.random()*0.4});
-  dataLatency.unshift({x:Date.now()-i*60000, y:0.05 + Math.random()*0.1});
-  dataCost.unshift({x:Date.now()-i*60000, y:(0.05 + Math.random()*0.15)/1000});
-  dataEnergy.unshift({x:Date.now()-i*60000, y:0.005 + Math.random()*0.005});
+  const x = Date.now()-i*60000;
+  // Fault probabilities with realistic patterns
+  dataSag.unshift({x, y: Math.max(0, 0.3 + Math.sin(i/120)*0.2 + (i%300<10?0.4:0) + Math.random()*0.1)});
+  dataSwell.unshift({x, y: Math.max(0, 0.2 + Math.sin(i/180)*0.15 + Math.random()*0.08)});
+  dataOsc.unshift({x, y: Math.max(0, 0.1 + Math.sin(i/240)*0.1 + (i%400<15?0.3:0) + Math.random()*0.05)});
+  
+  // Energy and latency with daily patterns
+  const hour = (i/60)%24;
+  const isDay = hour > 6 && hour < 20;
+  dataLatency.unshift({x, y: (isDay ? 0.15 : 0.1) + Math.random()*0.03});
+  dataCost.unshift({x, y: ((isDay ? 0.15 : 0.1) + Math.random()*0.03)/1000});
+  dataEnergy.unshift({x, y: (isDay ? 0.008 : 0.005) + Math.random()*0.0015});
 }
 
-const feeders = ["F01", "F02", "F03", "F04", "F05", "F06"];
-const faultTypes = ["Sag", "Swell", "Oscillation", "Harmonic", "Outage", "Spike"];
-const actions = ["Notify crew", "Adjust set-point", "Reroute power", "Check sensors", "Dispatch team", "Monitor"];
-const alerts = Array(5).fill().map(() => {
-  const timeOffset = Math.random() * 24 * 60 * 60 * 1000;
-  return {
-    time: new Date(Date.now() - timeOffset),
-    feeder: feeders[Math.floor(Math.random() * feeders.length)],
-    fault: `${faultTypes[Math.floor(Math.random() * faultTypes.length)]} ${(0.7 + Math.random()*0.3).toFixed(2)}`,
-    eta: timeOffset < 60000 ? `${Math.floor(timeOffset/1000)} s` : `${Math.floor(timeOffset/60000)} m`,
-    action: actions[Math.floor(Math.random() * actions.length)]
-  };
-}).sort((a,b) => b.time - a.time);
+const alerts = [
+  {time:new Date(Date.now()-120000), feeder:"F03", fault:"Voltage Sag 0.82", eta:"45 s", action:"Notify crew"},
+  {time:new Date(Date.now()-300000), feeder:"F01", fault:"Frequency Osc 0.78", eta:"02:10", action:"Adjust set-point"},
+  {time:new Date(Date.now()-1800000), feeder:"F02", fault:"Current Swell 0.91", eta:"05:45", action:"Dispatch team"},
+  {time:new Date(Date.now()-3600000), feeder:"F04", fault:"Harmonic Dist 0.67", eta:"12:30", action:"Monitor"},
+  {time:new Date(Date.now()-7200000), feeder:"F01", fault:"Voltage Sag 0.88", eta:"08:15", action:"Reroute power"}
+];
 /* CHARTS */
 function lineConfig(data,label,color,fill=false){
   return {
@@ -234,19 +240,22 @@ window.onload = ()=>{
 
 /* REFRESH UI */
 function refresh(){
-  lastHealth = Math.max(0.6, Math.min(0.95, lastHealth - 0.001 + (Math.random()*0.004 - 0.002)));
-document.getElementById('healthText').textContent = lastHealth.toFixed(2);
+  lastHealth = Math.max(0,lastHealth-0.001+Math.random()*0.002);
+  document.getElementById('healthText').textContent = lastHealth.toFixed(2);
   const gauge = document.getElementById('gauge');
   let c = lastHealth>=0.8? '#22c55e':lastHealth>=0.5? '#f59e0b': '#ef4444';
   gauge.style.borderColor = c;
-  lastEta = Math.max(5, Math.min(180, lastEta - 1 + Math.random()*4 - 2));
-const eta = lastEta<60?Math.round(lastEta)+' s':`${Math.floor(lastEta/60)} m`;
+
+  lastEta = Math.max(0,lastEta-1+Math.random()*2);
+  const eta = lastEta<60?Math.round(lastEta)+' s':`${Math.floor(lastEta/60)} m`;
   document.getElementById('etaVal').textContent=eta;
   const kpiEta = document.getElementById('kpiEta');
   kpiEta.classList.toggle('blink', lastEta<60);
-  document.getElementById('latencyVal').textContent = (0.08 + Math.random()*0.08).toFixed(2) + ' ms';
-  document.getElementById('energyVal').textContent = (0.003 + Math.random()*0.004).toFixed(3) + ' Wh';
-  document.getElementById('co2Val').textContent = (1.8 + Math.random()*0.6).toFixed(2) + ' kg';
+  const hour = new Date().getHours();
+  const isPeak = hour > 8 && hour < 20;
+  document.getElementById('latencyVal').textContent = (isPeak ? 0.15 : 0.1 + Math.random()*0.02).toFixed(2)+' ms';
+  document.getElementById('energyVal').textContent = (isPeak ? 0.008 : 0.005 + Math.random()*0.001).toFixed(3)+' Wh';
+  document.getElementById('co2Val').textContent = (2.4 + Math.sin(Date.now()/86400000)*0.3).toFixed(2)+' kg';
 // alerts
   const tbody = document.querySelector('#alertsTable tbody');
   tbody.innerHTML='';
@@ -260,10 +269,8 @@ const eta = lastEta<60?Math.round(lastEta)+' s':`${Math.floor(lastEta/60)} m`;
       <td class="italic">${a.action}</td>`;
     tbody.append(tr);
   });
-  if(Math.random()>0.99) {
-    const fault = faultTypes[Math.floor(Math.random() * faultTypes.length)];
-    showToast(`${fault} detected on ${feeders[Math.floor(Math.random() * feeders.length)]}`, {type:'warning'});
-  }
+
+  if(Math.random()>0.998) showToast('Fault probability threshold reached',{type:'warning'});
 }
 const format = dateFns.format;
 setInterval(refresh,1000);