From 9f2a5641db8d98da61eb5592c12e041e37c94f53 Mon Sep 17 00:00:00 2001 From: Arlo Filley Date: Fri, 11 Nov 2022 13:04:13 +0000 Subject: [PATCH] added user logins and signups --- Rocket.toml | 4 +- src/main.rs | 8 +++- src/sql.rs | 34 ++++++++++++++ website/api/api.js | 24 +++++++++- website/api/user.js | 7 +++ website/index.html | 2 + website/index.js | 2 +- website/screens/screenmanager.js | 9 ++++ website/screens/signUpScreen.js | 80 +++++++++++++++++++++++++++----- website/screens/startscreen.js | 13 +++++- website/screens/testscreen.js | 8 +++- website/ui_elements/button.js | 4 +- website/ui_elements/textbox.js | 11 ++--- 13 files changed, 177 insertions(+), 29 deletions(-) create mode 100644 website/api/user.js diff --git a/Rocket.toml b/Rocket.toml index c255985..b00ce26 100644 --- a/Rocket.toml +++ b/Rocket.toml @@ -1,6 +1,6 @@ [default] -address = "192.168.0.131" -port = 8000 +address = "192.168.0.109" +port = 10713 workers = 4 max_blocking = 512 keep_alive = 5 diff --git a/src/main.rs b/src/main.rs index 781eb7e..72e92b9 100644 --- a/src/main.rs +++ b/src/main.rs @@ -74,10 +74,16 @@ fn create_user( ).expect("Error: Couldn't create new user"); } +#[get("/login//")] +fn login(username: &str, password: &str) -> String { + let user_id = sql::find_user(username, password).expect("error finding user_id"); + user_id.to_string() +} + #[launch] fn rocket() -> Rocket { rocket::build() .mount("/test", routes![test]) // testing only, should return "Hello world" - .mount("/api", routes![post_test, create_user]) + .mount("/api", routes![post_test, create_user, login]) .mount("/typing", FileServer::from(relative!("website"))) // hosts the fileserver } \ No newline at end of file diff --git a/src/sql.rs b/src/sql.rs index df97d7f..1b059d8 100644 --- a/src/sql.rs +++ b/src/sql.rs @@ -89,6 +89,7 @@ pub fn create_user( username: &str, password: &str ) -> Result<()> { + println!("{} {}",username, password); let connection = get_connection(); connection.execute( @@ -109,4 +110,37 @@ pub fn create_user( )?; Ok(()) +} + +#[derive(Debug)] +pub struct User { + user_id: u32, +} + +pub fn find_user( + username: &str, + password: &str +) -> Result { + let mut user_id: u32 = 0; + let connection = get_connection(); + let mut statement = connection.prepare( + "SELECT user_id + FROM users + WHERE username=:username AND password=:password", + )?; + + let iter = statement + .query_map( + &[(":username", username), (":password", password)], |row| { + Ok( User { + user_id: row.get(0)? + }) + } + )?; + + for i in iter { + user_id = i.unwrap().user_id; + } + + Ok(user_id) } \ No newline at end of file diff --git a/website/api/api.js b/website/api/api.js index e5ece60..cbb30d9 100644 --- a/website/api/api.js +++ b/website/api/api.js @@ -1,7 +1,7 @@ class API { constructor() { - this.url = "http://192.168.0.131:8000/api/"; + this.url = "http://arlofilley.com/api/"; // this is the url of the server // this may have to change later on } @@ -169,6 +169,7 @@ class API { username, password ) { + console.log(username, password); const user = { username: username, password: password @@ -184,4 +185,25 @@ class API { JSON.stringify(user) ); } + + login(pUsername, pPassword) { + if (localStorage.getItem("userId") === null) { + let xhr = new XMLHttpRequest(); + xhr.open('GET', `${this.url}/login/${pUsername}/${pPassword}`); + xhr.send(); + xhr.onload = () => { + user.userId = Number(xhr.response); + if (user.userId > 0) { + user.username = pUsername + localStorage.setItem("userId", user.userId); + localStorage.setItem("username", pUsername); + localStorage.setItem("password", pPassword); + } + + }; + } else { + this.userId = localStorage.getItem("userId"); + this.username = localStorage.getItem("username"); + } + } } \ No newline at end of file diff --git a/website/api/user.js b/website/api/user.js new file mode 100644 index 0000000..f0870da --- /dev/null +++ b/website/api/user.js @@ -0,0 +1,7 @@ +class User { + constructor() { + this.username; + this.password; + this.userId; + } +} \ No newline at end of file diff --git a/website/index.html b/website/index.html index 58f4341..78bf674 100644 --- a/website/index.html +++ b/website/index.html @@ -22,9 +22,11 @@ + + diff --git a/website/index.js b/website/index.js index 1780d1b..ee14eae 100644 --- a/website/index.js +++ b/website/index.js @@ -21,7 +21,7 @@ function draw() { // whenever a key is pressed this function is called function keyPressed() { - screenManager.textbox.letterTyped(key); + screenManager.letterTyped(key); } // This ensures that the canvas is always the correct size and at the center diff --git a/website/screens/screenmanager.js b/website/screens/screenmanager.js index 4c3f2eb..db87124 100644 --- a/website/screens/screenmanager.js +++ b/website/screens/screenmanager.js @@ -16,4 +16,13 @@ class ScreenManager { getScreen() { return this.screen; } + + letterTyped(key) { + let methods = Object.getOwnPropertyNames(Object.getPrototypeOf(this.screen)); + for (let i = 0; i < methods.length; i++) { + if (methods[i] === "letterTyped") { + this.screen.letterTyped(key) + } + } + } } \ No newline at end of file diff --git a/website/screens/signUpScreen.js b/website/screens/signUpScreen.js index 3da60be..2d61ec1 100644 --- a/website/screens/signUpScreen.js +++ b/website/screens/signUpScreen.js @@ -1,24 +1,61 @@ class SignUpScreen { constructor() { - textboxes = [ + this.textboxes = [ new Textbox( - 0,0, - 0,0, - true, - "#000", - false, "#000", - "#000" + 120,250, + 500,100, + 0, + true, + "#000", + false, "#000", + "#000" ), new Textbox( - 0,0, - 0,0, + 120,400, + 500,100, + 0, true, "#000", false,"000", "#000" ) ] + + this.buttons = [ + new Button( + 100,200, + 500,100, + 0, + true, + "#000", + false,"#000", + "#fff","" + ), + + new Button( + 100,350, + 500,100, + 0, + true, + "#000", + false,"#000", + "#fff","" + ), + + new Button( + 700,300, + 100,50, + 0, + true, + "#000", + false,"#000", + "#00ff00","Sign Up" + ), + ] + + this.activeTextBox = 0 + // keeps track of which textbox the user last clicked on } /** @@ -27,8 +64,27 @@ class SignUpScreen { */ draw() { background("#eeeee4"); - for (texbox in this.textboxes) { - textbox.draw(); + for (let i = 0; i < this.buttons.length; i++) { + this.buttons[i].draw(); + } + + for (let i = 0; i < this.textboxes.length; i++) { + this.textboxes[i].draw(); + } + + text("Username", 110, 175); + text("Password", 110, 325); + + if (this.buttons[0].isPressed()) { + this.activeTextBox=0; + } else if (this.buttons[1].isPressed()) { + this.activeTextBox=1; + } else if (this.buttons[2].isPressed()) { + api.createUser( + this.textboxes[0].getWords(), + this.textboxes[1].getWords() + ) + screenManager.setScreen(new StartScreen()); } } @@ -37,6 +93,6 @@ class SignUpScreen { * @param {key} key */ letterTyped(key) { - this.textboxes[0].letterTyped(); + this.textboxes[this.activeTextBox].letterTyped(key); } } \ No newline at end of file diff --git a/website/screens/startscreen.js b/website/screens/startscreen.js index 6092037..5d38130 100644 --- a/website/screens/startscreen.js +++ b/website/screens/startscreen.js @@ -1,12 +1,23 @@ class StartScreen { 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")] } draw() { background("#eeeee4"); textSize(100); textAlign(CENTER, CENTER); + fill("#000"); text("Press enter to start test", 0, 0, windowWidth - 100, windowHeight - 100); + this.buttons[0].draw(); + if (this.buttons[0].isPressed()) { + screenManager.setScreen(new SignUpScreen()); + } + } + + letterTyped(key) { + if (key === "Enter") { + screenManager.setScreen(new TestScreen()); + } } } \ No newline at end of file diff --git a/website/screens/testscreen.js b/website/screens/testscreen.js index 724a930..e730300 100644 --- a/website/screens/testscreen.js +++ b/website/screens/testscreen.js @@ -1,14 +1,18 @@ class TestScreen { constructor() { - screenManager.textbox = new Textbox(100,100,windowWidth - 100,windowHeight,0,true,"#000", false, "#000", "#000"); + this.textbox = new Textbox(100,100,windowWidth - 100,windowHeight,0,true,"#000", false, "#000", "#000"); screenManager.timer = new Timer(0,0,windowWidth,50,0,true,"#fff", true, "#000", "#666", 15, true); screenManager.timer.start(); } draw() { background("#eeeee4"); - screenManager.textbox.draw(); + this.textbox.draw(); screenManager.timer.draw(); screenManager.timer.tick(); } + + letterTyped(key) { + this.textbox.letterTyped(key); + } } \ No newline at end of file diff --git a/website/ui_elements/button.js b/website/ui_elements/button.js index 217adcb..f031aec 100644 --- a/website/ui_elements/button.js +++ b/website/ui_elements/button.js @@ -129,7 +129,6 @@ class Button { // if the mouse is within the bounds of the return that the button has been pressed if (mouseX > this.x && mouseX < this.x + this.width && mouseY > this.y && mouseY < this.y + this.height) { - console.log("button has been pressed"); return true; } return false; @@ -139,11 +138,12 @@ class Button { * This function draws the button with the label */ draw() { + textSize(20); fill(this.backgroundColor); rect(this.x, this.y, this.width, this.height); fill(this.textColor); - text(this.label, this.x, this.y, this.x + this.width, this.y + this.height); + text(this.label, this.x, this.y, this.width, this.height); // passing 4 arguments to this function means the text will wrap within this box } } \ No newline at end of file diff --git a/website/ui_elements/textbox.js b/website/ui_elements/textbox.js index dfc1e85..bae59ad 100644 --- a/website/ui_elements/textbox.js +++ b/website/ui_elements/textbox.js @@ -127,23 +127,20 @@ class Textbox { * @returns */ letterTyped(pKey) { - if (pKey === "Enter" && (screenManager.screen.constructor.name === "StartScreen" /* || screenManager.screen.constructor.name === "EndScreen" */)) { - screenManager.setScreen(new TestScreen()); - return; - } - - if (screenManager.timer.time === 0) { + if (screenManager.screen.constructor.name === "TestScreen" && screenManager.timer.time === 0) { return; } if (pKey === "Backspace" && this.letters.length > 0) { this.letters.pop(); + this.words.substring(0, this.words.length-1) return; } - for (let i = 0; i < this.allowedLetters.length; i++) { + for (let i = 0; i < this.allowedLetters.length; i++) { if (pKey.toLowerCase() === this.allowedLetters[i]) { this.letters.push(pKey); + this.words += pKey; return; } }