contact.php

📌 Propósito

contact.php es la página de contacto de la aplicación web donde los usuarios pueden enviarnos dudas o comentarios. En esta página, el usuario puede ingresar su nombre, correo electrónico, asunto y mensaje. La funcionalidad de envío de correos está implementada mediante los scripts initEmail.js y email.js usando la API de EmailJS.

⚙️ Funcionalidades clave

Formulario de contacto: Los usuarios pueden ingresar su nombre, correo, asunto y mensaje para enviarnos dudas o comentarios.

Envío de correo: Al enviar el formulario, se utiliza EmailJS para procesar y enviar el mensaje al equipo de soporte.

Anti-spam: Para evitar el envío repetido de mensajes en un corto período de tiempo, el sistema implementa un temporizador de espera de 5 minutos entre envíos.

🌄 Imágenes

Estructura común

Al igual que en otras páginas, contact.php incluye header.php, footer.php y header_mobile.php para mantener la estructura consistente en toda la aplicación.

• header.php: Contiene la navegación principal.
• footer.php: Incluye información de copyright y enlaces a otras páginas como cookies.php y terminos.php.
• mobileMenu.php: Se muestra en dispositivos móviles, sustituyendo al header estándar de escritorio.

🧩 Archivos relacionados

• initEmail.js: Inicializa el servicio de EmailJS usando una clave de servicio y configura la API de envío de correos.
• email.js: Se encarga de enviar el correo cuando el formulario de contacto es enviado. También implementa un temporizador para evitar el envío repetido de mensajes en un corto período de tiempo.

Detalles técnicos:

• Formulario de contacto: Se captura la información del usuario (nombre, correo, asunto y mensaje) desde los campos de entrada del formulario.
• Envío de correos: Utiliza EmailJS para enviar los datos del formulario a un servicio de correo preconfigurado.
• Temporizador de espera: Impide que los usuarios envíen múltiples mensajes en un corto período de tiempo, mostrando un mensaje de espera si intentan enviar un formulario antes de que haya pasado el tiempo de espera.

🛠️ Dependencias:

• EmailJS: La integración con EmailJS es necesaria para el funcionamiento del formulario de contacto.

💡 Detalles técnicos

1. initEmail.js:

   • Se utiliza para inicializar EmailJS con la clave del servicio. Esto permite que la API de EmailJS sea utilizada por email.js para enviar correos.

   emailjs.init('user_x');

2. email.js:

   • Maneja el envío del correo, incluyendo la creación de un número de ticket único para cada mensaje y el formato de fecha internacional para los registros.
   • Se implementa un temporizador que previene el reenvío de mensajes en menos de 5 minutos.

   emailjs.send(serviceID, templateID, {
       title: subject,
       name: name,
       time: formattedTime,
       message: message,
       email: email,
       ticket_number: `TKT-${ticketNumber}`,
       current_year: new Date().getFullYear()
   })