From 23d87618dc8fe0787b346ef22252098f3ecc0d3e Mon Sep 17 00:00:00 2001
From: Mariano Riefolo <rfmariano@protonmail.com>
Date: Wed, 4 Sep 2024 14:48:55 +0200
Subject: [PATCH] feat(frontend): show loading indicator during data retrieval

---
 static/index.js      |  5 +++++
 templates/index.html | 14 ++++++++++----
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/static/index.js b/static/index.js
index acea543..01faee5 100644
--- a/static/index.js
+++ b/static/index.js
@@ -11,6 +11,7 @@ function load_links() {
         select.appendChild(option);
         i++;
       });
+      document.getElementById("links-label").removeAttribute("aria-busy");
     })
     .catch((error) => {
       alert("Errore nel caricamento dei dati, riprova più tardi.");
@@ -32,6 +33,7 @@ function load_teachers(id) {
         list.appendChild(option);
         i++;
       });
+      document.getElementById("teacher-label").removeAttribute("aria-busy");
     })
     .catch((error) => {
       alert("Errore nel caricamento dei dati, riprova più tardi.");
@@ -57,6 +59,7 @@ function load_classes(id) {
         select.appendChild(option);
       }
       sessionStorage.setItem("classes", JSON.stringify(data));
+      document.getElementById("class-label").removeAttribute("aria-busy");
     })
     .catch((error) => {
       alert("Errore nel caricamento dei dati, riprova più tardi.");
@@ -92,6 +95,7 @@ function make_teacher_table(id, teacher) {
         tbody.appendChild(tr);
       });
       table.appendChild(tbody);
+      document.getElementById("table").removeAttribute("aria-busy");
     })
     .catch((error) => {
       alert("Errore nel caricamento dei dati, riprova più tardi.");
@@ -127,6 +131,7 @@ function make_student_table(id, student_class) {
         tbody.appendChild(tr);
       });
       table.appendChild(tbody);
+      document.getElementById("table").removeAttribute("aria-busy");
     })
     .catch((error) => {
       alert("Errore nel caricamento dei dati, riprova più tardi.");
diff --git a/templates/index.html b/templates/index.html
index 58d5aa2..963b672 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -16,7 +16,9 @@
       <div id="forms" hidden>
         <form id="form-pdf">
           <fieldset>
-            <label>Quale orario vuoi usare?</label>
+            <label id="links-label" aria-busy="true"
+              >Quale orario vuoi usare?</label
+            >
             <select id="links" onchange="select_pdf()" required>
               <option selected disabled value="none">
                 Seleziona un orario
@@ -38,7 +40,9 @@
         </form>
         <form id="form-teacher" onsubmit="return select_teacher()" hidden>
           <formfield>
-            <label>Seleziona il tuo cognome</label>
+            <label id="teacher-label" aria-busy="true"
+              >Seleziona il tuo cognome</label
+            >
             <input id="teacher" type="text" list="teachers" />
             <datalist id="teachers"></datalist>
           </formfield>
@@ -46,7 +50,9 @@
         </form>
         <form id="form-classes" hidden>
           <formfield>
-            <label>Seleziona la tua classe</label>
+            <label id="class-label" aria-busy="true"
+              >Seleziona la tua classe</label
+            >
             <select id="year" onchange="load_section()">
               <option selected disabled value="none">Seleziona l'anno</option>
             </select>
@@ -65,7 +71,7 @@
         </form>
       </div>
       <div id="dashboard" hidden>
-        <table id="table" class="striped"></table>
+        <table id="table" class="striped" aria-busy="true"></table>
         <form>
           <input type="submit" onclick="delete_cookies()" value="Reimposta" />
         </form>