From 486ebdb4fb693758c597f51a24603e9affaf38d2 Mon Sep 17 00:00:00 2001
From: Oscar Krause <oscar.krause@collinwebdesigns.de>
Date: Mon, 4 Mar 2024 09:53:06 +0100
Subject: [PATCH] implemented origins & leases auto refresh button

---
 app/templates/views/dashboard_leases.html  | 21 ++++++++++++++++++++-
 app/templates/views/dashboard_origins.html | 21 ++++++++++++++++++++-
 2 files changed, 40 insertions(+), 2 deletions(-)

diff --git a/app/templates/views/dashboard_leases.html b/app/templates/views/dashboard_leases.html
index 58896fc..7950cad 100644
--- a/app/templates/views/dashboard_leases.html
+++ b/app/templates/views/dashboard_leases.html
@@ -18,9 +18,10 @@
                     </button>
                 </div>
 
-                <button type="button" class="btn btn-sm btn-outline-secondary" onclick="load()" title="refresh">
+                <button type="button" class="btn btn-sm btn-outline-secondary me-2" onclick="load()" title="refresh">
                     <i class="bi bi-arrow-clockwise"></i>
                 </button>
+                <button id="btn-auto-refresh" type="button" class="btn btn-sm active">auto-refresh</button>
             </div>
         </div>
 
@@ -31,11 +32,29 @@
 {% block scripts %}
 {{ super() }}
 <script type="application/javascript">
+    let autoRefresh = true
+
     function load() {
         const leases = document.getElementById('leases')
         fetchLeases(leases)
     }
 
     load()
+
+    setInterval(() => {
+        if(autoRefresh)
+            load()
+    }, 5000);
+
+    const btnAutoRefresh = document.getElementById('btn-auto-refresh')
+    btnAutoRefresh.addEventListener("click", () => {
+        if(btnAutoRefresh.classList.contains('active')) {
+            autoRefresh = false
+            btnAutoRefresh.classList.remove('active')
+        } else {
+            autoRefresh = false
+            btnAutoRefresh.classList.add('active')
+        }
+    }, true);
 </script>
 {% endblock %}
diff --git a/app/templates/views/dashboard_origins.html b/app/templates/views/dashboard_origins.html
index e165720..461c546 100644
--- a/app/templates/views/dashboard_origins.html
+++ b/app/templates/views/dashboard_origins.html
@@ -21,9 +21,10 @@
                     </button>
                 </div>
 
-                <button type="button" class="btn btn-sm btn-outline-secondary" onclick="load()" title="refresh">
+                <button type="button" class="btn btn-sm btn-outline-secondary me-2" onclick="load()" title="refresh">
                     <i class="bi bi-arrow-clockwise"></i>
                 </button>
+                <button id="btn-auto-refresh" type="button" class="btn btn-sm active">auto-refresh</button>
             </div>
         </div>
 
@@ -34,6 +35,8 @@
 {% block scripts %}
 {{ super() }}
     <script type="application/javascript">
+        let autoRefresh = true
+
         function load() {
             const origins = document.getElementById('origins')
             fetchOriginsWithLeases(origins)
@@ -47,5 +50,21 @@
             if (response)
                 deleteOrigins().finally(() => load())
         }
+
+        setInterval(() => {
+            if(autoRefresh)
+                load()
+        }, 5000);
+
+        const btnAutoRefresh = document.getElementById('btn-auto-refresh')
+        btnAutoRefresh.addEventListener("click", () => {
+            if(btnAutoRefresh.classList.contains('active')) {
+                autoRefresh = false
+                btnAutoRefresh.classList.remove('active')
+            } else {
+                autoRefresh = false
+                btnAutoRefresh.classList.add('active')
+            }
+        }, true);
     </script>
 {% endblock %}