diff --git a/templates/index-glob.html b/templates/index-glob.html
index f0ea52635456de5d8a3820a4acef62ba2b8cc9b3..5f09974f484f4bd40bc3f0936c5786ffb435c5b5 100644
--- a/templates/index-glob.html
+++ b/templates/index-glob.html
@@ -92,6 +92,17 @@
font-size: 1.2em;
color: #1DB954;
}
+ table {
+ width: 100%;
+ border-collapse: collapse;
+ text-align: center; /* Centre tout le texte */
+ }
+ th, td {
+ border: 1px solid white;
+ padding: 10px;
+ text-align: center; /* Centre le texte des cellules */
+ }
+
</style>
</head>
<body>
@@ -101,6 +112,7 @@
<img src="https://upload.wikimedia.org/wikipedia/commons/2/26/Spotify_logo_with_text.svg" alt="Spotify Logo">
<button onclick="showTab('tab1')">Prédiction Binaire</button>
<button onclick="showTab('tab2')">Prédiction Supérieure à 0</button>
+ <button onclick="showTab('tab3')">Documentation des variables</button>
</div>
<!-- Contenu principal -->
@@ -109,7 +121,9 @@
<!-- Formulaire Binaire -->
<div id="tab1" class="tab-content active">
+ <h2>Binaire</h2>
<form id="formBinaire" onsubmit="sendPrediction(event, '/predict')">
+
<label for="name_bin">Titre de la chanson :</label>
<input type="text" id="name_bin" name="name" required>
@@ -153,8 +167,40 @@
</form>
</div>
+ <!-- DOCUMENTATION -->
+ <div id="tab3" class="tab-content">
+ <h2>Documentation des variables</h2>
+ <table border="1" style="width:100%; border-collapse: collapse; text-align: left; background: #282828; color: white;">
+ <thead>
+ <tr>
+ <th style="padding: 10px;">Nom</th>
+ <th style="padding: 10px;">Description</th>
+ <th style="padding: 10px;">Type</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr><td>Titre de la chanson</td><td>Nom de la musique</td><td>Caractère</td></tr>
+ <tr><td>Année</td><td>Année de sortie</td><td>YYYY (ex : 2002)</td></tr>
+ <tr><td>Acousticness</td><td>Entre 0 et 1, à quel point la musique est acoustique</td><td>Numérique</td></tr>
+ <tr><td>Danceability</td><td>Entre 0 et 1, à quel point la chanson est dansante</td><td>Numérique</td></tr>
+ <tr><td>Explicit</td><td>1 si la chanson contient des paroles explicites, 0 sinon</td><td>Numérique</td></tr>
+ <tr><td>Instrumentalness</td><td>Entre 0 et 1, à quel point la chanson est instrumentale</td><td>Numérique</td></tr>
+ <tr><td>Key</td><td>Tonalité de la chanson</td><td>Numérique</td></tr>
+ <tr><td>Liveness</td><td>Probabilité que la chanson ait été enregistrée en live</td><td>Numérique</td></tr>
+ <tr><td>Loudness</td><td>Volume sonore en décibels (-60 à 0)</td><td>Numérique</td></tr>
+ <tr><td>Mode</td><td>Tonalité, 1: majeure, 0: mineure</td><td>Numérique</td></tr>
+ <tr><td>Speechiness</td><td>Entre 0 et 1, quantité de paroles</td><td>Numérique</td></tr>
+ <tr><td>Tempo</td><td>Battements par minute (BPM)</td><td>Numérique</td></tr>
+ <tr><td>Valence</td><td>Entre 0 et 1, positivité de la chanson</td><td>Numérique</td></tr>
+ </tbody>
+ </table>
+ </div>
+
+
<!-- Formulaire Supérieur à 0 -->
<div id="tab2" class="tab-content">
+ <h2>Supérieur à 0</h2>
+
<form id="formSup0" onsubmit="sendPrediction(event, '/predict_sup0')">
<label for="name_bin">Titre de la chanson :</label>
<input type="text" id="name_sup0" name="name" required>