<?php
	session_start();
	if(isset($_SESSION['id'])){
		header('Location: home.php');
	}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="utf-8">
    <title>Login</title>
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css">
    <link href="css/main.css" rel="stylesheet" type="text/css">
    <link href="css/registration.css" rel="stylesheet" type="text/css">
    <link href="css/normalize.css" rel="stylesheet" type="text/css">
    <link href="css/style.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

</head>
<body>
<div class="login container-sm">
    <form id="login">
        <label for="username">
            <i class="fas fa-user"></i>
        </label>
        <input type="text" name="username" placeholder="Username" id="username" required>
    <br>
        <br>
        <label for="password">
            <i class="fas fa-lock"></i>
        </label>
        <input type="password" name="password" placeholder="Password" id="password" required>

        <button type="submit" class="submit-button" value="Login">Login</button>

			    <a class="nav-link" data-bs-toggle="modal" data-bs-target="#exampleModal">
				    Forgot Password
			    </a>

        <a href="reg_form.php" class="nav-link" id="signup">I'm new to this site</a>
	    
    </form>
    <!-- Button trigger modal -->
	
    <!-- Modal -->
    <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Account Recovery</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form id="callPwdRecover" action="password_recovery.php" method="post">
                        <div class="form-subheader">Please enter your e-mail address or provided username or below.</div>
                        <input type="text" id="recUsername" name="username">
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="submit-button">Submit</button>
                </div>
                </form>
                </div>
            </div>
        </div>
    </div>
    <div id="starsbefore" style="display: none">
        <label for="prev_user" class="form-label">Have you or your school ever participated in a STARS event
            before?<span class="form-required">*</span></label>
        <select id="prev_user" name="prev_user" onchange="showFindMe()" required>
            <option> --- </option>
            <option value="yes">Yes</option>
            <option value="no">No</option>
        </select>
        <hr>
        <div class="button">
            <a href="reg_form.php" class="submit-button" id="reg_submit" style="display: none">Sign Up</a>
            <a href="user_confirm.html" class="submit-button" id="user_search" name="user_search" style="display: none">Find Me</a>
        </div>

    </div>
</div>
<script src="js/vendor/modernizr-3.11.2.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js" integrity="sha256-lSjKY0/srUM9BE3dPm+c4fBo1dky2v27Gdjm2uoZaL0=" crossorigin="anonymous"></script>
<script>

    $(function () {
        $("#login").on("submit", function (event) {
            event.preventDefault()
            $.ajax({
                type: "POST",
                url: "authenticate.php",
                data: {
                    username: $('#username').val(),
                    password: $('#password').val()
                },
                async: false,
                dataType: "json",
                success: function (data) {
                    if(data["error_message"]){
                        alert(data["error_message"])
                    } else {
                        var url = 'home.php';
                        window.location.href = url;
                    }
                },
                error: function (data) {
                    console.log(data)
                    alert(data["error_message"])
                }
            });
        })
        


    })
</script>
</body>
</html>