From 073bec16a10ec5022b831af056abe627ff2fb907 Mon Sep 17 00:00:00 2001
From: 0d0acre <0d0acre@esiliati.org>
Date: Sat, 21 Sep 2024 00:13:41 +0200
Subject: [PATCH] lint and format

---
 public/index.html    | 121 +++++++++++++++++++++---------------
 public/tutorial.html | 142 ++++++++++++++++++++++++++-----------------
 2 files changed, 156 insertions(+), 107 deletions(-)
diff --git a/public/index.html b/public/index.html
index 06a0b9f..d685931 100644
--- a/public/index.html
+++ b/public/index.html
@@ -9,7 +9,7 @@
       integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
       crossorigin=""
     />
-    <link rel="icon" type="image/png" sizes="16x16" href="../img/trashw.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="../img/trashw.png" />
     <script
       src="./js/dist/leaflet.js"
       integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
@@ -24,79 +24,100 @@
     <title>RuscoMap</title>
   </head>
   <body>
-
     <button id="addMarkerBtn">BottoneInserimento</button>
     <div id="markerFormContainer">
       <form id="markerForm" enctype="multipart/form-data">
-        <div id="noticeCoordsPicker" style="display: none;">
-            <text>Clicca sul punto della mappa in cui vuoi inserire il rusco avvistato</text>
-            <input id="formInputCoordY" name="lat" type="hidden" />
-            <input id="formInputCoordX" name="long" type="hidden" />
+        <div id="noticeCoordsPicker" style="display: none">
+          <text
+            >Clicca sul punto della mappa in cui vuoi inserire il rusco
+            avvistato</text
+          >
+          <input id="formInputCoordY" name="lat" type="hidden" />
+          <input id="formInputCoordX" name="long" type="hidden" />
         </div>
-        <div id="remainingForm" style="display: none;">
+        <div id="remainingForm" style="display: none">
           <label>Nome</label>
-          <br>
+          <br />
           <input name="name" required type="text" />
-          <br><br>
+          <br /><br />
           <label>Descrizione</label>
-          <br>
+          <br />
           <textarea name="description" required></textarea>
-          <br><br>
+          <br /><br />
           <div class="file-upload">
-            <input name="image" required type="file" id="file-input" class="file-input" accept="image/x-png,image/jpeg,image/jpg"/>
+            <input
+              name="image"
+              required
+              type="file"
+              id="file-input"
+              class="file-input"
+              accept="image/x-png,image/jpeg,image/jpg"
+            />
             <label for="file-input" class="file-label">Scegli File</label>
-            <br><br>
-            <span class="file-chosen">    </span>
+            <br /><br />
+            <span class="file-chosen"> </span>
           </div>
-          <br>
+          <br />
           <button>Aggiungi Marker</button>
         </div>
       </form>
     </div>
     <div id="map">
       <script>
-       document.getElementById("addMarkerBtn").innerHTML = '<img src="../img/marker-icon18.png" alt="Button Image" />';
+        document.getElementById("addMarkerBtn").innerHTML =
+          '<img src="../img/marker-icon18.png" alt="Button Image" />';
       </script>
-      </div>
+    </div>
 
-      <!-- bottone gps -->
-      <!-- <button id="gps-button" type="button">
+    <!-- bottone gps -->
+    <!-- <button id="gps-button" type="button">
         <img src="../img/target30.png" alt="GPS" style="display: flex">  </button> -->
 
-        <script>
-
-          // Add a click event listener to the button
-          document.getElementById('gps-button').addEventListener('click', function() {
-              if (lc.isFollowing()) {
-                  lc.stop();
-              } else {
-                  lc.start();
-              }
-          });
-      </script>
-
-      <div class="popup" id="popup">
-        <!-- <img src="qualcosa.jpg" alt="Popup Image"> -->
-        <p id="istruzioni">
-          <img src="../img/trashg.png" alt="Description of Image" width="20" height="20"><b>RuscoMap</b> è una mappa dove utenti in anonimo possono inserire dei marker con nome, descrizione e foto di oggetti abbandonati, segnalandoli a tutti i visitatori della mappa.
-          <br> <br>
-          Sulla falsa riga del <i>te lo regalo se vieni a prenderlo</i>, questo è più il <i>segnalo che c'è 'sta roba lì, è tua se te la vai a prendere</i>.
-          <br> <br>
-          Clicca <a href="./tutorial.html">qui</a> per leggere il tutorial.
-        </p>
-        <div><button id="popupstart" type="button" onclick="closePopup()">X</button></div>
-      </div>
-
-      <script>
-        function closePopup() {
-            var popup = document.getElementById("popup");
-            popup.style.display = "none";
-        }
-        // Popup si chiude automaticamente dopo 13 secondi
-        setTimeout(closePopup,13000);
+    <script>
+      // Add a click event listener to the button
+      document
+        .getElementById("gps-button")
+        .addEventListener("click", function () {
+          if (lc.isFollowing()) {
+            lc.stop();
+          } else {
+            lc.start();
+          }
+        });
     </script>
 
+    <div class="popup" id="popup">
+      <!-- <img src="qualcosa.jpg" alt="Popup Image"> -->
+      <p id="istruzioni">
+        <img
+          src="../img/trashg.png"
+          alt="Description of Image"
+          width="20"
+          height="20"
+        /><b>RuscoMap</b> è una mappa dove utenti in anonimo possono inserire
+        dei marker con nome, descrizione e foto di oggetti abbandonati,
+        segnalandoli a tutti i visitatori della mappa. <br />
+        <br />
+        Sulla falsa riga del <i>te lo regalo se vieni a prenderlo</i>, questo è
+        più il
+        <i>segnalo che c'è 'sta roba lì, è tua se te la vai a prendere</i>.
+        <br />
+        <br />
+        Clicca <a href="./tutorial.html">qui</a> per leggere il tutorial.
+      </p>
+      <div>
+        <button id="popupstart" type="button" onclick="closePopup()">X</button>
+      </div>
+    </div>
 
+    <script>
+      function closePopup() {
+        var popup = document.getElementById("popup");
+        popup.style.display = "none";
+      }
+      // Popup si chiude automaticamente dopo 13 secondi
+      setTimeout(closePopup, 13000);
+    </script>
   </body>
   <footer>
     <script type="module" type="text/javascript" src="/js/map.js"></script>
diff --git a/public/tutorial.html b/public/tutorial.html
index 3dd9e57..cf232e2 100644
--- a/public/tutorial.html
+++ b/public/tutorial.html
@@ -1,77 +1,105 @@
 <!DOCTYPE html>
 <html lang="en">
-
-<head>
-
+  <head>
     <style>
-        body {
-          box-sizing: border-box;
-          margin: 0;
-          padding: 14wh;
-          border: 10px solid #ccc;
-        }
-        div {
-          /* width: 300px;
+      body {
+        box-sizing: border-box;
+        margin: 0;
+        padding: 14wh;
+        border: 10px solid #ccc;
+      }
+      div {
+        /* width: 300px;
           height: 200px; */
-          background-color: #fbfbfb;
-          padding: 20px;
-        }
+        background-color: #fbfbfb;
+        padding: 20px;
+      }
     </style>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="icon" type="image/png" sizes="16x16" href="../img/trashw.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="../img/trashw.png" />
     <link rel="stylesheet" href="/css/map.css" />
     <title>RuscoMap Tutorial</title>
-</head>
-<body>
-<center>
-    <h1><img src="../img/trashg.png" alt="trasher" width="40" height="40">
+  </head>
+  <body>
+    <center>
+      <h1>
+        <img src="../img/trashg.png" alt="trasher" width="40" height="40" />
         RuscoMap
-        <img src="../img/trashg.png" alt="trasher" width="40" height="40">
-    </h1>
+        <img src="../img/trashg.png" alt="trasher" width="40" height="40" />
+      </h1>
 
-    <div>
+      <div>
         <p id="tutorial">
-            <b>RuscoMap</b> è una mappa dove utenti in anonimo possono inserire dei marker con nome,
-            descrizione e foto di oggetti abbandonati, segnalandoli a tutti i visitatori della mappa.
-            <br> <br>
-            Si può trovare o inserire la qualunque. L'obiettivo è il riutilizzo, la trasformazione
-            o la riparazione.
-            <br><br>
-            Sulla falsa riga del <i>"te lo regalo se vieni a prenderlo"</i>, questo è più il <i>"segnalo che c'è
-                'sta roba lì, è tua se te la vai a prendere"</i>.
-            <br><br>
+          <b>RuscoMap</b> è una mappa dove utenti in anonimo possono inserire
+          dei marker con nome, descrizione e foto di oggetti abbandonati,
+          segnalandoli a tutti i visitatori della mappa. <br />
+          <br />
+          Si può trovare o inserire la qualunque. L'obiettivo è il riutilizzo,
+          la trasformazione o la riparazione.
+          <br /><br />
+          Sulla falsa riga del <i>"te lo regalo se vieni a prenderlo"</i>,
+          questo è più il
+          <i>"segnalo che c'è 'sta roba lì, è tua se te la vai a prendere"</i>.
+          <br /><br />
         </p>
-    </div>
+      </div>
 
-
-    <h1><img src="../img/trashg.png" alt="trasher" width="40" height="40">
+      <h1>
+        <img src="../img/trashg.png" alt="trasher" width="40" height="40" />
         Tutorial
-        <img src="../img/trashg.png" alt="trasher" width="40" height="40">
-    </h1>
+        <img src="../img/trashg.png" alt="trasher" width="40" height="40" />
+      </h1>
 
-    <div>
+      <div>
         <p id="tutorial">
-            Cliccando sul <img src="../img/marker-icon18.png" alt="marker" width="18" height="30"> in alto a destra
-            si entra in modalità inserimento. Quindi si posiziona il marker sulla mappa in corrispondenza del rusco
-            avvistato, si compila il form che comparirà in alto e cliccando su "Aggiungi Marker" il nuovo rusco sarà presente sulla mappa.
-            <br><br>
-            Cliccando su <img src="../img/gps_arrow.png" alt="gpsarrow" width="27" height="18"> in alto a sinistra
-            verrà invece usato il gps per rilevare le proprie coordinate, in modo da posizionare con più precisione il marker da inserire.
-            Una volta individuata la propria posizione, disattivare il gps ricliccando su <img src="../img/gps_arrow.png" alt="gpsarrow" width="27" height="18"> e inserire
-            il marker cliccando sul <img src="../img/marker-icon18.png" alt="marker" width="18" height="30"> in alto a destra.
-        </p>
-    </div>
-            
-    <br><br>
-    <br><br>
-    <br><br>
-    <br><br>
-    
-    <p id="back">
-            Clicca <a href="./index.html">qui</a> per tornare alla mappa.
+          Cliccando sul
+          <img
+            src="../img/marker-icon18.png"
+            alt="marker"
+            width="18"
+            height="30"
+          />
+          in alto a destra si entra in modalità inserimento. Quindi si posiziona
+          il marker sulla mappa in corrispondenza del rusco avvistato, si
+          compila il form che comparirà in alto e cliccando su "Aggiungi Marker"
+          il nuovo rusco sarà presente sulla mappa. <br /><br />
+          Cliccando su
+          <img
+            src="../img/gps_arrow.png"
+            alt="gpsarrow"
+            width="27"
+            height="18"
+          />
+          in alto a sinistra verrà invece usato il gps per rilevare le proprie
+          coordinate, in modo da posizionare con più precisione il marker da
+          inserire. Una volta individuata la propria posizione, disattivare il
+          gps ricliccando su
+          <img
+            src="../img/gps_arrow.png"
+            alt="gpsarrow"
+            width="27"
+            height="18"
+          />
+          e inserire il marker cliccando sul
+          <img
+            src="../img/marker-icon18.png"
+            alt="marker"
+            width="18"
+            height="30"
+          />
+          in alto a destra.
         </p>
+      </div>
 
-</center>
+      <br /><br />
+      <br /><br />
+      <br /><br />
+      <br /><br />
 
-</body>
\ No newline at end of file
+      <p id="back">
+        Clicca <a href="./index.html">qui</a> per tornare alla mappa.
+      </p>
+    </center>
+  </body>
+</html>
