<?php

$pageStyles[] = 'app/css/login.css';

requireGuest();

$mode = $_GET['mode'] ?? 'login';
$error = null;

if ($_SERVER['REQUEST_METHOD'] === 'POST') {

    $action = $_POST['action'] ?? '';

    if ($action === 'login') {

        $token = login(
            $_POST['email'] ?? '',
            $_POST['password'] ?? '',
            isset($_POST['remember'])
        );

        if ($token !== null) {
            header('Location: ?page=home');
            exit;
        }

        $error = 'Invalid email or password.';
        $mode = 'login';
    }

    if ($action === 'register') {

        $userId = register(
            $_POST['username'] ?? '',
            $_POST['email'] ?? '',
            $_POST['password'] ?? ''
        );

        if ($userId !== null) {

            login(
                $_POST['email'] ?? '',
                $_POST['password'] ?? '',
                false
            );

            header('Location: ?page=home');
            exit;
        }

        $error = 'Registration failed. Please check your input.';
        $mode = 'register';
    }
}

$isRegister = $mode === 'register';
?>

<div class="container auth-container d-flex align-items-center justify-content-center">

    <div class="card auth-card shadow-lg border">

        <div class="row g-0 h-100">

            <div class="col-lg-6 auth-brand p-5 d-flex flex-column justify-content-center">

                <div class="auth-logo mb-4">
                    <i class="fa-solid fa-shield-halved"></i>
                </div>

                <h1 class="display-5 fw-bold mb-3">
                    <?= $isRegister ? 'Create Account' : 'Welcome Back' ?>
                </h1>

                <p class="text-secondary mb-0">
                    <?= $isRegister
                        ? 'Create your account and start using Project Kiln.'
                        : 'Sign in to access your dashboard and continue your work.' ?>
                </p>

            </div>

            <div class="col-lg-6 p-5 d-flex flex-column justify-content-center">

                <?php if ($error): ?>

                    <div class="alert alert-danger mb-4">
                        <i class="fa-solid fa-circle-exclamation me-2"></i>
                        <?= htmlspecialchars($error) ?>
                    </div>

                <?php endif; ?>

                <?php if (!$isRegister): ?>

                    <form method="post">

                        <input
                            type="hidden"
                            name="action"
                            value="login"
                        >

                        <div class="mb-3">

                            <label class="form-label">
                                Email Address
                            </label>

                            <div class="input-group">

                                <span class="input-group-text">
                                    <i class="fa-solid fa-envelope"></i>
                                </span>

                                <input
                                    type="email"
                                    name="email"
                                    class="form-control"
                                    placeholder="name@example.com"
                                    required
                                >

                            </div>

                        </div>

                        <div class="mb-3">

                            <label class="form-label">
                                Password
                            </label>

                            <div class="input-group">

                                <span class="input-group-text">
                                    <i class="fa-solid fa-lock"></i>
                                </span>

                                <input
                                    type="password"
                                    name="password"
                                    class="form-control"
                                    placeholder="Enter your password"
                                    required
                                >

                            </div>

                        </div>

                        <div class="form-check mb-4">

                            <input
                                type="checkbox"
                                class="form-check-input"
                                name="remember"
                                id="remember"
                            >

                            <label
                                class="form-check-label"
                                for="remember"
                            >
                                Remember me
                            </label>

                        </div>

                        <button
                            type="submit"
                            class="btn btn-primary w-100 py-2"
                        >
                            <i class="fa-solid fa-right-to-bracket me-2"></i>
                            Sign In
                        </button>

                    </form>

                    <div class="text-center mt-4 auth-switch">

                        Don't have an account?

                        <a href="?page=login&mode=register">
                            Create one
                        </a>

                    </div>

                <?php else: ?>

                    <form method="post">

                        <input
                            type="hidden"
                            name="action"
                            value="register"
                        >

                        <div class="mb-3">

                            <label class="form-label">
                                Username
                            </label>

                            <div class="input-group">

                                <span class="input-group-text">
                                    <i class="fa-solid fa-user"></i>
                                </span>

                                <input
                                    type="text"
                                    name="username"
                                    class="form-control"
                                    placeholder="Choose a username"
                                    required
                                >

                            </div>

                        </div>

                        <div class="mb-3">

                            <label class="form-label">
                                Email Address
                            </label>

                            <div class="input-group">

                                <span class="input-group-text">
                                    <i class="fa-solid fa-envelope"></i>
                                </span>

                                <input
                                    type="email"
                                    name="email"
                                    class="form-control"
                                    placeholder="name@example.com"
                                    required
                                >

                            </div>

                        </div>

                        <div class="mb-4">

                            <label class="form-label">
                                Password
                            </label>

                            <div class="input-group">

                                <span class="input-group-text">
                                    <i class="fa-solid fa-lock"></i>
                                </span>

                                <input
                                    type="password"
                                    name="password"
                                    class="form-control"
                                    placeholder="Minimum 8 characters"
                                    required
                                >

                            </div>

                        </div>

                        <button
                            type="submit"
                            class="btn btn-primary w-100 py-2"
                        >
                            <i class="fa-solid fa-user-plus me-2"></i>
                            Create Account
                        </button>

                    </form>

                    <div class="text-center mt-4 auth-switch">

                        Already have an account?

                        <a href="?page=login">
                            Sign In
                        </a>

                    </div>

                <?php endif; ?>

            </div>

        </div>

    </div>

</div>