<?php
session_start();

$config = require __DIR__ . '/config.php';

$error = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $user = $_POST['username'] ?? '';
    $pass = $_POST['password'] ?? '';

    if (isset($config['users'][$user])) {

        $userData = $config['users'][$user];

        if (password_verify($pass, $userData['password_hash'])) {

            $_SESSION['logged_in'] = true;
            $_SESSION['username']  = $user;
            $_SESSION['page']      = $userData['page'];

            header('Location: page.php');
            exit;
        }
    }

    $error = 'Invalid credentials.';
}
?>
<!doctype html>
<html>
<head>
<title>Oh, did I give you a password? Prove it.</title>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
<link rel='icon' href='images/console_prompt-16.png' type='image/gif'>
<style>
body { background-color:black; }
h1,h2,h3,p,label { color:white; font-family:monospace; }

input {
    background:black;
    border:1px solid white;
    color:white;
    padding:5px;
    margin:5px;
    font-family:monospace;
}

button {
    background:#7334A3;
    border:outset;
    color:#5fc1f5;
    font-family:monospace;
    padding:6px 12px;
    cursor:pointer;
}

.error { color:#f75e5e; }
.green-span { color:lightgreen; }

.input-size-set {min-width:340px;}
.button-style-reset {all:revert;}


.truncate {
             /* Must have a defined width or max-width */
  white-space: nowrap;    /* Prevents text from wrapping */
  overflow: hidden;       /* Hides the text that overflows */
  text-overflow: ellipsis;/* Adds the "..." */
}

footer {
position:relative;
top:94vh;
}

</style>

<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/stylesheet.css">
<link rel="stylesheet" href="css/stylesheet-logreg.css">

<!-- Primary Meta Tags -->
<meta name="title" content="share.teethy.io - Secure File Share" />
<meta name="description" content="Files shared privately and securely using a TLS v1.3 Webtunnel." />
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta property="og:url" content="https://share.teethy.io/" />
<meta property="og:title" content="share.teethy.io - Secure File Share" />
<meta property="og:description" content="Files shared privately and securely using a TLS v1.3 Webtunnel." />
<meta property="og:image" content="https://share.teethy.io/images/metatag.png" />

<!-- X (Twitter) -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:url" content="https://share.teethy.io/" />
<meta property="twitter:title" content="share.teethy.io - Secure File Share" />
<meta property="twitter:description" content="Files shared privately and securely using a TLS v1.3 Webtunnel." />
<meta property="twitter:image" content="https://share.teethy.io/images/metatag.png"" />

<!-- Meta Tags -->


</head>

<body>

<div class="form-window" style="top:4px;">
<div class="divsticky">
<center>
<h2 class="h2popup login-popup-fix truncate">
<div class="handle"><sup class="handle-dash">-</sup></div>
TeethOS 3.11 &mdash; Login to a Shared Page &mdash; TLS<span style="color:aqua;"> v1.3</span> Webtunnel
<div onclick="location.href='/'" class="minimise">
<sup style="color:black;" class="suppopup">▾</sup>
</div>
</h2>
</center>
</div>

<center>
<h1>Authentication Required</h1>
<!--<h3>Enter the provided credentials to access network &amp; webserver resources or other shared items.</h3>-->

<?php if ($error): ?>
<p class="error"><?= htmlspecialchars($error) ?></p>
<?php endif; ?>

<form method="POST">
<label for="username-id">Username:</label><br>
<input id="username-id" class="input-size-set"
       placeholder="Identification required. Who are you?"
       type="text"
       name="username" autocomplete="off"><br>

<label for="password-id">Password:</label><br>
<input id="password-id" class="input-size-set"
       placeholder="Tell me what I want to hear."
       type="password"
       name="password" autocomplete="off"><br><br>

<img style="max-width:10vw;width:10%;" src="images/WIN3KEY.PNG">
<br>
<button class="button-style-reset" type="submit">Login</button>
</form>

<br>
<p>Login for access pages or files that <span style="color:#ac79d2;text-shadow:1px 0 0 #fff, 0 -1px 0 #fff, 0 1px 0 #fff, -1px 0 0 #fff;">Teethy</span> has shared with you via a <span class="green-span">secure</span> web tunnel.</p>

</center>

</div>

</body>
<footer>
<h5>Powered by <a href="https://teethy.ca" target="_blank">teethy.ca</a>.</h5>
</footer>
</html>
