diff options
-rw-r--r-- | css/style.css | 32 | ||||
-rw-r--r-- | index.html | 65 | ||||
-rw-r--r-- | index.php | 50 | ||||
-rw-r--r-- | js/arrows.js | 37 | ||||
-rw-r--r-- | js/validate_hero.js | 58 | ||||
-rw-r--r-- | loggedin.php | 6 | ||||
-rw-r--r-- | login.html | 55 | ||||
-rw-r--r-- | loginregister.js | 101 | ||||
-rw-r--r-- | loginregister.php | 53 | ||||
-rw-r--r-- | php/configuration.php | 18 | ||||
-rw-r--r-- | php/database.php | 8 | ||||
-rw-r--r-- | php/login.php | 7 | ||||
-rw-r--r-- | php/logout.php | 10 | ||||
-rw-r--r-- | php/misc.php | 5 | ||||
-rw-r--r-- | php/register.php | 11 |
15 files changed, 279 insertions, 237 deletions
diff --git a/css/style.css b/css/style.css index 31778c4..9296e87 100644 --- a/css/style.css +++ b/css/style.css @@ -23,13 +23,38 @@ body { #header { background: white; margin: 0; - padding: 1rem; + padding: 0; + height: 3rem; font-size: 2em; + display: flex; + align-items: stretch; + user-select: none; + -webkit-user-select: none; + -ms-user-select: none; +} + +#topmenu { + font-size: 1.3rem; + list-style-type: none; + display: flex; + margin: 0; + padding: 0; +} + +#topmenu > li { + cursor: pointer; + padding: 10px; +} + +#topmenu > li:hover { + background: #eee; } .logo { font-family: monospace; margin: 0; + align-self: center; + padding-left: 2rem; } #hero { @@ -195,3 +220,8 @@ input[type=submit]:hover { bottom: 0; z-index: -200; } + +#loginform { + display: none; +} + diff --git a/index.html b/index.html deleted file mode 100644 index 6a2018b..0000000 --- a/index.html +++ /dev/null @@ -1,65 +0,0 @@ -<!DOCTYPE html> -<html> - <head> - <meta charset="utf-8"> - <title>shady file upload</title> - <link rel="stylesheet" type="text/css" href="css/style.css"> - </head> - - <body> - <div class="overlay" style="height: 100%;"> - <div class="vert2"> - <div id="header"> - <p class="logo">shady_file_upload</p> - </div> - - <div id="page"> - <div id="hero" class="overlay"> - <div id="arrows"> - <img src="svg/arrow.svg" id="protoarrow" style="display: none"> - </div> - - <div class="vcenter"> - <p>file upload service</p> - <p class="big">that <span class="blue">just about works</span></p> - <p>most of the time</p> - </div> - </div> - - <div class="vcenter"> - <form name="hero_form" action="/php/register.php" method="post" onsubmit="return validate_hero_form()"> - <h2>Get started</h2> - <div class="content"> - <p>Username</p> - <input type="text" id="username" name="username"> - <p id="username-length-error" class="hero_form_error" hidden>Please specify a username</p> - - <p>Email address</p> - <input type="text" id="email" name="email"> - <p id="email-error" class="hero_form_error" hidden>Invalid email address</p> - - <p>Password</p> - <input type="password" id="password" name="password"> - <p id="password-length-error" class="hero_form_error" hidden>Please provide a password</p> - - <p>Repeat Password</p> - <input type="password" id="password2" name="password2"> - <p id="password-match-error" class="hero_form_error" hidden>Passwords didn't match</p> - <input type="submit" value="Sign up"> - <p style="font-size: 1.1em;">Don't have an account? <a href="login.html">Log in</a> - </div> - </form> - </div> - - - </div> - </div> - - <img src="svg/bottom.svg" class="bgbottom"> - </div> - - <script src="js/arrows.js"></script> - <script src="js/validate_hero.js"></script> - - </body> - <html> diff --git a/index.php b/index.php new file mode 100644 index 0000000..21d56f0 --- /dev/null +++ b/index.php @@ -0,0 +1,50 @@ +<?php + session_start(); +?> +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <title>shady file upload</title> <link rel="stylesheet" type="text/css" href="css/style.css"> + </head> + + <body> + <div class="overlay" style="height: 100%;"> + <div class="vert2"> + <div id="header"> + <p class="logo">shady_file_upload</p> + + <div style="flex: 1 0 0;"></div> + <ul id="topmenu"> + + <?php if (array_key_exists("username", $_SESSION)) { ?> + + <li><?php echo $_SESSION['username'];?></li> + <li>Sign out</li> + + <?php } else {?> + + <li onclick="showLogin(false)">Sign up</li> + <li onclick="showLogin(true)">Log in</li> + + <?php }?> + </ul> + + </div> + + <div id="page"> + +<?php + if (array_key_exists("username", $_SESSION)) { + require_once("loggedin.php"); + } else { + require_once("loginregister.php"); + } +?> + + </div> + </div> + <img src="svg/bottom.svg" class="bgbottom"> + </div> + </body> +<html> diff --git a/js/arrows.js b/js/arrows.js deleted file mode 100644 index 10ad416..0000000 --- a/js/arrows.js +++ /dev/null @@ -1,37 +0,0 @@ - -arrows = []; - -const minSpeed = 3; -const maxSpeed = 8; -const delay = 1500; -const lifetime = 20000; - -function make_arrow() { - const svg = document.getElementById("protoarrow").cloneNode(); - svg.style.left = Math.random() * 100 + '%'; - svg.style.display = 'block'; - document.getElementById('arrows').append(svg); - const ob = { - y: -800, - svg: svg, - speed: Math.random() * (maxSpeed - minSpeed) + minSpeed - }; - arrows.push(ob); - setTimeout(make_arrow, delay); - setTimeout(() => { - svg.remove(); - arrows.shift(); - }, lifetime); -} - -function update() { - for (const arrow of arrows) { - arrow.y += arrow.speed; - arrow.svg.style.bottom = arrow.y + 'px'; - } - - window.requestAnimationFrame(update); -} - -make_arrow(); -update(); diff --git a/js/validate_hero.js b/js/validate_hero.js deleted file mode 100644 index ecd5195..0000000 --- a/js/validate_hero.js +++ /dev/null @@ -1,58 +0,0 @@ - -function clear_hero_errors() -{ - let errors = document.getElementsByClassName("hero_form_error"); - let i; - for (i = 0; i < errors.length; i++) - { - errors[i].hidden = true; - } -} -function validate_hero_login_form() -{ - let username=document.forms["hero_form"]["username"].value; - let flag=true; - clear_hero_errors(); - - if(username.length==0) - { - document.getElementById("username-length-error").hidden=false; - flag=false; - } - document.activeElement.blur(); - return flag; -} -function validate_hero_form() -{ - let username=document.forms["hero_form"]["username"].value; - let email=document.forms["hero_form"]["email"].value; - let password=document.forms["hero_form"]["password"].value; - let password2=document.forms["hero_form"]["password2"].value; - - let flag=true; - clear_hero_errors(); - - if(username.length==0) - { - document.getElementById("username-length-error").hidden=false; - flag=false; - } - if(!email.match(/\S+@\S+/)) - { - document.getElementById("email-error").hidden=false; - flag=false; - } - if(password.length==0) - { - document.getElementById("password-length-error").hidden=false; - flag=false; - } - if(password !== password2) - { - document.getElementById("password-match-error").hidden=false; - flag=false; - } - document.activeElement.blur(); - return flag; - -} diff --git a/loggedin.php b/loggedin.php new file mode 100644 index 0000000..884f4b9 --- /dev/null +++ b/loggedin.php @@ -0,0 +1,6 @@ +<div> + ALALALLALALLAl +</div> + + + diff --git a/login.html b/login.html deleted file mode 100644 index 525358f..0000000 --- a/login.html +++ /dev/null @@ -1,55 +0,0 @@ -<!DOCTYPE html> -<html> - <head> - <meta charset="utf-8"> - <title>shady file upload</title> - <link rel="stylesheet" type="text/css" href="css/style.css"> - </head> - - <body> - <div class="overlay" style="height: 100%;"> - <div class="vert2"> - <div id="header"> - <p class="logo">shady_file_upload</p> - </div> - - <div id="page"> - <div id="hero" class="overlay"> - <div id="arrows"> - <img src="svg/arrow.svg" id="protoarrow" style="display: none"> - </div> - - <div class="vcenter"> - <p>file upload service</p> - <p class="big">that <span class="blue">just about works</span></p> - <p>most of the time</p> - </div> - </div> - - <div class="vcenter"> - <form name="hero_form" action="/php/login.php" method="post" onsubmit="return validate_hero_login_form()"> - <h2>Login</h2> - <div class="content"> - <p>Username</p> - <input type="text" id="username" name="username"> - <p id="username-length-error" class="hero_form_error" hidden>Please enter a username</p> - <p>Password</p> - <input type="password" id="password" name="password"> - <input type="submit" value="Login"> - <p style="font-size: 1.1em;">Already have an account? <a href="index.html">Sign up</a> - </div> - </form> - </div> - - - </div> - </div> - - <img src="svg/bottom.svg" class="bgbottom"> - </div> - - <script src="js/arrows.js"></script> - <script src="js/validate_hero.js"></script> - - </body> - <html> diff --git a/loginregister.js b/loginregister.js new file mode 100644 index 0000000..cb87444 --- /dev/null +++ b/loginregister.js @@ -0,0 +1,101 @@ +arrows = []; + +const minSpeed = 3; +const maxSpeed = 8; +const delay = 1500; +const lifetime = 20000; + +function make_arrow() { + const svg = document.getElementById("protoarrow").cloneNode(); + svg.style.left = Math.random() * 100 + '%'; + svg.style.display = 'block'; + document.getElementById('arrows').append(svg); + const ob = { + y: -800, + svg: svg, + speed: Math.random() * (maxSpeed - minSpeed) + minSpeed + }; + arrows.push(ob); + setTimeout(make_arrow, delay); + setTimeout(() => { + svg.remove(); + arrows.shift(); + }, lifetime); +} + +function update() { + for (const arrow of arrows) { + arrow.y += arrow.speed; + arrow.svg.style.bottom = arrow.y + 'px'; + } + + window.requestAnimationFrame(update); +} + +make_arrow(); +update(); + + + + +function clear_hero_errors() +{ + let errors = document.getElementsByClassName("hero_form_error"); + for (let i = 0; i < errors.length; i++) + { + errors[i].hidden = true; + } +} +function validate_hero_login_form() +{ + let username=document.forms["login_form"]["username"].value; + let flag=true; + clear_hero_errors(); + + if(username.length==0) + { + document.getElementById("username-length-error").hidden=false; + flag=false; + } + document.activeElement.blur(); + return flag; +} +function validate_hero_form() +{ + let username=document.forms["register_form"]["username"].value; + let email=document.forms["register_form"]["email"].value; + let password=document.forms["register_form"]["password"].value; + let password2=document.forms["register_form"]["password2"].value; + + let flag=true; + clear_hero_errors(); + + if(username.length==0) + { + document.getElementById("username-length-error").hidden=false; + flag=false; + } + if(!email.match(/\S+@\S+/)) + { + document.getElementById("email-error").hidden=false; + flag=false; + } + if(password.length==0) + { + document.getElementById("password-length-error").hidden=false; + flag=false; + } + if(password !== password2) + { + document.getElementById("password-match-error").hidden=false; + flag=false; + } + document.activeElement.blur(); + return flag; + +} + +function showLogin(l) { + document.getElementById("loginform").style.display = l ? "flex" : "none"; + document.getElementById("signupform").style.display = l ? "none" : "flex"; +} diff --git a/loginregister.php b/loginregister.php new file mode 100644 index 0000000..8068b35 --- /dev/null +++ b/loginregister.php @@ -0,0 +1,53 @@ +<div id="hero" class="overlay"> + <div id="arrows"> + <img src="svg/arrow.svg" id="protoarrow" style="display: none"> + </div> + + <div class="vcenter"> + <p>file upload service</p> + <p class="big">that <span class="blue">just about works</span></p> + <p>most of the time</p> + </div> +</div> + +<div class="vcenter" id="signupform"> + <form name="register_form" action="/php/register.php" method="post" onsubmit="return validate_hero_form()"> + <h2>Get started</h2> + <div class="content"> + <p>Username</p> + <input type="text" id="username" name="username"> + <p id="username-length-error" class="hero_form_error" hidden>Please specify a username</p> + + <p>Email address</p> + <input type="text" id="email" name="email"> + <p id="email-error" class="hero_form_error" hidden>Invalid email address</p> + + <p>Password</p> + <input type="password" id="password" name="password"> + <p id="password-length-error" class="hero_form_error" hidden>Please provide a password</p> + + <p>Repeat Password</p> + <input type="password" id="password2" name="password2"> + <p id="password-match-error" class="hero_form_error" hidden>Passwords didn't match</p> + <input type="submit" value="Sign up"> + <p style="font-size: 1.1em;">Already have an account? <a href="#" onclick="showLogin(true)">Log in</a> + </div> + </form> +</div> + +<div class="vcenter" id="loginform"> + <form name="login_form" action="/php/login.php" method="post" onsubmit="return validate_hero_login_form()"> + <h2>Login</h2> + <div class="content"> + <p>Username</p> + <input type="text" id="username" name="username"> + <p id="username-length-error" class="hero_form_error" hidden>Please enter a username</p> + <p>Password</p> + <input type="password" id="password" name="password"> + <input type="submit" value="Login"> + <p style="font-size: 1.1em;">Don't have an account? <a href="#" onclick="showLogin(false)">Sign up</a> + </div> + </form> +</div> + +<script src="loginregister.js"></script> diff --git a/php/configuration.php b/php/configuration.php index 6b87508..89efb2a 100644 --- a/php/configuration.php +++ b/php/configuration.php @@ -3,15 +3,21 @@ $domain_name="localhost"; -$database_name="adam"; -$database_username="adam"; -$database_password="asdfd"; -$database_location="127.0.0.1"; - +if (file_exists("/home/alex")) { + $database_name="alex"; + $database_username="alex"; + $database_password="lol"; + $database_location="127.0.0.1"; +} +else { + $database_name="adam"; + $database_username="adam"; + $database_password="asdfd"; + $database_location="127.0.0.1"; +} $password_hash_algo=PASSWORD_BCRYPT; - $has_email_verification=false; ?> diff --git a/php/database.php b/php/database.php index ef2b825..f472cbf 100644 --- a/php/database.php +++ b/php/database.php @@ -16,14 +16,8 @@ require_once "misc.php"; global $database_username; global $database_password; global $database_location; - try - { + $this->pdo=new PDO("mysql:dbname={$database_name};host={$database_location}",$database_username,$database_password); - }catch(PDOException $e) - { - error_log("Could not get database {$database_name} from {$database_location}, {$e} "); - die("The cow bought the farm"); - } } /*returns false if this isn't a user, otherwise returns the user*/ diff --git a/php/login.php b/php/login.php index e6d44dc..536a5bf 100644 --- a/php/login.php +++ b/php/login.php @@ -3,6 +3,8 @@ require_once "user.php"; require_once "database.php"; require_once "misc.php"; +session_start(); + $username=$_POST["username"]; $password=$_POST["password"]; /*server side verification*/ @@ -18,8 +20,7 @@ if(!$user) die("Password or username is incorrect"); } -echo "Username: {$user->username}\n"; -echo "Email: {$user->email_address}"; - +$_SESSION['username'] = $user->username; +header('Location: /'); ?> diff --git a/php/logout.php b/php/logout.php new file mode 100644 index 0000000..9a4cdd7 --- /dev/null +++ b/php/logout.php @@ -0,0 +1,10 @@ +<?php +// TODO +// This is dangerous and stupid +// Right now every webpage can redirect any of its users to http://shady.upload/logout +// which will log the user out of our webpage + +session_start(); +unset($_SESSION['username']); +header('Location: /'); +?> diff --git a/php/misc.php b/php/misc.php index 3ab0277..69cd654 100644 --- a/php/misc.php +++ b/php/misc.php @@ -1,11 +1,6 @@ <?php require_once "user.php"; -function validate_credentials(string $username,string $email,string $password,string $password2) : bool -{ - return true; -} - function generate_email_verification_link() { /*TODO*/ diff --git a/php/register.php b/php/register.php index b6b164c..1d31a91 100644 --- a/php/register.php +++ b/php/register.php @@ -8,6 +8,13 @@ $password=$_POST["password"]; $password2=$_POST["password2"]; $email=$_POST["email"]; + +function validate_credentials(string $username,string $email,string $password,string $password2) : bool +{ + return true; +} + + /*check if we are given shady credentials*/ if(!validate_credentials($username,$email,$password,$password2)) { @@ -24,4 +31,8 @@ if($database->register_user($username,$password,$email)) echo "didn't register"; } + +$_SESSION['username'] = $username; +header('Location: /'); + ?> |