Add global stats generation

templates/index.html

@@ -32,6 +32,12 @@
         <span class="icon is-small is-left"><i data-feather="server"></i></span>
       </div>
     </div>
+    <div id="overview" class="box mb-5">
+      <h2 class="subtitle">Overview</h2>
+      <p>Total logs: <span id="stat-total">-</span></p>
+      <p>Date range: <span id="stat-start">-</span> to <span id="stat-end">-</span></p>
+      <p>Unique domains: <span id="stat-domains">-</span></p>
+    </div>
     <div id="reports-container"></div>
   </div>
   <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
@@ -42,6 +48,10 @@
     const intervalSelect = document.getElementById('interval-select');
     const domainSelect = document.getElementById('domain-select');
     const container = document.getElementById('reports-container');
+    const totalElem = document.getElementById('stat-total');
+    const startElem = document.getElementById('stat-start');
+    const endElem = document.getElementById('stat-end');
+    const domainsElem = document.getElementById('stat-domains');
 
     let currentInterval = intervalSelect.value;
     let currentDomain = domainSelect.value;
@@ -97,6 +107,17 @@
         });
     }
 
+    function loadStats() {
+      fetch('global/stats.json')
+        .then(r => r.json())
+        .then(stats => {
+          totalElem.textContent = stats.total_logs;
+          startElem.textContent = stats.start_date;
+          endElem.textContent = stats.end_date;
+          domainsElem.textContent = stats.unique_domains;
+        });
+    }
+
     function loadReports() {
       let path = currentInterval;
       if (currentDomain) {
@@ -128,6 +149,7 @@
     });
 
     loadReports();
+    loadStats();
     feather.replace();
   </script>
 </body>