<?php
session_start();
include("connection/db.php");

$error = ""; // Initialize error variable

if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['login'])) {
    $uname = mysqli_real_escape_string($link, $_POST['uname']);
    $password = mysqli_real_escape_string($link, $_POST['password']);

    if (empty($uname)) {
        $error .= "Please enter username.<br>";
    }
    if (empty($password)) {
        $error .= "Please enter password.<br>";
    }

    if (empty($error)) {
        $select = "SELECT * FROM admin WHERE User_id='$uname' LIMIT 1";
        $query = mysqli_query($link, $select);
        $fetch = mysqli_fetch_assoc($query);

        if ($fetch) {
            if ($fetch['pass'] === $password) { // Since passwords are stored in plain text
                $_SESSION['adminuser'] = $uname;
                header("Location: welcome.php");
                exit();
            } else {
                header("Location: login.php?errmsg=1");
                exit();
            }
        } else {
            header("Location: login.php?errmsg=1");
            exit();
        }
    }
}
?>


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Login | SWASTIK CLASS</title>
    <link href="css/bootstrap.css" rel="stylesheet" />
    <link href="css/login.css" rel="stylesheet" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
    <div class="bg-img">
        <div class="content">
            <div class="hedlogo">
                <img src="images/logo.png" alt="Logo">
            </div>
            <form method="post" action="">
                <div style="color:#FF0000;"><?php echo $error; ?></div>

                <div class="field">
                    <span class="fa fa-user"></span>
                    <input type="text" name="uname" required placeholder="Username">
                </div>
                <div class="field space">
                    <span class="fa fa-lock"></span>
                    <input type="password" name="password" class="pass-key" required placeholder="Password">
                    <span class="show">SHOW</span>
                </div>
                <div class="pass">
                    <a href="#">Forgot Password?</a>
                </div>
                <div class="field">
                    <input type="submit" name="login" value="LOGIN">
                </div>
            </form>
        </div>
    </div>

    <script>
        const pass_field = document.querySelector(".pass-key");
        const showBtn = document.querySelector(".show");
        showBtn.addEventListener("click", function() {
            if (pass_field.type === "password") {
                pass_field.type = "text";
                showBtn.textContent = "HIDE";
                showBtn.style.color = "#3498db";
            } else {
                pass_field.type = "password";
                showBtn.textContent = "SHOW";
                showBtn.style.color = "#222";
            }
        });
    </script>
</body>
</html>
