first

public/js/main.js

@@ -0,0 +1,159 @@
+/**
+ * Fichier JavaScript principal pour l'application Mail Notifier
+ */
+
+document.addEventListener('DOMContentLoaded', function() {
+  // Fermeture automatique des alertes après 5 secondes
+  setTimeout(function() {
+    const alerts = document.querySelectorAll('.alert');
+    alerts.forEach(function(alert) {
+      const bsAlert = new bootstrap.Alert(alert);
+      bsAlert.close();
+    });
+  }, 5000);
+  
+  // Activer les tooltips Bootstrap
+  const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+  tooltipTriggerList.map(function (tooltipTriggerEl) {
+    return new bootstrap.Tooltip(tooltipTriggerEl);
+  });
+  
+  // Gestionnaire d'événements pour la confirmation de suppression
+  const deleteForms = document.querySelectorAll('form[data-confirm]');
+  deleteForms.forEach(function(form) {
+    form.addEventListener('submit', function(event) {
+      const message = form.getAttribute('data-confirm') || 'Êtes-vous sûr de vouloir effectuer cette action?';
+      if (!confirm(message)) {
+        event.preventDefault();
+      }
+    });
+  });
+  
+  // Affichage du temps écoulé depuis la réception des emails
+  const timestampElements = document.querySelectorAll('.timestamp');
+  timestampElements.forEach(function(element) {
+    const timestamp = new Date(element.getAttribute('data-timestamp'));
+    element.textContent = timeAgo(timestamp);
+  });
+  
+  // Mise à jour automatique du tableau de bord
+  if (document.querySelector('#dashboard-content')) {
+    setInterval(refreshDashboard, 60000); // Actualiser toutes les minutes
+  }
+  
+  // Fonction pour tester la configuration Pushover
+  const testPushoverBtn = document.getElementById('testPushover');
+  if (testPushoverBtn) {
+    testPushoverBtn.addEventListener('click', function() {
+      const user = document.getElementById('pushoverUser').value;
+      const token = document.getElementById('pushoverToken').value;
+      
+      if (!user || !token) {
+        alert('Veuillez d\'abord configurer votre clé utilisateur et votre token d\'application Pushover.');
+        return;
+      }
+      
+      testPushoverBtn.disabled = true;
+      testPushoverBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Envoi en cours...';
+      
+      // Le formulaire est soumis par un événement onclick dans le HTML
+    });
+  }
+});
+
+/**
+ * Convertit une date en texte "il y a X temps"
+ * @param {Date} date - La date à convertir
+ * @returns {string} - Le texte formaté
+ */
+function timeAgo(date) {
+  const seconds = Math.floor((new Date() - date) / 1000);
+  
+  let interval = Math.floor(seconds / 31536000);
+  if (interval > 1) {
+    return 'il y a ' + interval + ' ans';
+  }
+  if (interval === 1) {
+    return 'il y a 1 an';
+  }
+  
+  interval = Math.floor(seconds / 2592000);
+  if (interval > 1) {
+    return 'il y a ' + interval + ' mois';
+  }
+  if (interval === 1) {
+    return 'il y a 1 mois';
+  }
+  
+  interval = Math.floor(seconds / 86400);
+  if (interval > 1) {
+    return 'il y a ' + interval + ' jours';
+  }
+  if (interval === 1) {
+    return 'hier';
+  }
+  
+  interval = Math.floor(seconds / 3600);
+  if (interval > 1) {
+    return 'il y a ' + interval + ' heures';
+  }
+  if (interval === 1) {
+    return 'il y a 1 heure';
+  }
+  
+  interval = Math.floor(seconds / 60);
+  if (interval > 1) {
+    return 'il y a ' + interval + ' minutes';
+  }
+  if (interval === 1) {
+    return 'il y a 1 minute';
+  }
+  
+  return 'à l\'instant';
+}
+
+/**
+ * Actualise le contenu du tableau de bord
+ */
+function refreshDashboard() {
+  fetch('/api/emails?limit=5')
+    .then(response => response.json())
+    .then(data => {
+      // Mettre à jour les compteurs
+      const totalCount = data.length;
+      const unreadCount = data.filter(email => !email.read).length;
+      
+      document.getElementById('total-count').textContent = totalCount;
+      document.getElementById('unread-count').textContent = unreadCount;
+      
+      // Mettre à jour la liste des derniers emails
+      const emailsList = document.getElementById('latest-emails');
+      if (emailsList && data.length > 0) {
+        let html = '';
+        
+        data.forEach(email => {
+          const date = new Date(email.receivedAt).toLocaleString();
+          const status = email.read 
+            ? '<span class="badge bg-success">Lu</span>' 
+            : '<span class="badge bg-warning">Non lu</span>';
+          
+          html += `
+            <tr>
+              <td>${date}</td>
+              <td>${email.from}</td>
+              <td>${email.subject}</td>
+              <td>${status}</td>
+              <td>
+                <a href="/emails/${email.id}" class="btn btn-sm btn-info">
+                  <i class="fas fa-eye"></i>
+                </a>
+              </td>
+            </tr>
+          `;
+        });
+        
+        emailsList.innerHTML = html;
+      }
+    })
+    .catch(error => console.error('Erreur lors de l\'actualisation du tableau de bord:', error));
+}