bug fixes and qol improvements

src/main.rs

@@ -20,12 +20,6 @@ use crate::sql::Test;
 fn test() -> String {
     sql::create_database()
         .expect("couldn't create database");
-
-    sql::create_user("arlo", "passwod123")
-        .expect("couldn't create user");
-    
-    sql::create_user("arlo","password123")
-        .expect("couldn't create user");
     String::from("Hello World!")
 }
 

src/sql.rs

@@ -168,8 +168,6 @@ pub fn get_user_tests(
         WHERE user_id=:user_id",
     )?;
 
-    let mut user_id: u32 = 0;
-
     let test_iter = statement
         .query_map(&[(":user_id", &user_id.to_string())], |row| {
             Ok( Test {

website/api/api.js

@@ -211,6 +211,20 @@ class API {
 
     logout() {
         user = new User();
+        user.username = "no one";
+        user.password = "none";
+        user.userId = 0;
+        user.tests = [];
         localStorage.clear();
     }
+
+    getUserTests() {
+        let xhr = new XMLHttpRequest();
+        let userId = Number(user.userId);
+        xhr.open('GET', `${this.url}get_user_tests/${userId}/`);
+        xhr.send();
+        xhr.onload = () => {
+            user.tests = JSON.parse(xhr.response);
+        };
+    }
 }

website/api/user.js

@@ -3,5 +3,6 @@ class User {
         this.username = "not logged in";
         this.password = "there";
         this.userId = 0;
+        this.tests;
     }
 }

website/assets/favicon/about.txt

@@ -0,0 +1,6 @@
+This favicon was generated using the following font:
+
+- Font Title: Roboto
+- Font Author: Copyright 2011 Google Inc. All Rights Reserved.
+- Font Source: http://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmSU5vAx05IsDqlA.ttf
+- Font License: Apache License, version 2.0 (http://www.apache.org/licenses/LICENSE-2.0.html))

website/assets/favicon/site.webmanifest

@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

website/index.html

@@ -6,6 +6,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Document</title>
 
+    <!-- Favicon Files -->
+    <link rel="apple-touch-icon" sizes="180x180" href="./assets/favicon/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="./assets/favicon/favicon-16x16.png">
+    <link rel="manifest" href="./assets/favicon/site.webmanifest">
+
     <!-- Main Script Files -->
     <script src="./lib/p5.js"></script>
     <script src="./index.js" type="text/javascript"></script>
@@ -24,6 +30,7 @@
     <script src="./screens/endscreen.js"></script>
     <script src="./screens/signUpScreen.js"></script>
     <script src="./screens/loginscreen.js"></script>
+    <script src="./screens/profilescreen.js"></script>
 
     <!-- API Script Files -->
     <script src="./api/api.js"></script>

website/index.js

@@ -1,5 +1,9 @@
 let canvas, api, screenManager, user;
 
+function preload() {
+    roboto = loadFont('./assets/fonts/RobotoMono-Medium.ttf');
+} 
+
 function setup() {
     // Creating the canvas
     canvas = new Canvas();
@@ -15,6 +19,7 @@ function setup() {
 
     // will log the user in if there details are in local storage
     api.login();
+    textFont(roboto);
 }
 
 // this function is called once per frame and draws all other elements

website/screens/endscreen.js

@@ -1,6 +1,11 @@
 class EndScreen {
     constructor() {
-        screenManager.textbox = new Textbox(0,0,0,0,0,false,"#000", false, "#000", "#000");
+        this.buttons = [
+            new Button(0,0,100,30,0,true,"#fff",false,"#000","#000","Sign Up"),
+            new Button(110,0,100,30,0,true,"#fff",false,"#000","#000","Login"),
+            new Button(220,0,100,30,0,true,"#fff",false,"#000","#000","Logout"),
+            new Button(330,0,100,30,0,true,"#fff",false,"#000","#000","Profile")
+        ]
     }
     
     draw() {
@@ -9,6 +14,22 @@ class EndScreen {
         textAlign(CENTER, CENTER);
         fill(0);
         text("Test Complete\nPress enter to start another test", 0, 0, windowWidth - 100, windowHeight - 100);
+        this.buttons[0].draw();
+        this.buttons[1].draw();
+        this.buttons[2].draw();
+        this.buttons[3].draw();
+        this.buttons[4].draw();
+        if (this.buttons[0].isPressed()) {
+            screenManager.setScreen(new SignUpScreen());
+        } else if (this.buttons[1].isPressed()) {
+            screenManager.setScreen(new LoginScreen());
+        } else if (this.buttons[2].isPressed()) {
+            api.logout();
+        } else if (this.buttons[3].isPressed()) {
+            screenManager.setScreen(new ProfileScreen());
+        } else if (this.buttons[4].isPressed()) {
+            screenManager.setScreen(new TestScreen())
+        }
     }
 
     letterTyped() {

website/screens/loginscreen.js

@@ -52,6 +52,12 @@ class LoginScreen {
                 false,"#000",
                 "#00ff00","Login"
             ),
+
+            new Button(0,0,100,30,0,true,"#fff",false,"#000","#000","Sign Up"),
+            new Button(110,0,100,30,0,true,"#fff",false,"#000","#000","Login"),
+            new Button(220,0,100,30,0,true,"#fff",false,"#000","#000","Logout"),
+            new Button(330,0,100,30,0,true,"#fff",false,"#000","#000","Profile"),
+            new Button(330,0,100,30,0,true,"#fff",false,"#000","#000","Test"),
         ]
 
         this.activeTextBox = 0 
@@ -86,6 +92,23 @@ class LoginScreen {
             )
             screenManager.setScreen(new StartScreen());
         }
+
+        this.buttons[3].draw();
+        this.buttons[4].draw();
+        this.buttons[5].draw();
+        this.buttons[6].draw();
+        this.buttons[7].draw();
+        if (this.buttons[3].isPressed()) {
+            screenManager.setScreen(new SignUpScreen());
+        } else if (this.buttons[4].isPressed()) {
+            screenManager.setScreen(new LoginScreen());
+        } else if (this.buttons[5].isPressed()) {
+            api.logout();
+        } else if (this.buttons[6].isPressed()) {
+            screenManager.setScreen(new ProfileScreen());
+        } else if (this.buttons[7].isPressed()) {
+            screenManager.setScreen(new TestScreen())
+        }
     }
 
     /**

website/screens/profilescreen.js

@@ -0,0 +1,46 @@
+class ProfileScreen {
+    constructor() {
+        this.buttons = [
+            new Button(0,0,100,30,0,true,"#fff",false,"#000","#000","Sign Up"),
+            new Button(110,0,100,30,0,true,"#fff",false,"#000","#000","Login"),
+            new Button(220,0,100,30,0,true,"#fff",false,"#000","#000","Logout"),
+            new Button(330,0,100,30,0,true,"#fff",false,"#000","#000","Profile"),
+            new Button(440,0,100,30,0,true,"#fff",false,"#000","#000","Test"),
+        ];
+        api.getUserTests();
+    }
+
+    draw() {
+        background("#eeeee4");
+        textSize(100);
+        textAlign(CENTER, CENTER);
+        fill("#000");
+        text("Profile", 0, 100, windowWidth - 100, 120);
+        this.buttons[0].draw();
+        this.buttons[1].draw();
+        this.buttons[2].draw();
+        this.buttons[3].draw();
+        this.buttons[4].draw();
+        if (this.buttons[0].isPressed()) {
+            screenManager.setScreen(new SignUpScreen());
+        } else if (this.buttons[1].isPressed()) {
+            screenManager.setScreen(new LoginScreen());
+        } else if (this.buttons[2].isPressed()) {
+            api.logout();
+        } else if (this.buttons[3].isPressed()) {
+            screenManager.setScreen(new ProfileScreen());
+        } else if (this.buttons[4].isPressed()) {
+            screenManager.setScreen(new TestScreen())
+        }
+
+        textSize(20);
+        fill("#000");
+        if (user.tests != undefined) {
+            for (let i = 0; i < user.tests.length; i++) {
+                text(`Tests ${i+1}: ${user.tests[i].wpm}wpm | Type: ${user.tests[i].test_type} | Time: ${user.tests[i].test_time} | Characters Typed: ${user.tests[i].test_length}`, 0, i*30+300, windowWidth, 30);
+            }
+        }
+        fill("#000");
+        text(`Logged in as ${user.username}`, windowWidth-100, 15);
+    }
+}

website/screens/signUpScreen.js

@@ -52,6 +52,11 @@ class SignUpScreen {
                 false,"#000",
                 "#00ff00","Sign Up"
             ),
+            new Button(0,0,100,30,0,true,"#fff",false,"#000","#000","Sign Up"),
+            new Button(110,0,100,30,0,true,"#fff",false,"#000","#000","Login"),
+            new Button(220,0,100,30,0,true,"#fff",false,"#000","#000","Logout"),
+            new Button(330,0,100,30,0,true,"#fff",false,"#000","#000","Profile"),
+            new Button(330,0,100,30,0,true,"#fff",false,"#000","#000","Test"),
         ]
 
         this.activeTextBox = 0 
@@ -72,6 +77,7 @@ class SignUpScreen {
             this.textboxes[i].draw();
         }
 
+        fill("#000");
         text("Username", 110, 175);
         text("Password", 110, 325);
 
@@ -86,6 +92,23 @@ class SignUpScreen {
             )
             screenManager.setScreen(new StartScreen());
         }
+
+        this.buttons[3].draw();
+        this.buttons[4].draw();
+        this.buttons[5].draw();
+        this.buttons[6].draw();
+        this.buttons[7].draw();
+        if (this.buttons[3].isPressed()) {
+            screenManager.setScreen(new SignUpScreen());
+        } else if (this.buttons[4].isPressed()) {
+            screenManager.setScreen(new LoginScreen());
+        } else if (this.buttons[5].isPressed()) {
+            api.logout();
+        } else if (this.buttons[6].isPressed()) {
+            screenManager.setScreen(new ProfileScreen());
+        } else if (this.buttons[7].isPressed()) {
+            screenManager.setScreen(new TestScreen())
+        }
     }
 
     /**

website/screens/startscreen.js

@@ -4,6 +4,7 @@ class StartScreen {
             new Button(0,0,100,30,0,true,"#fff",false,"#000","#000","Sign Up"),
             new Button(110,0,100,30,0,true,"#fff",false,"#000","#000","Login"),
             new Button(220,0,100,30,0,true,"#fff",false,"#000","#000","Logout"),
+            new Button(330,0,100,30,0,true,"#fff",false,"#000","#000","Profile")
         ]
     }
     
@@ -16,12 +17,15 @@ class StartScreen {
         this.buttons[0].draw();
         this.buttons[1].draw();
         this.buttons[2].draw();
+        this.buttons[3].draw();
         if (this.buttons[0].isPressed()) {
             screenManager.setScreen(new SignUpScreen());
         } else if (this.buttons[1].isPressed()) {
             screenManager.setScreen(new LoginScreen());
         } else if (this.buttons[2].isPressed()) {
             api.logout();
+        } else if (this.buttons[3].isPressed()) {
+            screenManager.setScreen(new ProfileScreen());
         }
         fill("#000");
         text(`${user.username}`, windowWidth-100, 15);

website/ui_elements/textbox.js

@@ -183,8 +183,6 @@ class Textbox {
         fill(this.textColor);
         textSize(23);
         textAlign(LEFT);
-        // font needs to be monospaced for outputting text to the screen like I do
-        textFont('monospace');
         
         // these variables allow me to use the values of x and y while updating them
         let i = this.x;