Skip to content
Snippets Groups Projects
Commit d10f0920 authored by Simon Majorczyk's avatar Simon Majorczyk
Browse files

Index html final

parent e1194758
No related merge requests found
...@@ -92,6 +92,17 @@ ...@@ -92,6 +92,17 @@
font-size: 1.2em; font-size: 1.2em;
color: #1DB954; 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> </style>
</head> </head>
<body> <body>
...@@ -101,6 +112,7 @@ ...@@ -101,6 +112,7 @@
<img src="https://upload.wikimedia.org/wikipedia/commons/2/26/Spotify_logo_with_text.svg" alt="Spotify Logo"> <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('tab1')">Prédiction Binaire</button>
<button onclick="showTab('tab2')">Prédiction Supérieure à 0</button> <button onclick="showTab('tab2')">Prédiction Supérieure à 0</button>
<button onclick="showTab('tab3')">Documentation des variables</button>
</div> </div>
<!-- Contenu principal --> <!-- Contenu principal -->
...@@ -109,7 +121,9 @@ ...@@ -109,7 +121,9 @@
<!-- Formulaire Binaire --> <!-- Formulaire Binaire -->
<div id="tab1" class="tab-content active"> <div id="tab1" class="tab-content active">
<h2>Binaire</h2>
<form id="formBinaire" onsubmit="sendPrediction(event, '/predict')"> <form id="formBinaire" onsubmit="sendPrediction(event, '/predict')">
<label for="name_bin">Titre de la chanson :</label> <label for="name_bin">Titre de la chanson :</label>
<input type="text" id="name_bin" name="name" required> <input type="text" id="name_bin" name="name" required>
...@@ -153,8 +167,40 @@ ...@@ -153,8 +167,40 @@
</form> </form>
</div> </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 --> <!-- Formulaire Supérieur à 0 -->
<div id="tab2" class="tab-content"> <div id="tab2" class="tab-content">
<h2>Supérieur à 0</h2>
<form id="formSup0" onsubmit="sendPrediction(event, '/predict_sup0')"> <form id="formSup0" onsubmit="sendPrediction(event, '/predict_sup0')">
<label for="name_bin">Titre de la chanson :</label> <label for="name_bin">Titre de la chanson :</label>
<input type="text" id="name_sup0" name="name" required> <input type="text" id="name_sup0" name="name" required>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment