From 1bbd411e1cf29fc847b9f2b30672e09e8d7de105 Mon Sep 17 00:00:00 2001
From: Alexandre MOTTIER <am@am-networks.fr>
Date: Thu, 20 Mar 2025 21:24:13 +0100
Subject: [PATCH] v2.0 - A votre convenance

---
 LICENSE     |  0
 README.md   |  0
 repliq.html | 70 ++++++++++++++++++++++++++++++++---------------------
 3 files changed, 43 insertions(+), 27 deletions(-)
 mode change 100644 => 100755 LICENSE
 mode change 100644 => 100755 README.md
 mode change 100644 => 100755 repliq.html
diff --git a/LICENSE b/LICENSE
old mode 100644
new mode 100755
diff --git a/README.md b/README.md
old mode 100644
new mode 100755
diff --git a/repliq.html b/repliq.html
old mode 100644
new mode 100755
index 554c1be..b688197
--- a/repliq.html
+++ b/repliq.html
@@ -46,15 +46,19 @@
 <body>
     <h2>RépliQ - Générateur de bannière e-mail</h2>
     <label for="action">Demander une :</label>
-    <select id="action">
-        <option value="Lecture">Lecture</option>
+    <select id="action" onchange="toggleConvenienceOption()">
         <option value="Action">Action</option>
+        <option value="Lecture">Lecture</option>
         <option value="Réponse">Réponse</option>
     </select>
     <br><br>
     <label for="date">Date limite :</label>
     <input type="date" id="date">
     <br><br>
+    <div id="convenienceOption" style="display: none;">
+        <input type="checkbox" id="convenience"> À votre convenance
+    </div>
+    <br><br>
     <button onclick="generateBanner()">Générer</button>
     <button onclick="setASAP()">ASAP</button>
 
@@ -66,45 +70,64 @@
     <div id="hiddenContainer"></div>
 
     <script>
+        function toggleConvenienceOption() {
+            const action = document.getElementById("action").value;
+            const convenienceOption = document.getElementById("convenienceOption");
+            const dateInput = document.getElementById("date");
+            const convenienceCheckbox = document.getElementById("convenience");
+
+            if (action === "Lecture") {
+                convenienceOption.style.display = "block";
+            } else {
+                convenienceOption.style.display = "none";
+                convenienceCheckbox.checked = false;
+            }
+        }
+
         function generateBanner() {
             const action = document.getElementById("action").value;
             const dateInput = document.getElementById("date").value;
             const resultDiv = document.getElementById("result");
             const copyButton = document.getElementById("copyButton");
             const hiddenContainer = document.getElementById("hiddenContainer");
+            const convenienceCheckbox = document.getElementById("convenience").checked;
 
-            if (!dateInput) {
-                alert("Veuillez sélectionner une date ou utiliser le bouton ASAP.");
+            if (!dateInput && !convenienceCheckbox) {
+                alert("Veuillez sélectionner une date ou cocher 'À votre convenance'.");
                 return;
             }
 
-            const selectedDate = new Date(dateInput);
-            const formattedDate = selectedDate.toLocaleDateString("fr-FR");
-            const today = new Date();
-            const diffTime = selectedDate - today;
-            const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
-
+            let message = "";
             let bgColor = "#A8E6A3";
             let textColor = "#206A1E";
-            let message = `${action} souhaitée avant le ${formattedDate}.`;
 
-            if (diffDays <= 3) {
-                bgColor = "#FFD580";
-                textColor = "#A65E00";
+            if (convenienceCheckbox) {
+                message = "Lecture à votre convenance.";
+            } else {
+                const selectedDate = new Date(dateInput);
+                const formattedDate = selectedDate.toLocaleDateString("fr-FR");
+                const today = new Date();
+                const diffTime = selectedDate - today;
+                const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
+
+                message = `${action} souhaitée avant le ${formattedDate}.`;
+                if (diffDays <= 3) {
+                    bgColor = "#FFD580";
+                    textColor = "#A65E00";
+                }
             }
 
             if (action === "Lecture") {
-                message += "<br>Inutile de répondre.";
+                message += "\nInutile de répondre.";
             }
 
             resultDiv.style.backgroundColor = bgColor;
             resultDiv.style.color = textColor;
-            resultDiv.innerHTML = message;
+            resultDiv.textContent = message;
             resultDiv.style.display = "block";
             copyButton.style.display = "inline-block";
 
-            // Mettre le HTML formaté dans un conteneur caché
-            hiddenContainer.innerHTML = `<div style='background-color: ${bgColor}; color: ${textColor}; padding: 10px; font-weight: bold; border-radius: 5px; display: inline-block; text-align: left;'>${message}</div>`;
+            hiddenContainer.innerHTML = `<div style='background-color: ${bgColor}; color: ${textColor}; padding: 10px; font-weight: bold; border-radius: 5px; display: inline-block; text-align: center;'>${message.replace("\n", "<br>")}</div>`;
         }
 
         function setASAP() {
@@ -115,18 +138,11 @@
 
             resultDiv.style.backgroundColor = "#FFA8A8";
             resultDiv.style.color = "#8B0000";
-            let message = `${action} souhaitée dès que possible.`;
-
-            if (action === "Lecture") {
-                message += "<br>Inutile de répondre.";
-            }
-
-            resultDiv.innerHTML = message;
+            resultDiv.textContent = `${action} souhaitée dès que possible`;
             resultDiv.style.display = "block";
             copyButton.style.display = "inline-block";
 
-            // Mettre le HTML formaté dans un conteneur caché
-            hiddenContainer.innerHTML = `<div style='background-color: #FFA8A8; color: #8B0000; padding: 10px; font-weight: bold; border-radius: 5px; display: inline-block; text-align: left;'>${message}</div>`;
+            hiddenContainer.innerHTML = `<div style='background-color: #FFA8A8; color: #8B0000; padding: 10px; font-weight: bold; border-radius: 5px; display: inline-block; text-align: center;'>${action} souhaitée dès que possible</div>`;
         }
 
         function copyFormattedBanner() {
