<?php
session_start();
require_once "{$_SERVER['DOCUMENT_ROOT']}/login/php/authFunctions.php";

if (isset($_SESSION['user'])) {
    header('location: /');
    exit;
}

if ($loginAttemptCount = checkLoginAttempts() > 3) {
    setcookie('login_error', 'Too many failed login attempts, please try again later.', time() + 3600, '/');
}

?>

<!DOCTYPE html>
<html data-coreui-theme="dark" lang="en">
<head>
    <base href="./">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <meta name="description" content="Sentri - Configure phone configs">
    <meta name="author" content="Marco Mooij">
    <meta name="keyword" content="sentri">
    <title>Sentri | Login</title>

    <!-- favicon -->
    <link rel="icon" type="image/png" href="/src/images/favicon/favicon-96x96.png" sizes="96x96">
    <link rel="icon" type="image/svg+xml" href="/src/images/favicon/favicon-96x96.png">
    <link rel="shortcut icon" href="/src/images/favicon/favicon.ico">
    <link rel="apple-touch-icon" sizes="180x180" href="/src/images/favicon/apple-touch-icon.png">
    <link rel="manifest" href="/src/images/favicon/site.webmanifest">

    <link rel="stylesheet" href="css/style.full.min.css" as="style">
</head>
<body>
<div class="bg-body-tertiary min-vh-100 d-flex flex-row align-items-center">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-8 col-md-8 col-12 d-flex align-items-center justify-content-center">
                <div class="card-group d-block d-md-flex row">
                    <div class="card col-md-7 mb-0 border-0">
                        <div class="card-body p-3">
                            <?php if (isset($_COOKIE['loggedout'])) { ?>
                                <div class="row mt-0 pt-0">
                                    <div class="col">
                                        <div class="card bg-success">
                                            <div class="card-body">
                                                <i class="fa-solid fa-right-from-bracket"></i> You have been logged out successfully!
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <?php setcookie('loggedout', '', time() - 3600, '/');
                            }

                            if (isset($_COOKIE['login_error'])) { ?>
                                <div class="row mt-0 pt-0">
                                    <div class="col">
                                        <div class="card bg-danger">
                                            <div class="card-body">
                                                <i class="fa-solid fa-triangle-exclamation"></i> <?php echo $_COOKIE['login_error']; ?>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <?php setcookie('login_error', '', time() - 3600, '/'); ?><?php }

                            if (($loginAttemptCount <= 3)) {
                                if (!isset($_SESSION['mfa'])) { ?>
                                    <form method="post" action="/login/php/auth.php">
                                        <h1>Login</h1>
                                        <p class="text-body-secondary">Login with your account</p>
                                        <div class="input-group mb-3">
                                            <span class="input-group-text"><i class="fa-solid fa-user"></i></span>

                                            <label class="flex-grow-1 m-0">
                                                <input name="username" class="form-control w-100" type="text" placeholder="name@example.com">
                                            </label>
                                        </div>
                                        <div class="input-group mb-4">
                                            <span class="input-group-text"><i class="fa-solid fa-lock"></i></span>

                                            <label class="flex-grow-1 m-0">
                                                <input name="password" class="form-control" type="password" placeholder="Password">
                                            </label>
                                        </div>
                                        <div class="row pb-1">
                                            <div class="col-auto">
                                                <button class="btn btn-primary px-4" type="submit">
                                                    <i class="fa-solid fa-right-to-bracket"></i> Login
                                                </button>
                                            </div>
                                            <div class="col-6 text-end">
                                                <a class="btn btn-link px-0" type="button" href="/login/forgotPassword.php">Forgot password?</a>
                                            </div>
                                        </div>
                                    </form>
                                <?php } else { ?>
                                    <div class="card-body text-center justify-content-center align-items-center">
                                        <h1>Verification code</h1>
                                        <form method="post" action="/login/php/mfaAuth.php">
                                            <h5>Enter code from your app:</h5>
                                            <div class="mb-3">
                                                <div id="code-container">
                                                    <label>
                                                        <input name="verification-1" type="text" maxlength="1" class="code-input" autocomplete="off" autofocus>
                                                    </label>
                                                    <label>
                                                        <input name="verification-2" type="text" maxlength="1" class="code-input" autocomplete="off">
                                                    </label>
                                                    <label>
                                                        <input name="verification-3" type="text" maxlength="1" class="code-input" autocomplete="off">
                                                    </label>
                                                    <label>
                                                        <input name="verification-4" type="text" maxlength="1" class="code-input" autocomplete="off">
                                                    </label>
                                                    <label>
                                                        <input name="verification-5" type="text" maxlength="1" class="code-input" autocomplete="off">
                                                    </label>
                                                    <label>
                                                        <input name="verification-6" type="text" maxlength="1" class="code-input" autocomplete="off">
                                                    </label>
                                                </div>
                                            </div>
                                            <button class="btn btn-primary px-4" type="submit">
                                                <i class="fa-solid fa-certificate"></i> Verify
                                            </button>
                                        </form>
                                    </div>
                                <?php } ?><?php } else { ?>
                                <div class="alert alert-danger" role="alert">
                                    Too many failed login attempts, please try again later.
                                </div>
                            <?php } ?>
                        </div>
                    </div>
                    <div class="card col-md-5 text-white bg-transparent py-5 border-0">
                        <div class="card-body text-center pt-3">
                            <div>
                                <img class="pt-3 w-100 portal-image" alt="portal-image" width="500" height="265" src="">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<script src="/login/js/mfa.js"></script>
</body>
</html>