add auto role for new member and member in vocal

app/public/guild.css

@@ -139,4 +139,61 @@ small code {
   form {
     padding: 15px;
   }
-}
+}
+
+#autorole-vocal-exclude-channel {
+  background-color: #0f1115;
+  color: #e5e7eb;
+
+  border: 1px solid #2a2f3a;
+  border-radius: 8px;
+
+  padding: 8px;
+  font-size: 14px;
+
+  min-width: 240px;
+
+  outline: none;
+}
+
+/* options */
+#autorole-vocal-exclude-channel option {
+  background-color: #0f1115;
+  color: #e5e7eb;
+  padding: 6px;
+}
+
+/* hover */
+#autorole-vocal-exclude-channel option:hover {
+  background-color: #1f2937;
+}
+
+/* sélection */
+#autorole-vocal-exclude-channel option:checked {
+  background-color: #2563eb; /* bleu */
+  color: #ffffff;
+}
+
+/* focus */
+#autorole-vocal-exclude-channel:focus {
+  border-color: #2563eb;
+  box-shadow: 0 0 0 1px #2563eb;
+}
+
+/* scrollbar (Chrome / Edge) */
+#autorole-vocal-exclude-channel::-webkit-scrollbar {
+  width: 8px;
+}
+
+#autorole-vocal-exclude-channel::-webkit-scrollbar-track {
+  background: #0f1115;
+}
+
+#autorole-vocal-exclude-channel::-webkit-scrollbar-thumb {
+  background: #2a2f3a;
+  border-radius: 4px;
+}
+
+#autorole-vocal-exclude-channel::-webkit-scrollbar-thumb:hover {
+  background: #3b4252;
+}

app/public/guild.html

@@ -88,6 +88,49 @@
       <button type="submit">Sauvegarder</button>
       <div id="status-goodbye-form"></div>
     </form>
+
+
+    <form id="autorole-newuser-form">
+      <label>
+        <input type="checkbox" id="autorole-enabled" />
+        Activer le rôle automatique pour les nouveaux membres
+      </label>
+
+      <label>
+        Rôle à attribuer :
+        <br />
+        <select id="autorole-role">
+        </select>
+      </label>
+
+      <button type="submit">Sauvegarder</button>
+      <div id="status-autorole-form"></div>
+    </form>
+
+
+    <form id="autorole-vocal-form">
+      <label>
+        <input type="checkbox" id="autorole-vocal-enabled" />
+        Activer le rôle automatique pour les membres en vocal
+      </label>
+
+      <label>
+        Rôle à attribuer :
+        <br />
+        <select id="autorole-vocal-role">
+        </select>
+      </label>
+
+      <label>
+        Salon à éviter :
+        <br />
+        <select id="autorole-vocal-exclude-channel" multiple size="5">
+        </select>
+      </label>
+
+      <button type="submit">Sauvegarder</button>
+      <div id="status-autorole-vocal-form"></div>
+    </form>
     
 
     <script>
@@ -107,6 +150,68 @@
             "guild-name"
           ).textContent = `Dashboard : ${guild.name}`;
         });
+      
+
+      fetch(`/api/bot/get-text-channels/${guildId}`)
+        .then(res => res.json())
+        .then(channels => {
+          const selectWelcome = document.getElementById("welcome-channel");
+          const selectGoodbye = document.getElementById("goodbye-channel");
+          channels.forEach(channel => {
+            const option = document.createElement("option");
+            option.value = channel.id;
+            option.textContent = `#${channel.name}`;
+            selectWelcome.appendChild(option);
+            selectGoodbye.appendChild(option.cloneNode(true));
+          });
+        });
+
+      
+
+      const selectExclude = document.getElementById("autorole-vocal-exclude-channel");
+      selectExclude.innerHTML = ""; // reset
+
+      fetch(`/api/bot/get-voice-channels/${guildId}`)
+        .then(res => res.json())
+        .then(channels => {
+          channels.forEach(channel => {
+            const option = document.createElement("option");
+            option.value = channel.id;
+            option.textContent = `#${channel.name}`;
+            selectExclude.appendChild(option);
+          });
+          return fetch(`/api/bot/get-autorole-vocal-config/${guildId}`);
+        })
+        .then(res => res.json())
+        .then(cfg => {
+          document.getElementById("autorole-vocal-enabled").checked = !!cfg.enabled;
+          document.getElementById("autorole-vocal-role").value = cfg.roleId ?? "";
+
+          const excluded = Array.isArray(cfg.excludeChannelIds)
+            ? cfg.excludeChannelIds.map(String) // sécurité
+            : [];
+
+          Array.from(selectExclude.options).forEach(option => {
+            option.selected = excluded.includes(option.value);
+          });
+        })
+        .catch(console.error);
+
+
+
+      fetch(`/api/bot/get-roles/${guildId}`)
+        .then(res => res.json())
+        .then(roles => {
+          const selectAutorole = document.getElementById("autorole-role");
+          const selectAutoroleVocal = document.getElementById("autorole-vocal-role");
+          roles.forEach(role => {
+            const option = document.createElement("option");
+            option.value = role.id;
+            option.textContent = role.name;
+            selectAutorole.appendChild(option);
+            selectAutoroleVocal.appendChild(option.cloneNode(true));
+          });
+        });
 
 
       const welcomeForm = document.getElementById("welcome-form");
@@ -159,20 +264,53 @@
       });
 
 
-      fetch(`/api/bot/get-text-channels/${guildId}`)
-        .then(res => res.json())
-        .then(channels => {
-          const selectWelcome = document.getElementById("welcome-channel");
-          const selectGoodbye = document.getElementById("goodbye-channel");
-          channels.forEach(channel => {
-            const option = document.createElement("option");
-            option.value = channel.id;
-            option.textContent = `#${channel.name}`;
-            selectWelcome.appendChild(option);
-            selectGoodbye.appendChild(option.cloneNode(true));
-          });
+      const autoroleNewUserForm = document.getElementById("autorole-newuser-form");
+      autoroleNewUserForm.addEventListener("submit", async (e) => {
+        e.preventDefault();
+        const enabled = document.getElementById("autorole-enabled").checked;
+        const roleId = document.getElementById("autorole-role").value;
+
+        const res = await fetch("/api/bot/save-autorole-newuser-config", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            guildId,
+            roleId,
+            enabled,
+          }),
         });
 
+        const data = await res.json();
+        document.getElementById("status-autorole-form").textContent = data.success
+          ? "Config d'auto-rôle pour nouveaux membres sauvegardée ✅"
+          : "Erreur ❌";
+      });
+
+
+      const autoroleVocalForm = document.getElementById("autorole-vocal-form");
+      autoroleVocalForm.addEventListener("submit", async (e) => {
+        e.preventDefault();
+        const enabled = document.getElementById("autorole-vocal-enabled").checked;
+        const roleId = document.getElementById("autorole-vocal-role").value;
+        const excludeChannelSelect = document.getElementById("autorole-vocal-exclude-channel");
+        const excludeChannelId = Array.from(excludeChannelSelect.selectedOptions).map(option => option.value);
+
+        const res = await fetch("/api/bot/save-autorole-vocal-config", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            guildId,
+            roleId,
+            excludeChannelId,
+            enabled,
+          }),
+        });
+        const data = await res.json();
+        document.getElementById("status-autorole-vocal-form").textContent = data.success
+          ? "Config d'auto-rôle pour membres en vocal sauvegardée ✅"
+          : "Erreur ❌";
+      });
+
 
       fetch(`/api/bot/get-welcome-config/${guildId}`)
         .then(res => res.json())
@@ -190,6 +328,16 @@
           document.getElementById("goodbye-channel").value = cfg.channelId;
           document.getElementById("goodbye-message").value = cfg.message;
         });
+
+
+      fetch(`/api/bot/get-autorole-newuser-config/${guildId}`)
+        .then(res => res.json())
+        .then(cfg => {
+          document.getElementById("autorole-enabled").checked = cfg.enabled;
+          document.getElementById("autorole-role").value = cfg.roleId;
+        });
+
+
     </script>
   </body>
 </html>

app/public/index.html

@@ -13,7 +13,7 @@
     <div id="profil">
       <img id="avatar" src="" alt="Avatar">
       <span id="username"></span>
-      <a id="logout" href="/logout">Se déconnecter</a>
+      <a id="logout" href="/auth/logout">Se déconnecter</a>
     </div>
   </nav>
   <h1>LazyBot</h1>