pfp test

.gitignore

@@ -1 +1,2 @@
 test_*.php
+/docs/pfp

docs/css/main.css

@@ -13,6 +13,58 @@
     font-family: var(--font) !important;
 }
 
+.banner,
+body {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    overflow-x: hidden;
+    margin-top: 0
+}
+
+.banner {
+    justify-content: center;
+    margin-bottom: calc(-1*var(--elem-height))
+}
+
+.banner-background,
+.banner-content {
+    height: var(--elem-height);
+    overflow-y: auto
+}
+
+.banner-background {
+    border-radius: var(--border-radius);
+    background-color: var(--gray);
+    opacity: 30%;
+    object-fit: cover
+}
+
+.banner-content {
+    margin-left: 10px;
+    margin-right: 10px;
+    position: relative;
+    top: calc(-1*var(--elem-height))
+}
+
+.banner,
+.banner-background,
+.content {
+    width: var(--elem-width)
+}
+
+.avatar {
+    display: flex;
+    justify-content: space-between;
+    width: var(--elem-width);
+    align-items: center;
+}
+
+.avatar-img {
+    width: 50px;
+    height: 50px;
+    margin-right: 15px
+}
 
 .form {
     width: calc(var(--elem-width) - 1rem);
@@ -42,6 +94,54 @@
     grid-column: span 2;
 }
 
+.form-button {
+    font-weight: 700;
+    display: inline-block;
+    background: var(--primary-dark);
+    border-color: var(--primary-light)
+}
+
+.header {
+    z-index: 5;
+    position: sticky;
+    top: 0;
+    display: flex;
+    background: var(--gray);
+    color: var(--white);
+    padding: 10px;
+    margin-bottom: 10px;
+    align-items: center;
+    width: calc(100vw - 20px)
+}
+
+.header-link,
+.link {
+    font-weight: 700;
+    color: var(--white)
+}
+
+.header-link {
+    text-decoration: none;
+    padding-left: .5em;
+    margin-left: .5em;
+    border-left: solid var(--white) 2px;
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 1.5em;
+}
+
+.header-img {
+    border-left: none;
+    margin-left: 0;
+    padding-left: 0;
+    height: 1.5em;
+    width: 1.5em;
+    object-fit: cover;
+}
+
 @media (max-width: 800px) {
     .form {
         grid-template-columns: 1fr;
@@ -50,18 +150,3 @@
         grid-column: span 1;
     }
 }
-
-.form-button {
-    font-weight: 700;
-    display: inline-block;
-    background: var(--primary-dark);
-    border-color: var(--primary-light)
-}
-
-body {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    overflow-x: hidden;
-    margin-top: 0
-}

docs/img/newlogo.svg

@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="217.18312"
+   height="217.18312"
+   viewBox="0 0 217.18312 217.18313"
+   version="1.1"
+   id="svg1"
+   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
+   sodipodi:docname="newlogo.svg"
+   inkscape:export-filename="logo.png"
+   inkscape:export-xdpi="452.63"
+   inkscape:export-ydpi="452.63"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#000000"
+     bordercolor="#ffffff"
+     borderopacity="0.24705882"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     inkscape:zoom="1.4142136"
+     inkscape:cx="111.36932"
+     inkscape:cy="86.267027"
+     inkscape:window-width="1918"
+     inkscape:window-height="1057"
+     inkscape:window-x="0"
+     inkscape:window-y="21"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     showguides="true" />
+  <defs
+     id="defs1" />
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(47.661312,-32.274754)">
+    <rect
+       style="fill:#e64e4e;stroke:#ffffff;stroke-width:10.0000002;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;fill-opacity:1"
+       id="rect6"
+       width="202.18312"
+       height="202.18312"
+       x="-40.161312"
+       y="39.774754" />
+    <path
+       style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 95.41834,172.96787 C 52.950011,184.57014 61.675175,208.21794 47.619183,226.50547 39.960599,170.81375 24.70647,117.2922 41.869653,54.508552"
+       id="path3"
+       sodipodi:nodetypes="ccc" />
+    <path
+       style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 49.769482,96.207585 76.575411,139.41867"
+       id="path4" />
+    <path
+       style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="m 42.67729,54.690476 c 24.493537,0.08794 44.145212,7.169676 51.74105,31.665401 -13.264494,20.217913 -26.058274,46.432533 -54.870225,52.830483 0,0 20.052656,18.63707 29.815142,23.58688 9.762486,4.94981 26.660726,7.35585 26.660726,7.35585"
+       id="path1"
+       sodipodi:nodetypes="ccczc" />
+    <path
+       style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 77.76086,85.256015 96.081508,116.19976"
+       id="path2" />
+  </g>
+</svg>

docs/login.php

@@ -13,7 +13,7 @@
         $user = $_POST['user'];
         $pass = $_POST['pass'];
 
-        $stmt = $db->prepare("SELECT * FROM auth WHERE UPPER(username) LIKE UPPER(?)");
+        $stmt = $db->prepare("SELECT * FROM main.auth WHERE UPPER(username) LIKE UPPER(?)");
         $stmt->execute([$user]);
         
         $result = $stmt->fetch(PDO::FETCH_ASSOC);
@@ -26,7 +26,7 @@
         
         $token = bin2hex(random_bytes(32));
         
-        $stmt = $db->prepare("INSERT INTO token (username, token) VALUES (?, ?)");
+        $stmt = $db->prepare("INSERT INTO main.token (username, token) VALUES (?, ?)");
         $stmt->execute([$user,$token]);
     
         setcookie("token", $token, time()+3600*24);
@@ -39,7 +39,7 @@
         
     $form_message = post_handler();
     
-    form("Log in", $form_message, array(
+    form("Log in (<a class='link' target='_blank' href='/register.php'>Register?</a>)", $form_message, array(
         array('key' => 'Username', 'type' => 'text', 'name' => 'user', 'default' => ''),
         array('key' => 'Password', 'type' => 'password', 'name' => 'pass', 'default' => '')
     ));

docs/register.php

@@ -28,7 +28,7 @@
             return 'Username is too long or short.';
         }
         
-        $stmt = $db->prepare("SELECT username FROM auth WHERE UPPER(username) LIKE UPPER(?)");
+        $stmt = $db->prepare("SELECT username FROM main.auth WHERE UPPER(username) LIKE UPPER(?)");
         $stmt->execute([$user]);
         
         $result = $stmt->fetch(PDO::FETCH_ASSOC);
@@ -37,7 +37,7 @@
         
         $hashed = password_hash($pass, PASSWORD_DEFAULT);
         
-        $stmt = $db->prepare("INSERT INTO auth (username, password) VALUES (?, ?)");
+        $stmt = $db->prepare("INSERT INTO main.auth (username, password) VALUES (?, ?)");
         $stmt->execute([$user,$hashed]);
     
         header("Location: /");

docs/user.php

@@ -0,0 +1,123 @@
+<?php
+    require("../libs/page.php");
+    require("../libs/form.php");
+    page_header();
+    
+    // this is a mess
+    function get_handler() {
+        global $db;
+        global $username;
+        global $user;
+        global $bio;
+        global $followers;
+        global $following;
+        
+        // there is 100% a better way to do this but i need to test
+        if (!array_key_exists('id',$_GET)) {
+            die();   
+        }
+        
+        $user = $_GET['id'];
+                
+        $type = $_GET['type'];
+        
+        if (array_key_exists('type',$_GET)) {
+            if ($type == 'follow') {
+                follow();
+            } else if ($type == 'settings') {
+                settings();
+            }
+        }
+        
+        $stmt = $db->prepare("SELECT * FROM main.user WHERE UPPER(username) LIKE UPPER(?)"); //weirdly, this requires a schema name
+        $stmt->execute([$user]);
+        
+        $result = $stmt->fetch(PDO::FETCH_ASSOC);
+        
+        if (!$result && $user != $username) {
+            die();
+        }
+        
+        $bio = isset($result) ? $result['bio'] : 'This user has not set a bio.';
+                
+        $stmt = $db->prepare("SELECT * FROM follow WHERE target = ?");
+        $stmt->execute([$user]);
+        
+        $following = $stmt->fetchAll(PDO::FETCH_DEFAULT);
+        
+        $stmt = $db->prepare("SELECT * FROM follow WHERE username = ?");
+        $stmt->execute([$user]);
+        
+        $followers = $stmt->fetchAll(PDO::FETCH_DEFAULT);
+        
+    }
+    
+    function follow() {
+        global $db;
+        global $username;
+        global $user;
+        
+        $stmt = $db->prepare("SELECT * FROM main.follow WHERE username = ? AND target = ?"); 
+        $stmt->execute([$user,$username]);
+        
+        $result = $stmt->fetch(PDO::FETCH_ASSOC);
+        
+        if (is_null($username)) return;
+        
+        if ($result) {
+            $stmt = $db->prepare("DELETE FROM main.follow WHERE username = ? AND target = ?"); 
+            $stmt->execute([$user,$username]);
+        } else {
+            $stmt = $db->prepare("INSERT INTO main.follow (username,target) VALUES (?,?)");
+            $stmt->execute([$user,$username]);
+        }
+    }
+    function settings() {
+        global $db;
+        global $username;
+        global $user;
+        
+        if (is_null($username)) return;
+        
+        $stmt = $db->prepare("DELETE FROM main.user WHERE username = ?"); 
+        $stmt->execute([$username]);
+        
+        $stmt = $db->prepare("INSERT INTO main.user (username,bio) VALUES (?,?)"); 
+        $stmt->execute([$username,$_POST['desc']]);
+        
+        move_uploaded_file($_FILES['avatar']['tmp_name'], $_SERVER["DOCUMENT_ROOT"] . '/../docs/pfp/' . $username . '.png');
+    }
+    
+    get_handler();
+?>
+<form class="banner" enctype="multipart/form-data" method="POST" action="/user.php?id=<?php echo $user ?>&type=follow">
+    <img class="banner-background" src="/pfp/<?php echo $username ?>.png">
+    <div class="banner-content">
+        <div class="form-message"></div>
+        <div class="avatar">
+            <img src="/pfp/<?php echo $username ?>.png" class="avatar-img">
+            <b>@<?php echo $username ?></b>
+            <input class="form-button" type="submit" value="Follow">
+        </div>
+        
+        <div class="avatar">
+            <div></div>
+            <b><?php echo count($followers) ?> followers</b>
+            <b><?php echo count($following) ?> following</b>
+            <div></div>
+        </div>
+        <input name="target" hidden="" value="<?php echo $username ?>">
+    
+        <pre><?php echo htmlspecialchars($bio) ?></pre>
+    </div>
+</form>
+<?php
+    if ($user == $username) {
+        form("Your Settings", $form_message, array(
+            array('key' => 'Bio', 'type' => 'textarea', 'name' => 'desc', 'default' => $bio),
+            array('key' => 'Avatar', 'type' => 'file', 'name' => 'avatar', 'default' => '')
+        ),'/user.php?id=' . $user . '&type=settings');
+    }
+
+    page_footer();
+?>

libs/auth.php

@@ -6,7 +6,7 @@
 
         global $db;
 
-        $stmt = $db->prepare("SELECT * FROM token WHERE token = ?");
+        $stmt = $db->prepare("SELECT * FROM main.token WHERE token = ?");
         $stmt->execute([$token]);
         
         $result = $stmt->fetch(PDO::FETCH_ASSOC);
@@ -14,7 +14,7 @@
         
         $username = $result['username'];
         
-        $stmt = $db->prepare("SELECT * FROM auth WHERE username = ?");
+        $stmt = $db->prepare("SELECT * FROM main.auth WHERE username = ?");
         $stmt->execute([$username]);
         
         $result = $stmt->fetch(PDO::FETCH_ASSOC);

libs/form.php

@@ -1,6 +1,6 @@
 <?php
-    function form($title, $form_message, $inputs) { ?>
+    function form($title, $form_message, $inputs, $action = '') { ?>
-        <form class='form' enctype="multipart/form-data" method="POST">
+        <form class='form' enctype="multipart/form-data" method="POST" action="<?php echo $action ?>">
             <h1 class="form-heading">
                 <?php echo $title ?>
             </h1>
@@ -17,8 +17,8 @@
                         class='form-input' 
                         type="<?php echo $kv['type'] ?>"
                         name="<?php echo $kv['name'] ?>" 
-                        value="<?php echo $kv['default'] ?>"
+                        value="<?php echo ($kv['type'] == 'textarea') ? '' : $kv['default'] ?>"
-                    >
+                    ><?php echo (($kv['type'] == 'textarea') ? $kv['default'] . '</textarea>' : '') ?>
                 <?php }
             ?>
             <input class='form-button' type="Submit" name="Submit">

libs/page.php

@@ -1,6 +1,8 @@
 <?php
     require("../libs/auth.php");
-    function page_header() { ?>
+    global $username;
+    function page_header() { 
+        global $username; ?>
         <!DOCTYPE html>
         <html>
             <head>
@@ -8,6 +10,17 @@
                 <link rel="stylesheet" href="/css/main.css">
             </head>
             <body>
+            <div class="header">
+                <a href="/"><img class="header-img header-link" src="/img/newlogo.svg"></a>
+                <a href="/" class='header-link'>Home</a>
+                <?php 
+                    if (isset($username)) { ?>
+                        <a class="header-link" href="/user.php?id=<?php echo $username ?>"><?php echo $username ?></a>
+                    <?php } else { ?>
+                        <a class="header-link" href="/login.php">Login</a>
+                    <?php } 
+                ?>
+            </div>
     <?php }
     function page_footer() { ?>
             </body>

scripts/init.sql

@@ -1,2 +1,4 @@
 CREATE TABLE IF NOT EXISTS main.auth (username TEXT, password TEXT);
 CREATE TABLE IF NOT EXISTS main.token (username TEXT, token TEXT);
+CREATE TABLE IF NOT EXISTS main.user (username TEXT, bio TEXT);
+CREATE TABLE IF NOT EXISTS main.follow (username TEXT, target TEXT);