From 2eead818292206cc19042a74a102ac76996c16d8 Mon Sep 17 00:00:00 2001
From: Samuel Vermeulen <samuel@vermeulen.pro>
Date: Sat, 18 May 2024 22:31:01 +0200
Subject: [PATCH] Optimisation code

---
 index.html | 137 +++++++++++++++++++++++++++--------------------------
 1 file changed, 71 insertions(+), 66 deletions(-)

diff --git a/index.html b/index.html
index eb02f41..3fead7b 100644
--- a/index.html
+++ b/index.html
@@ -21,73 +21,78 @@
     <div class="bandeau">
        <div align="center">
           <table style="width: 900px; height: 160px; background-color: #B6D13A;">
-             <tr>	
-	<td style="width: 400px; height: auto; text-align: center; color: white;"><p style="font-size: 20pt; color: #5A72B7; -webkit-text-stroke: 3px #5A72B7; line-height: 0.5em;">HAUTES-VOSGES</p><p style="font-size: medium;"><b>Le Thillot - Bussang - La Bresse</b></p><div style="background: #5A72B7; color: white; font-family: arial; text-align: left;" id="rdb_thillot">Prog. Hautes-Vosges...</div></td>
-	<td style="width: 150px; text-align: center; vertical-align: middle;">
-	<a href="javascript:void(0)" onclick="lect_hv()"><span id="bouton_hv"></span></a>
-	<audio preload="none" id="live_hv" name="live_hv" width="100%">
-		<source src="https://stream.radiodesballons.com/hv" type="audio/mpeg" />
-	</audio>
-	</td>
-	<td style="text-align: center; width: 250px; vertical-align: middle;"><img width="100%" src="img/rdb.png"></td>
-	<td style="width: 150px; text-align: center; vertical-align: middle;">
-	<a href="javascript:void(0)" onclick="lect_remiremont()"><span id="bouton_remiremont"></span></a>
-	<audio preload="none" id="live_remiremont" name="live_remiremont" width="100%">
-		<source src="https://stream.radiodesballons.com/remiremont" type="audio/mpeg" />
-	</audio>
-	</td>
-	<td style="width: 400px; text-align: center; color: white;"><p style="font-size: 20pt; color: #5A72B7; -webkit-text-stroke: 3px #5A72B7; line-height: 0.5em;">REMIREMONT</p><p style="font-size: medium;"><b>Secteur de Remiremont</b></p><div style="background: #5A72B7; color: white; font-family: arial; text-align: left;" id="rdb_remiremont">Prog. Remiremont 101.8...</div></td>
-</tr>
-</table>
-</div>
-
-<script>
-var v1 = document.getElementById("live_hv");
-var t1 = document.getElementById("titre_hv");
-var b1 = document.getElementById("bouton_hv");
-
-var v2 = document.getElementById("live_remiremont");
-var t2 = document.getElementById("titre_remiremont");
-var b2 = document.getElementById("bouton_remiremont");
-
-var etat1 = "stop";
-var etat2 = "stop";
-
-b1.innerHTML = "<img src=\"img/play.png\">";
-function lect_hv() {
-	if (etat1 == "stop") {
-		etat1 = "play";
-		b1.innerHTML = "<img src=\"img/play.gif\">";
-		v1.play();
-	} else if (etat1 == "play" || etat1 == "resume") {
-		etat1 = "pause";
-		b1.innerHTML = "<img src=\"img/play.png\">";
-		v1.pause();
-		v1.currentTime = 0
+             <tr>
+                <td style="width: 400px; height: auto; text-align: center; color: white;">
+                   <p style="font-size: 20pt; color: #5A72B7; -webkit-text-stroke: 3px #5A72B7; line-height: 0.5em;">HAUTES-VOSGES</p><p style="font-size: medium;"><b>Le Thillot - Bussang - La Bresse</b></p>
+                   <div style="background: #5A72B7; color: white; font-family: arial; text-align: left;" id="rdb_thillot">Prog. Hautes-Vosges...</div>
+                   </td>
+                   <td style="width: 150px; text-align: center; vertical-align: middle;">
+                      <a href="javascript:void(0)" onclick="lect_hv()"><span id="bouton_hv"></span></a>
+                      <audio preload="none" id="live_hv" name="live_hv" width="100%">
+                         <source src="https://stream.radiodesballons.com/hv" type="audio/mpeg" />
+                         </audio>
+                         </td>
+                         <td style="text-align: center; width: 250px; vertical-align: middle;"><img width="100%" src="img/rdb.png">
+                         </td>
+                         <td style="width: 150px; text-align: center; vertical-align: middle;">
+                            <a href="javascript:void(0)" onclick="lect_remiremont()"><span id="bouton_remiremont"></span></a>
+                            <audio preload="none" id="live_remiremont" name="live_remiremont" width="100%">
+                               <source src="https://stream.radiodesballons.com/remiremont" type="audio/mpeg" />
+                               </audio>
+                               </td>
+                               <td style="width: 400px; text-align: center; color: white;">
+                                  <p style="font-size: 20pt; color: #5A72B7; -webkit-text-stroke: 3px #5A72B7; line-height: 0.5em;">REMIREMONT</p>
+                                  <p style="font-size: medium;"><b>Secteur de Remiremont</b></p>
+                                  <div style="background: #5A72B7; color: white; font-family: arial; text-align: left;" id="rdb_remiremont">Prog. Remiremont 101.8...</div>
+                                  </td>
+                           </tr>
+                     </table>
+               </div>
+      <script>
+         var v1 = document.getElementById("live_hv");
+         var t1 = document.getElementById("titre_hv");
+         var b1 = document.getElementById("bouton_hv");
+         var v2 = document.getElementById("live_remiremont");
+         var t2 = document.getElementById("titre_remiremont");
+         var b2 = document.getElementById("bouton_remiremont");
+         var etat1 = "stop";
+         var etat2 = "stop";
+         b1.innerHTML = "<img src=\"img/play.png\">";
+         
+         function lect_hv() {
+            if (etat1 == "stop") {
+               etat1 = "play";
+               b1.innerHTML = "<img src=\"img/play.gif\">";
+               v1.play();
+               } else if (etat1 == "play" || etat1 == "resume") {
+                  etat1 = "pause";
+                  b1.innerHTML = "<img src=\"img/play.png\">";
+                  v1.pause();
+                  v1.currentTime = 0
     	} else if (etat1 == "pause") {
-		etat1 = "resume";
-		b1.innerHTML = "<img src=\"img/play.gif\">";
-		v1.play();
-	}
-}
-
-b2.innerHTML = "<img src=\"img/play.png\">";
-function lect_remiremont() {
-	if (etat2 == "stop") {
-		etat2 = "play";
-		b2.innerHTML = "<img src=\"img/play.gif\">";
-		v2.play();
-	} else if (etat2 == "play" || etat2 == "resume") {
-		etat2 = "pause";
-		b2.innerHTML = "<img src=\"img/play.png\">";
-		v2.pause();
-    	} else if (etat2 == "pause") {
-		etat2 = "resume";
-		b2.innerHTML = "<img src=\"img/play.gif\">";
-		v2.play();
-	}
-}
-</script>
+    	   etat1 = "resume";
+    	   b1.innerHTML = "<img src=\"img/play.gif\">";
+    	   v1.play();
+    	   }
+      }
+      b2.innerHTML = "<img src=\"img/play.png\">";
+      
+      function lect_remiremont() {
+         if (etat2 == "stop") {
+            etat2 = "play";
+            b2.innerHTML = "<img src=\"img/play.gif\">";
+            v2.play();
+            } else if (etat2 == "play" || etat2 == "resume") {
+               etat2 = "pause";
+               b2.innerHTML = "<img src=\"img/play.png\">";
+               v2.pause();
+               } else if (etat2 == "pause") {
+                  etat2 = "resume";
+                  b2.innerHTML = "<img src=\"img/play.gif\">";
+                  v2.play();
+                  }
+               }
+         </script>
     </div>
 </body>
 </html>
\ No newline at end of file