Quickstart Guide

<form id="registerForm" action="#" method="post">
  <div class="form-group">
    <label for="nombre"><?php echo $translations['auth']['register']['fullname']; ?></label>
    <input type="text" id="nombre" name="nombre" 
           placeholder="<?php echo $translations['auth']['register']['fullname_placeholder']; ?>" 
           required>
  </div>
  <div class="form-group">
    <label for="email"><?php echo $translations['auth']['register']['email']; ?></label>
    <input type="email" id="email" name="email" 
           placeholder="<?php echo $translations['auth']['register']['email_placeholder']; ?>" 
           required>
  </div>
  <div class="form-group">
    <label for="password"><?php echo $translations['auth']['register']['password']; ?></label>
    <input type="password" id="password" name="password" required>
  </div>
  <div class="form-group">
    <label for="confirm-password"><?php echo $translations['auth']['register']['confirmPassword']; ?></label>
    <input type="password" id="confirm-password" name="confirm-password" required>
  </div>
</form>

// Email validation
function validateEmail(email) {
    const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    return re.test(email);
}

// Password validation - at least 8 characters, one uppercase, one number
function validatePassword(password) {
    const re = /^(?=.*[A-Z])(?=.*\d).{8,}$/;
    return re.test(password);
}

const xhr = new XMLHttpRequest();
const formData = new FormData(registerForm);

xhr.open('POST', 'https://pro.finanzapp.es/app/auth/sendRegister.php', true);
xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');

xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {
        const data = JSON.parse(xhr.responseText);
        
        if (data.success) {
            notyf.success("Registro exitoso");
        } else {
            notyf.error("Registro fallido");
        }
    }
};

xhr.send(formData);

<div id="g_id_onload"
    data-client_id="665269631824-25f2bkbj039grhjavj17pkqjsjdqj0jr.apps.googleusercontent.com"
    data-context="signup"
    data-ux_mode="redirect"
    data-login_uri="https://pro.finanzapp.es/app/auth/google-callback.php"
    data-auto_prompt="false">
</div>

<form id="loginForm" action="#" method="post">
  <div class="form-group">
    <label for="email"><?= $translations['auth']['login']['email_label'] ?></label>
    <input type="email" id="email" name="email" 
           placeholder="<?= $translations['auth']['login']['email_placeholder'] ?>" 
           required>
  </div>
  <div class="form-group">
    <label for="password"><?= $translations['auth']['login']['password_label'] ?></label>
    <input type="password" id="password" name="password" 
           placeholder="<?= $translations['auth']['login']['password_placeholder'] ?>" 
           required>
  </div>
  <div class="form-group">
    <!-- reCAPTCHA -->
    <div class="g-recaptcha" data-sitekey="6LdpGAErAAAAABtf_pOcsJbRBnytt5t8_WahFXAY"></div>
    
    <button type="submit" class="btn btn-primary btn-large">
      <?= $translations['auth']['login']['submit'] ?>
    </button>
  </div>
</form>

if (isValid) {
    const xhr = new XMLHttpRequest();
    const formData = new FormData(loginForm);
    
    xhr.open('POST', 'https://pro.finanzapp.es/app/auth/sendLogin.php', true);
    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            const data = JSON.parse(xhr.responseText);
            
            if (data.success) {
                notyf.success("Inicio de sesión exitoso");
                console.log("Usuario logueado:", data.user);
            } else {
                notyf.error("Email o contraseña incorrectas");
            }
        }
    };
    
    xhr.send(formData);
}

// Start session if not already started
if (session_status() === PHP_SESSION_NONE) {
    session_start();
}

<div class="avatar-options">
  <?php for ($i = 1; $i <= 10; $i++): 
    $num = str_pad($i, 2, '0', STR_PAD_LEFT);
    $url = "https://carefully-happy-quetzal.global.ssl.fastly.net/assets/avatars/{$num}.jpeg"; 
  ?>
    <label>
      <input type="radio" name="avatar" value="<?= $url ?>" />
      <img src="<?= $url ?>" alt="Avatar <?= $num ?>" />
    </label>
  <?php endfor; ?>
</div>

emailjs.send(serviceID, templateID, {
    to_name: userName,
    goal_name: goalName,
    target_amount: targetAmount,
    achievement_date: new Date().toLocaleDateString()
});