Upload index.html
Browse files- index.html +40 -4
index.html
CHANGED
|
@@ -50,9 +50,9 @@
|
|
| 50 |
#reportOverlay{position:fixed;inset:0;background:#050b19eF;z-index:5000;overflow:auto;padding:22px;display:none}
|
| 51 |
#reportOverlay.open{display:block}body.report-open{overflow:hidden}
|
| 52 |
.report-actions{max-width:1510px;margin:0 auto 14px;display:flex;justify-content:space-between;gap:12px;align-items:center;color:#eaf2ff;font-size:14px}
|
| 53 |
-
.report-actions button{background:#1e497f;border:1px solid #4c7bad;padding:11px 18px}.report-actions .report-print{background:#146bd8}
|
| 54 |
#reportSheet{width:min(100%,1510px);margin:auto;background:white;color:#0a164a;font-family:'Segoe UI',Arial,sans-serif;padding:25px 28px 17px;box-shadow:0 22px 65px #0009;line-height:1.24}
|
| 55 |
-
#reportSheet *{box-sizing:border-box}#reportSheet .report-brand{
|
| 56 |
.report-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:14px}.report-heading h1{font-size:32px;margin:0;color:#0b164d;letter-spacing:-1.1px}.report-heading p{font-size:16px;margin:3px 0 0;color:#29335f}
|
| 57 |
.report-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:48%}.report-meta>div{border:1px solid #dce2ef;border-radius:7px;padding:10px 13px;display:flex;align-items:center;gap:11px;min-width:0}.report-meta .meta-icon{font-size:23px;color:#20116c}.report-meta strong{font-size:11px;display:block}.report-meta span{font-size:12px}
|
| 58 |
.report-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}.report-kpi{border:1px solid #e0e5ef;border-radius:8px;min-height:136px;padding:13px 12px;display:grid;grid-template-columns:54px 1fr;column-gap:12px;position:relative;overflow:hidden}.report-kpi .k-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:white;font-size:26px;font-weight:700}.report-kpi .k-label{font-size:14px;font-weight:750;margin-top:1px}.report-kpi .k-num{font-size:32px;font-weight:850;margin:7px 0 2px;color:#0b164d;white-space:nowrap}.report-kpi .k-sub{font-size:11px;color:#333f65;line-height:1.33}.report-kpi.purple .k-icon{background:linear-gradient(140deg,#863eec,#4c24bc)}.report-kpi.green .k-icon{background:linear-gradient(140deg,#50c52d,#168c24)}.report-kpi.orange .k-icon{background:linear-gradient(140deg,#fe8c20,#ff4d00)}.report-kpi.purple .k-label{color:#5b20d6}.report-kpi.green .k-label{color:#219824}.report-kpi.orange .k-label{color:#f45c0b}.report-kpi .k-underline{position:absolute;bottom:0;left:0;right:0;height:5px;background:linear-gradient(90deg,transparent,#ded6ff,transparent)}
|
|
@@ -178,9 +178,10 @@
|
|
| 178 |
</main>
|
| 179 |
</div>
|
| 180 |
<div id="reportOverlay" role="dialog" aria-modal="true" aria-label="Reakt Monitor rapport" aria-hidden="true">
|
| 181 |
-
<div class="report-actions"><span><strong>REAKT Β· Rapportvoorvertoning v0.8</strong> β uitsluitend fictieve testgegevens</span><div><button id="reportClose" type="button">β Sluiten</button> <button id="reportPrint" class="report-print" type="button">β Opslaan als PDF / Afdrukken</button></div></div>
|
| 182 |
<section id="reportSheet" aria-label="Witte Inloop Monitor"></section>
|
| 183 |
</div>
|
|
|
|
| 184 |
<script type="application/json" id="orchestra-demo-data">{"mode": "DEMO", "period": "Q3 2026 Β· fictief", "kpis": [{"label": "Bezoeken", "value": "12.480", "change": "+8,4%"}, {"label": "Unieke bezoekers", "value": "1.286", "change": "+3,2%"}, {"label": "Nieuwe instroom", "value": "164", "change": "+5,1%"}, {"label": "Verificatie", "value": "4 / 5", "change": "1 afwijking"}], "locations": [{"name": "Soeda", "visits": [350, 395, 428], "unique": 121}, {"name": "Rietdijk", "visits": [285, 305, 334], "unique": 108}, {"name": "Vredehof", "visits": [245, 268, 294], "unique": 93}, {"name": "Gouda", "visits": [320, 343, 365], "unique": 115}], "checks": [{"label": "Bezoeken", "ours": 2845, "shadow": 2845}, {"label": "Unieke bezoekers", "ours": 386, "shadow": 381}, {"label": "Nieuwe instroom", "ours": 42, "shadow": 42}, {"label": "Bezoeken vorig jaar", "ours": 2610, "shadow": 2610}, {"label": "Actieve locaties", "ours": 4, "shadow": 4}], "steps": [{"agent": "data", "text": "Demo-gegevens ingelezen en structuur gecontroleerd"}, {"agent": "analysis", "text": "Maandtrends en locatievergelijkingen berekend"}, {"agent": "insight", "text": "Opvallende ontwikkelingen samengevat (demo)"}, {"agent": "verify", "text": "Schaduwberekeningen vergeleken: 1 afwijking"}, {"agent": "report", "text": "Conceptinfographic voorbereid Β· NIET GEVALIDEERD"}]}</script>
|
| 185 |
<script>
|
| 186 |
window.addEventListener('error', function(event){
|
|
@@ -541,7 +542,7 @@ function buildWhiteReport(){
|
|
| 541 |
const maxI=Math.max(1,...d.intensities),ilabels=['1 β 5 dagen','6 β 20 dagen','21 β 50 dagen','51 β 100 dagen','101 dagen of meer'];
|
| 542 |
const itHTML=d.intensities.map((c,i)=>`<div class="report-intensity-row"><span class="int-label">${ilabels[i]}</span><div class="int-bar-track"><div class="int-bar" style="width:${c/maxI*100}%"></div></div><strong>${c}</strong></div>`).join('');
|
| 543 |
$('reportSheet').innerHTML=`
|
| 544 |
-
<div class="report-brand">
|
| 545 |
<div class="report-heading"><div><h1>Reakt Inloop Monitor ${escapeHTML(d.site)}</h1><p>Inzicht in bereik, betrokkenheid en bezoekpatronen</p></div>
|
| 546 |
<div class="report-meta"><div><b class="meta-icon">β¦</b><span><strong>Periode</strong>${escapeHTML(range)}</span></div><div><b class="meta-icon">β</b><span><strong>Locatie</strong>${escapeHTML(d.site)}</span></div><div><b class="meta-icon">β»</b><span><strong>Peildatum</strong>${escapeHTML(d.latest)}</span></div></div></div>
|
| 547 |
<div class="report-kpi-grid">${kpiHTML}</div>
|
|
@@ -563,8 +564,43 @@ function openWhiteReport(){
|
|
| 563 |
buildWhiteReport();$('reportOverlay').classList.add('open');$('reportOverlay').setAttribute('aria-hidden','false');document.body.classList.add('report-open');$('reportOverlay').scrollTop=0;
|
| 564 |
}
|
| 565 |
function closeWhiteReport(){$('reportOverlay').classList.remove('open');$('reportOverlay').setAttribute('aria-hidden','true');document.body.classList.remove('report-open')}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 566 |
$('reportClose').addEventListener('click',closeWhiteReport);
|
| 567 |
$('reportPrint').addEventListener('click',()=>window.print());
|
|
|
|
|
|
|
| 568 |
document.addEventListener('keydown',e=>{if(e.key==='Escape'&&$('reportOverlay').classList.contains('open'))closeWhiteReport()});
|
| 569 |
|
| 570 |
$('startBtn').addEventListener('click',start);$('resetBtn').addEventListener('click',reset);$('chatForm').addEventListener('submit',e=>{e.preventDefault();const q=$('chatInput').value;$('chatInput').value='';ask(q)});document.querySelectorAll('[data-q]').forEach(b=>b.addEventListener('click',()=>ask(b.dataset.q)));$('exportBtn').addEventListener('click',openWhiteReport);
|
|
|
|
| 50 |
#reportOverlay{position:fixed;inset:0;background:#050b19eF;z-index:5000;overflow:auto;padding:22px;display:none}
|
| 51 |
#reportOverlay.open{display:block}body.report-open{overflow:hidden}
|
| 52 |
.report-actions{max-width:1510px;margin:0 auto 14px;display:flex;justify-content:space-between;gap:12px;align-items:center;color:#eaf2ff;font-size:14px}
|
| 53 |
+
.report-actions button{background:#1e497f;border:1px solid #4c7bad;padding:11px 18px}.report-actions .report-print{background:#146bd8}.report-actions .report-png{background:#17664f;border-color:#39967a}.report-actions .report-jpg{background:#7a4f12;border-color:#b07d34}
|
| 54 |
#reportSheet{width:min(100%,1510px);margin:auto;background:white;color:#0a164a;font-family:'Segoe UI',Arial,sans-serif;padding:25px 28px 17px;box-shadow:0 22px 65px #0009;line-height:1.24}
|
| 55 |
+
#reportSheet *{box-sizing:border-box}#reportSheet .report-brand{margin-bottom:11px}#reportSheet .report-logo{display:block;height:82px;width:auto;object-fit:contain}
|
| 56 |
.report-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:14px}.report-heading h1{font-size:32px;margin:0;color:#0b164d;letter-spacing:-1.1px}.report-heading p{font-size:16px;margin:3px 0 0;color:#29335f}
|
| 57 |
.report-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:48%}.report-meta>div{border:1px solid #dce2ef;border-radius:7px;padding:10px 13px;display:flex;align-items:center;gap:11px;min-width:0}.report-meta .meta-icon{font-size:23px;color:#20116c}.report-meta strong{font-size:11px;display:block}.report-meta span{font-size:12px}
|
| 58 |
.report-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}.report-kpi{border:1px solid #e0e5ef;border-radius:8px;min-height:136px;padding:13px 12px;display:grid;grid-template-columns:54px 1fr;column-gap:12px;position:relative;overflow:hidden}.report-kpi .k-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:white;font-size:26px;font-weight:700}.report-kpi .k-label{font-size:14px;font-weight:750;margin-top:1px}.report-kpi .k-num{font-size:32px;font-weight:850;margin:7px 0 2px;color:#0b164d;white-space:nowrap}.report-kpi .k-sub{font-size:11px;color:#333f65;line-height:1.33}.report-kpi.purple .k-icon{background:linear-gradient(140deg,#863eec,#4c24bc)}.report-kpi.green .k-icon{background:linear-gradient(140deg,#50c52d,#168c24)}.report-kpi.orange .k-icon{background:linear-gradient(140deg,#fe8c20,#ff4d00)}.report-kpi.purple .k-label{color:#5b20d6}.report-kpi.green .k-label{color:#219824}.report-kpi.orange .k-label{color:#f45c0b}.report-kpi .k-underline{position:absolute;bottom:0;left:0;right:0;height:5px;background:linear-gradient(90deg,transparent,#ded6ff,transparent)}
|
|
|
|
| 178 |
</main>
|
| 179 |
</div>
|
| 180 |
<div id="reportOverlay" role="dialog" aria-modal="true" aria-label="Reakt Monitor rapport" aria-hidden="true">
|
| 181 |
+
<div class="report-actions"><span><strong>REAKT Β· Rapportvoorvertoning v0.8.3</strong> β uitsluitend fictieve testgegevens</span><div><button id="reportClose" type="button">β Sluiten</button> <button id="reportPng" class="report-png" type="button">β¬ Download PNG</button> <button id="reportJpg" class="report-jpg" type="button">β¬ Download JPG</button> <button id="reportPrint" class="report-print" type="button">β Opslaan als PDF / Afdrukken</button></div></div>
|
| 182 |
<section id="reportSheet" aria-label="Witte Inloop Monitor"></section>
|
| 183 |
</div>
|
| 184 |
+
<script src="https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js"></script>
|
| 185 |
<script type="application/json" id="orchestra-demo-data">{"mode": "DEMO", "period": "Q3 2026 Β· fictief", "kpis": [{"label": "Bezoeken", "value": "12.480", "change": "+8,4%"}, {"label": "Unieke bezoekers", "value": "1.286", "change": "+3,2%"}, {"label": "Nieuwe instroom", "value": "164", "change": "+5,1%"}, {"label": "Verificatie", "value": "4 / 5", "change": "1 afwijking"}], "locations": [{"name": "Soeda", "visits": [350, 395, 428], "unique": 121}, {"name": "Rietdijk", "visits": [285, 305, 334], "unique": 108}, {"name": "Vredehof", "visits": [245, 268, 294], "unique": 93}, {"name": "Gouda", "visits": [320, 343, 365], "unique": 115}], "checks": [{"label": "Bezoeken", "ours": 2845, "shadow": 2845}, {"label": "Unieke bezoekers", "ours": 386, "shadow": 381}, {"label": "Nieuwe instroom", "ours": 42, "shadow": 42}, {"label": "Bezoeken vorig jaar", "ours": 2610, "shadow": 2610}, {"label": "Actieve locaties", "ours": 4, "shadow": 4}], "steps": [{"agent": "data", "text": "Demo-gegevens ingelezen en structuur gecontroleerd"}, {"agent": "analysis", "text": "Maandtrends en locatievergelijkingen berekend"}, {"agent": "insight", "text": "Opvallende ontwikkelingen samengevat (demo)"}, {"agent": "verify", "text": "Schaduwberekeningen vergeleken: 1 afwijking"}, {"agent": "report", "text": "Conceptinfographic voorbereid Β· NIET GEVALIDEERD"}]}</script>
|
| 186 |
<script>
|
| 187 |
window.addEventListener('error', function(event){
|
|
|
|
| 542 |
const maxI=Math.max(1,...d.intensities),ilabels=['1 β 5 dagen','6 β 20 dagen','21 β 50 dagen','51 β 100 dagen','101 dagen of meer'];
|
| 543 |
const itHTML=d.intensities.map((c,i)=>`<div class="report-intensity-row"><span class="int-label">${ilabels[i]}</span><div class="int-bar-track"><div class="int-bar" style="width:${c/maxI*100}%"></div></div><strong>${c}</strong></div>`).join('');
|
| 544 |
$('reportSheet').innerHTML=`
|
| 545 |
+
<div class="report-brand"><img class="report-logo" src="data:image/png;base64,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" alt="Reakt PG logo"></div>
|
| 546 |
<div class="report-heading"><div><h1>Reakt Inloop Monitor ${escapeHTML(d.site)}</h1><p>Inzicht in bereik, betrokkenheid en bezoekpatronen</p></div>
|
| 547 |
<div class="report-meta"><div><b class="meta-icon">β¦</b><span><strong>Periode</strong>${escapeHTML(range)}</span></div><div><b class="meta-icon">β</b><span><strong>Locatie</strong>${escapeHTML(d.site)}</span></div><div><b class="meta-icon">β»</b><span><strong>Peildatum</strong>${escapeHTML(d.latest)}</span></div></div></div>
|
| 548 |
<div class="report-kpi-grid">${kpiHTML}</div>
|
|
|
|
| 564 |
buildWhiteReport();$('reportOverlay').classList.add('open');$('reportOverlay').setAttribute('aria-hidden','false');document.body.classList.add('report-open');$('reportOverlay').scrollTop=0;
|
| 565 |
}
|
| 566 |
function closeWhiteReport(){$('reportOverlay').classList.remove('open');$('reportOverlay').setAttribute('aria-hidden','true');document.body.classList.remove('report-open')}
|
| 567 |
+
|
| 568 |
+
async function downloadReportImage(type='png'){
|
| 569 |
+
const overlay=$('reportOverlay');
|
| 570 |
+
if(!overlay.classList.contains('open')) openWhiteReport();
|
| 571 |
+
const target=$('reportSheet');
|
| 572 |
+
const pngBtn=$('reportPng'), jpgBtn=$('reportJpg');
|
| 573 |
+
const activeBtn=type==='png'?pngBtn:jpgBtn;
|
| 574 |
+
if(!window.html2canvas){
|
| 575 |
+
alert('De afbeeldingsexport kon niet starten. Vernieuw de pagina en probeer opnieuw.');
|
| 576 |
+
return;
|
| 577 |
+
}
|
| 578 |
+
const prev=activeBtn.textContent;
|
| 579 |
+
try{
|
| 580 |
+
activeBtn.disabled=true; activeBtn.textContent='Bezig met exporteren...';
|
| 581 |
+
await new Promise(r=>setTimeout(r,80));
|
| 582 |
+
const canvas=await html2canvas(target,{backgroundColor:'#ffffff',scale:2.5,useCORS:true,logging:false});
|
| 583 |
+
const mime=type==='jpg'?'image/jpeg':'image/png';
|
| 584 |
+
const quality=type==='jpg'?0.94:1;
|
| 585 |
+
const dataUrl=canvas.toDataURL(mime,quality);
|
| 586 |
+
const link=document.createElement('a');
|
| 587 |
+
const site=(currentData&¤tData.site?currentData.site:'monitor').toLowerCase().replace(/[^a-z0-9]+/gi,'_');
|
| 588 |
+
link.href=dataUrl;
|
| 589 |
+
link.download=`reakt_inloop_monitor_${site}.${type==='jpg'?'jpg':'png'}`;
|
| 590 |
+
document.body.appendChild(link);
|
| 591 |
+
link.click();
|
| 592 |
+
link.remove();
|
| 593 |
+
}catch(err){
|
| 594 |
+
console.error(err);
|
| 595 |
+
alert('Het downloaden van de afbeelding is niet gelukt. Probeer het opnieuw.');
|
| 596 |
+
}finally{
|
| 597 |
+
activeBtn.disabled=false; activeBtn.textContent=prev;
|
| 598 |
+
}
|
| 599 |
+
}
|
| 600 |
$('reportClose').addEventListener('click',closeWhiteReport);
|
| 601 |
$('reportPrint').addEventListener('click',()=>window.print());
|
| 602 |
+
$('reportPng').addEventListener('click',()=>downloadReportImage('png'));
|
| 603 |
+
$('reportJpg').addEventListener('click',()=>downloadReportImage('jpg'));
|
| 604 |
document.addEventListener('keydown',e=>{if(e.key==='Escape'&&$('reportOverlay').classList.contains('open'))closeWhiteReport()});
|
| 605 |
|
| 606 |
$('startBtn').addEventListener('click',start);$('resetBtn').addEventListener('click',reset);$('chatForm').addEventListener('submit',e=>{e.preventDefault();const q=$('chatInput').value;$('chatInput').value='';ask(q)});document.querySelectorAll('[data-q]').forEach(b=>b.addEventListener('click',()=>ask(b.dataset.q)));$('exportBtn').addEventListener('click',openWhiteReport);
|