diff --git a/.gitignore b/.gitignore index 04c8374..29b30d4 100644 --- a/.gitignore +++ b/.gitignore @@ -3,4 +3,5 @@ Cargo.lock /database/database.sqlite /NEA_Screenshots .DS_Store -.gitignore \ No newline at end of file +.gitignore +/.database \ No newline at end of file diff --git a/Cargo.toml b/Cargo.toml index 787fc87..d76b4ae 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -5,6 +5,7 @@ edition = "2021" [dependencies] rusqlite = "0.28.0" +rand = "0.8.5" [dependencies.rocket] version = "0.5.0-rc.2" diff --git a/src/main.rs b/src/main.rs index a7e365e..bb6ca20 100644 --- a/src/main.rs +++ b/src/main.rs @@ -20,6 +20,8 @@ use rocket::{ json::Json } }; +use rand::Rng; +use std::{fs, vec}; // Imports for sql, see sql.rs for more information pub mod sql; @@ -124,6 +126,27 @@ fn leaderboard() -> Json> { Json(leaderboard) } +/// Returns an array of words as Json +/// Accessible from http://url/api/get_test +#[get("/get_test")] +fn get_test() -> Json> { + let mut word_vec: Vec<&str> = vec![]; + let words = fs::read_to_string("wordlist.txt").unwrap(); + for word in words.split('\n') { + word_vec.push(word.clone()); + } + + let mut return_list: Vec = vec![]; + + let mut rng = rand::thread_rng(); + for _i in 0..100 { + let hi: u32 = rng.gen_range(0..999); + return_list.push(word_vec[hi as usize].to_string()) + } + + Json(return_list.clone()) +} + /// The main function which builds and launches the /// webserver with all appropriate routes and fileservers #[launch] @@ -136,7 +159,7 @@ fn rocket() -> Rocket { .mount("/api", routes![ create_database, create_user, post_test, login, get_user_tests, - leaderboard + leaderboard, get_test ]) // hosts the fileserver .mount("/typing", FileServer::from(relative!("website"))) diff --git a/src/sql.rs b/src/sql.rs index ab8a2b0..d3e3a90 100644 --- a/src/sql.rs +++ b/src/sql.rs @@ -111,7 +111,6 @@ pub fn create_user( username: &str, password: &str ) -> Result<()> { - println!("{} {}",username, password); let connection = get_connection(); connection.execute( diff --git a/website/api/api.js b/website/api/api.js index 56c56ad..9e4fb55 100644 --- a/website/api/api.js +++ b/website/api/api.js @@ -81,9 +81,6 @@ class API { const userId = Number(user.userId); let test_content = screenManager.screen.textbox.getTestContent(); - console.log(test); - console.log(test_content); - let string = ""; let inaccurateLetters = 0; for (let letter = 0; letter < test.length; letter++) { @@ -218,7 +215,11 @@ class API { ); xhr.onload = () => { - this.login(username,password); + if (xhr.status === 500) { + alert("Sorry, looks like your username isn't unique"); + } else { + this.login(username,password); + } }; } @@ -255,9 +256,14 @@ class API { user.userId = 0; user.tests = []; localStorage.clear(); + this.getTest(); } getUserTests() { + if (user.userId === 0) { + user.tests = undefined; + return; + } let xhr = new XMLHttpRequest(); let userId = Number(user.userId); xhr.open('GET', `${this.url}get_user_tests/${userId}/`); @@ -278,7 +284,7 @@ class API { getTest() { let xhr = new XMLHttpRequest(); - xhr.open('GET', `https://random-word-api.herokuapp.com/word?number=100`); + xhr.open('GET', `${this.url}get_test/`); xhr.send(); xhr.onload = () => { const effectiveWidth = (windowWidth - 200) / 13; diff --git a/website/api/user.js b/website/api/user.js index 89030fc..5fc0442 100644 --- a/website/api/user.js +++ b/website/api/user.js @@ -24,5 +24,24 @@ class User { this.tests; this.lastTest; this.nextTest = `satisfy powerful pleasant bells disastrous mean kited is gusted romantic past taste immolate productive leak close show crabby awake handsails finicky betray long-term incompetent wander show manage toys convey hop constitute number send like off ice aboard well-made vast vacuous tramp seed force divergent flower porter fire untidy soggy fetch`; + + this.colorScheme = { + background: "#eeeee4", + text: "#000", + + timerBar: "#50C5B7", + timerText: "#000", + + testGood: "#0A0", + testBad: "#A00", + + buttonBG: "#000", + buttonText: "#fff", + buttonBorder: "#000", + + buttonHoverBG: "#0f0", + buttonHoverText: "#000", + buttonHoverBorder: "#000" + } } } \ No newline at end of file diff --git a/website/index.html b/website/index.html index f209821..c79a201 100644 --- a/website/index.html +++ b/website/index.html @@ -16,8 +16,8 @@ - - + + diff --git a/website/index.js b/website/index.js index 2cd074c..551e731 100644 --- a/website/index.js +++ b/website/index.js @@ -29,8 +29,8 @@ function setup() { api = new API(); screenManager = new ScreenManager(); - screenManager.setScreen(new StartScreen()); user = new User(); + screenManager.setScreen(new StartScreen()); api.login(); api.getTest(); @@ -44,6 +44,7 @@ function setup() { * sure that the correct screen is being drawn */ function draw() { + background(user.colorScheme.background); screenManager.draw(); } diff --git a/website/screens/accountScreen.js b/website/screens/accountScreen.js index 0ed987c..d26f108 100644 --- a/website/screens/accountScreen.js +++ b/website/screens/accountScreen.js @@ -22,35 +22,16 @@ class AccountScreen { new Textbox( 120, 500, 500, 100, 0, true, "#000", false, - "000", "#000", false + "#000", "#000", false, false, true ) ] this.buttons = [ - new Button( - 100, 300, 500, 100, 0, true, "#000", false, - "#000", "#fff", "", true, "#000", "#000", "#fff" - ), - - new Button( - 100, 450, 500, 100, 0, true, "#000", false, - "#000", "#fff", "", true, "#000", "#000", "#fff" - ), - - new Button( - 900, 300, 100, 50, 0, true, "#000", false, - "#000", "#00ff00", "Login" - ), - - new Button( - 900, 400, 100, 50, 0, true, "#000", false, - "#000", "#00ff00", "Sign up" - ), - - new Button( - 900, 500, 100, 50, 0, true, "#000", false, - "#000", "#00ff00", "Logout" - ), + new Button(100, 300, 500, 100, "", false, true, "#000", "#000", "#fff", "#000", "#000", "#fff"), + new Button(100, 450, 500, 100, "", false, true, "#000", "#000", "#fff", "#000", "#000", "#fff"), + new Button(900, 300, 100, 50, "Login"), + new Button(900, 400, 100, 50, "Sign up"), + new Button(900, 500, 100, 50, "Logout"), ] this.menu = new Menu(); @@ -64,9 +45,8 @@ class AccountScreen { * appropriate elements */ draw() { - background("#eeeee4"); textSize(100); - fill("#000"); + fill(user.colorScheme.text); text("Account", 300, 100); for (let i = 0; i < this.buttons.length; i++) { this.buttons[i].draw(); @@ -105,6 +85,8 @@ class AccountScreen { screenManager.setScreen(new StartScreen()); } this.menu.draw(); + fill(user.colorScheme.text); + text(`Logged in as ${user.username}`, windowWidth-150, 15); } /** diff --git a/website/screens/endscreen.js b/website/screens/endscreen.js index 18526fb..d99b244 100644 --- a/website/screens/endscreen.js +++ b/website/screens/endscreen.js @@ -17,10 +17,9 @@ class EndScreen { } draw() { - background("#eeeee4"); textSize(100); textAlign(CENTER, CENTER); - fill(0); + fill(user.colorScheme.text); text("Test Complete", 0, 0, windowWidth - 100, windowHeight / 6); textSize(30); diff --git a/website/screens/leaderboardscreen.js b/website/screens/leaderboardscreen.js index a3415b6..bd36a1b 100644 --- a/website/screens/leaderboardscreen.js +++ b/website/screens/leaderboardscreen.js @@ -15,25 +15,76 @@ class LeaderboardScreen { constructor() { this.menu = new Menu(); - api.getLeaderBoard() + api.getLeaderBoard(); + this.testButtons; + this.buttons = [ + new Button(1150, 270, 240, 120, "up"), + new Button(1150, 390, 240, 120, "down"), + ] + this.offset = 0; } draw() { - background("#eeeee4"); textSize(100); textAlign(CENTER, CENTER); - fill("#000"); + fill(user.colorScheme.text); text("Leaderboard", 0, 100, windowWidth, 120); this.menu.draw(); textSize(20); - fill("#000"); + fill(user.colorScheme.text); if (user.leaderboard != undefined) { - for (let i = 0; i < user.leaderboard.length; i++) { - text(`#${i+1}: ${user.leaderboard[i].username} : ${user.leaderboard[i].wpm}wpm`, 0, i*30+300, windowWidth, 30); + if (this.testButtons === undefined) { + this.createTestButtons(); } } - fill("#000"); - text(`Logged in as ${user.username}`, windowWidth-400, 15); + + if (this.testButtons !== undefined && this.testButtons.length > 1) { + for (let i = 0; i < this.testButtons.length; i++) { + this.testButtons[i][0].draw() + this.testButtons[i][1].draw() + this.testButtons[i][2].draw() + } + if (this.buttons[0].isPressed()) { + if (this.offset > 0) { + this.offset--; + } + + this.createTestButtons(this.offset); + } else if (this.buttons[1].isPressed()) { + if (this.offset < user.leaderboard.length - 13) { + this.offset++; + } + + this.createTestButtons(this.offset); + } + + for (let i = 0; i < this.buttons.length; i++) { + this.buttons[i].draw(); + } + } else { + fill(user.colorScheme.text); + text("Looks Like There Isn't A Leaderboard", windowWidth / 2, 300); + } + fill(user.colorScheme.text); + text(`Logged in as ${user.username}`, windowWidth-150, 15); + } + + createTestButtons(offset = 0) { + this.testButtons = [[ + new Button(400, 270, 100, 30, "ranking"), // test # button + new Button(500, 270, 400, 30, "username"), // wpm button + new Button(900, 270, 240, 30, "words per minute"), // accuracy button + ]]; + let j = 300; + for (let i = 0 + offset; i < user.leaderboard.length && i <= 12+offset; i++) { + console.log(i); + this.testButtons.push([ + new Button(400, j, 100, 30, `${i+1}`, true, true, "#000", "#000", "#fff"), // test # button + new Button(500, j, 400, 30, `${user.leaderboard[i].username}`, true, true, "#000", "#000", "#fff"), // accuracy button + new Button(900, j, 240, 30, `${user.leaderboard[i].wpm}`, true, true, "#000", "#000", "#fff"), // wpm button + ]) + j+=30; + } } } \ No newline at end of file diff --git a/website/screens/loginscreen.js b/website/screens/loginscreen.js index 396be9c..df714fd 100644 --- a/website/screens/loginscreen.js +++ b/website/screens/loginscreen.js @@ -54,7 +54,6 @@ class LoginScreen { * appropriate elements */ draw() { - background("#eeeee4"); for (let i = 0; i < this.buttons.length; i++) { this.buttons[i].draw(); } diff --git a/website/screens/profilescreen.js b/website/screens/profilescreen.js index 93a9f7e..046bf60 100644 --- a/website/screens/profilescreen.js +++ b/website/screens/profilescreen.js @@ -20,72 +20,73 @@ class ProfileScreen { api.getUserTests(); this.testButtons; this.buttons = [ - new Button(950, 270, 240, 120, 0, true, "#fff", true, "#000", "#000", "up"), - new Button(950, 390, 240, 120, 0, true, "#fff", true, "#000", "#000", "down"), + new Button(950, 270, 240, 120, "up"), + new Button(950, 390, 240, 120, "down"), ] this.offset = 0; } draw() { - background("#eeeee4"); textSize(100); textAlign(CENTER, CENTER); - fill("#000"); + fill(user.colorScheme.text); text("Profile", 0, 100, windowWidth, 120); this.menu.draw(); textSize(20); - fill("#000"); + fill(user.colorScheme.text); if (user.tests != undefined) { if (this.testButtons === undefined) { this.createTestButtons(); } } - for (let i = 0; i < this.buttons.length; i++) { - this.buttons[i].draw(); - } - - if (this.testButtons !== undefined) { + if (this.testButtons !== undefined && this.testButtons.length > 1) { for (let i = 0; i < this.testButtons.length; i++) { this.testButtons[i][0].draw() this.testButtons[i][1].draw() this.testButtons[i][2].draw() this.testButtons[i][3].draw() } - } + if (this.buttons[0].isPressed()) { + if (this.offset > 0) { + this.offset--; + } + this.createTestButtons(this.offset); + } else if (this.buttons[1].isPressed()) { + if (user.tests.length - 13 - this.offset > 0) { + this.offset++; + } + this.createTestButtons(this.offset); + } - if (this.buttons[0].isPressed()) { - if (user.tests.length < 13 + this.offset) { - this.offset--; + for (let i = 0; i < this.buttons.length; i++) { + this.buttons[i].draw(); } - this.createTestButtons(this.offset); - } else if (this.buttons[1].isPressed()) { - if (user.tests.length - 13 - this.offset > 0) { - this.offset++; - } - this.createTestButtons(this.offset); + } else { + fill(user.colorScheme.text); + text("Looks Like You Don't have any tests :(", windowWidth / 2, 300); } - fill("#000"); + fill(user.colorScheme.text); text(`Logged in as ${user.username}`, windowWidth-150, 15); } createTestButtons(offset = 0) { this.testButtons = [[ - new Button(400, 270, 100, 30, 0, true, "#fff", true, "#000", "#000", "test #"), // test # button - new Button(500, 270, 100, 30, 0, true, "#fff", true, "#000", "#000", "wpm"), // wpm button - new Button(600, 270, 100, 30, 0, true, "#fff", true, "#000", "#000", "accuracy"), // accuracy button - new Button(700, 270, 240, 30, 0, true, "#fff", true, "#000", "#000", "characters typed") + new Button(400, 270, 100, 30, "test #"), // test # button + new Button(500, 270, 100, 30, "wpm"), // wpm button + new Button(600, 270, 100, 30, "accuracy"), // accuracy button + new Button(700, 270, 240, 30, "characters typed") ]]; let j = 300; - for (let i = user.tests.length-1-offset; i >= user.tests.length-13-offset; i--) { + for (let i = user.tests.length-1-offset; i >= user.tests.length-13-offset && i >= 0; i--) { this.testButtons.push([ - new Button(400, j, 100, 30, 0, true, "#000", true, "#000", "#fff", `${i}`), // test # button - new Button(600, j, 100, 30, 0, true, "#000", true, "#000", "#fff", `${user.tests[i].accuracy}`), // accuracy button - new Button(500, j, 100, 30, 0, true, "#000", true, "#000", "#fff", `${user.tests[i].wpm}`), // wpm button - new Button(700, j, 240, 30, 0, true, "#000", true, "#000", "#fff", `${user.tests[i].test_length}`) + new Button(400, j, 100, 30, `${i+1}`, true, true , "#000", "#000", "#fff"), // test # button + new Button(500, j, 100, 30, `${user.tests[i].accuracy}`, true, true , "#000", "#000", "#fff"), // accuracy button + new Button(600, j, 100, 30, `${user.tests[i].wpm}`, true, true , "#000", "#000", "#fff"), // wpm button + new Button(700, j, 240, 30, `${user.tests[i].test_length}`, true, true , "#000", "#000", "#fff") ]) j+=30; } diff --git a/website/screens/settingsScreen.js b/website/screens/settingsScreen.js index e391f36..679ce3d 100644 --- a/website/screens/settingsScreen.js +++ b/website/screens/settingsScreen.js @@ -14,13 +14,14 @@ class settingsScreen { draw() { textAlign(CENTER, CENTER); - background("#eeeee4"); textSize(100); - fill("#000"); + fill(user.colorScheme.text); text("Test Settings", 450, 100); this.menu.draw(); this.timeMenu.draw(); + fill("#000"); + text(`Logged in as ${user.username}`, windowWidth-150, 15); } } \ No newline at end of file diff --git a/website/screens/signUpScreen.js b/website/screens/signUpScreen.js index 47fded1..95f2691 100644 --- a/website/screens/signUpScreen.js +++ b/website/screens/signUpScreen.js @@ -53,7 +53,6 @@ class SignUpScreen { * appropriate elements */ draw() { - background("#eeeee4"); for (let i = 0; i < this.buttons.length; i++) { this.buttons[i].draw(); } @@ -62,7 +61,7 @@ class SignUpScreen { this.textboxes[i].draw(); } - fill("#000"); + fill(user.colorScheme.text); text("Username", 110, 175); text("Password", 110, 325); diff --git a/website/screens/startscreen.js b/website/screens/startscreen.js index 2bcedf1..4321c1f 100644 --- a/website/screens/startscreen.js +++ b/website/screens/startscreen.js @@ -13,16 +13,15 @@ class StartScreen { } draw() { - background("#eeeee4"); textSize(100); textAlign(CENTER, CENTER); - fill("#000"); + fill(user.colorScheme.text); text("Press enter to start test", 0, 0, windowWidth - 100, windowHeight - 100); this.menu.draw(); - fill("#000"); - text(`Logged in as ${user.username}`, windowWidth-400, 15); + fill(user.colorScheme.text); + text(`Logged in as ${user.username}`, windowWidth-150, 15); } letterTyped(key) { diff --git a/website/screens/testscreen.js b/website/screens/testscreen.js index 54aa073..8a55a93 100644 --- a/website/screens/testscreen.js +++ b/website/screens/testscreen.js @@ -16,17 +16,22 @@ class TestScreen { constructor() { this.textbox = new Textbox(100,100,windowWidth - 200,windowHeight,0,true,"#000", false, "#000", "#000", true, true); this.timer = new Timer(0,0,windowWidth,50,0,true,"#fff", true, "#000", "#666", user.time, true); - this.timer.start(); + this.timerStarted = false; } draw() { - background("#eeeee4"); this.textbox.draw(); this.timer.draw(); - this.timer.tick(); + if (this.timerStarted) { + this.timer.tick(); + } } letterTyped(key) { this.textbox.letterTyped(key); + if (!this.timerStarted) { + this.timer.start(); + this.timerStarted = true; + } } } \ No newline at end of file diff --git a/website/ui_elements/button.js b/website/ui_elements/button.js index 6903226..90e05cc 100644 --- a/website/ui_elements/button.js +++ b/website/ui_elements/button.js @@ -31,13 +31,20 @@ class Button { */ constructor(pX = 100, pY = 100, pWidth = 200, pHeight = 30, - pLayer = 0, pVisible = true, - pTextColor = "#fff", - pBorder = false, pBorderColor = "#000", - pBackgroundColor = "#000", pLabel = "Default Button", - pHoverBorder = true, pHoverBorderColor = "#000", - pHoverTextColor = "#000", pHoverBackgroundColor = "#00ff00" + + pBorder = false, + pHoverBorder = true, + + pTextColor = user.colorScheme.buttonText, + pBorderColor = user.colorScheme.buttonBorder, + pBackgroundColor = user.colorScheme.buttonBG, + + pHoverTextColor = user.colorScheme.buttonHoverText, + pHoverBorderColor = user.colorScheme.buttonHoverBorder, + pHoverBackgroundColor = user.colorScheme.buttonHoverBG, + + pLayer = 0, pVisible = true, ) { this.x = pX; this.y = pY; diff --git a/website/ui_elements/menu.js b/website/ui_elements/menu.js index 3fc3776..be3a508 100644 --- a/website/ui_elements/menu.js +++ b/website/ui_elements/menu.js @@ -13,11 +13,11 @@ class Menu { constructor() { this.buttons = [ - new Button(0, 0, 100, 30, 0, true, "#fff", false, "#000", "#000", "Account"), - new Button(101, 0, 130, 30, 0, true, "#fff", false, "#000", "#000", "Test Data"), - new Button(232, 0, 140, 30, 0, true, "#fff", false, "#000", "#000", "Start Test"), - new Button(373, 0, 140, 30, 0, true, "#fff", false, "#000", "#000", "Leaderboard"), - new Button(514, 0, 180, 30, 0, true, "#fff", false, "#000", "#000", "Test Settings") + new Button(0, 0, 100, 30, "Account"), + new Button(101, 0, 130, 30, "Test Data"), + new Button(232, 0, 140, 30, "Start Test"), + new Button(373, 0, 140, 30, "Leaderboard"), + new Button(514, 0, 180, 30, "Test Settings") ] } diff --git a/website/ui_elements/textbox.js b/website/ui_elements/textbox.js index 4bcc8d1..e74c7ee 100644 --- a/website/ui_elements/textbox.js +++ b/website/ui_elements/textbox.js @@ -32,10 +32,11 @@ class Textbox { pX, pY, pWidth, pHeight, pLayer, pVisible, - pTextColor, + pTextColor = user.colorScheme.text, pBorder, pBorderColor, pBackgroundColor, - pLine, pIsTest + pLine, pIsTest, + pIsPassword = false ) { this.x = pX; this.y = pY; @@ -52,7 +53,9 @@ class Textbox { this.allowedLetters = [ 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm','n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', - 'x', 'y', 'z', '\'', '"', ',', '.', ' ' + 'x', 'y', 'z', + '1', '2', '3', '4', '5', '6', '7', '8', '9', '0', + '\'', '"', ',', '.', ' ', '!', '@', '$', '%', '^', '&', '*', '(', ')', ] this.line = pLine; @@ -65,6 +68,11 @@ class Textbox { } else { this.words = ""; } + + this.isPassword = pIsPassword; + + this.goodColor = user.colorScheme.testGood; + this.badColor = user.colorScheme.testBad; } getX() { @@ -274,12 +282,12 @@ class Textbox { for (let x = 0; x < this.testContent[this.currentLine].length; x++) { if (x < this.words[this.currentLine].length) { if (this.words[this.currentLine][x] === this.testContent[this.currentLine][x]) { - fill("#00AA00"); + fill(this.goodColor); } else { - fill("#AA0000"); + fill(this.badColor); } } else { - fill("#000"); + fill(this.textColor); } text(this.testContent[this.currentLine][x], i, j); i += 13; @@ -288,12 +296,32 @@ class Textbox { i = this.x; j += 30; - fill("#000"); + fill(this.textColor); for (let x = this.currentLine + 1; x < this.testContent.length; x++) { text(this.testContent[x], i, j); j += 30; } + } else if (this.isPassword) { + // these variables allow me to use the values of x and y while updating them + let i = this.x; + let j = this.y; + + // currently this loop just prints out every letter in the array, including any enter characters + for (let x = 0; x < this.letters.length; x++) { + if (i > this.x + this.width) i = this.x, j += 30; + if (this.letters[x] === "Enter") { + i = this.x, j+= 30; + } else { + let char = "-"; + text(char, i, j); + i += 13 + } + if (this.letters.length > 0 && x == this.letters.length-1 && this.line) { + fill(this.textColor) + rect(i, j-15, 1, 30) + } + } } else { // these variables allow me to use the values of x and y while updating them let i = this.x; @@ -309,7 +337,7 @@ class Textbox { i += 13 } if (this.letters.length > 0 && x == this.letters.length-1 && this.line) { - fill("black") + fill(this.textColor) rect(i, j-15, 1, 30) } } diff --git a/website/ui_elements/timemenu.js b/website/ui_elements/timemenu.js index 725f301..8f40682 100644 --- a/website/ui_elements/timemenu.js +++ b/website/ui_elements/timemenu.js @@ -15,10 +15,10 @@ class TimeMenu { constructor() { this.buttons = [ - new Button(100, 230, 100, 30, 0, true, "#fff", false, "#000", "#000", "15s"), - new Button(100, 260, 100, 30, 0, true, "#fff", false, "#000", "#000", "30s"), - new Button(100, 290, 100, 30, 0, true, "#fff", false, "#000", "#000", "45s"), - new Button(100, 320, 100, 30, 0, true, "#fff", false, "#000", "#000", "60s"), + new Button(100, 230, 100, 30, "15s"), + new Button(100, 260, 100, 30, "30s"), + new Button(100, 290, 100, 30, "45s"), + new Button(100, 320, 100, 30, "60s"), ]; this.topButton = this.buttons[0]; @@ -33,19 +33,19 @@ class TimeMenu { if (this.buttons[0].isPressed() && user.time != 15) { user.time = 15; - this.topButton = new Button(100, 230, 100, 30, 0, true, "#fff", false, "#000", "#000", "15s"); + this.topButton = new Button(100, 230, 100, 30, "15s"); this.dropdown = false; } else if (this.buttons[1].isPressed()) { user.time = 30; - this.topButton = new Button(100, 230, 100, 30, 0, true, "#fff", false, "#000", "#000", "30s"); + this.topButton = new Button(100, 230, 100, 30, "30s"); this.dropdown = false; } else if (this.buttons[2].isPressed()) { user.time = 45; - this.topButton = new Button(100, 230, 100, 30, 0, true, "#fff", false, "#000", "#000", "45s"); + this.topButton = new Button(100, 230, 100, 30, "45s"); this.dropdown = false; } else if (this.buttons[3].isPressed()) { user.time = 60; - this.topButton = new Button(100, 230, 100, 30, 0, true, "#fff", false, "#000", "#000", "60s"); + this.topButton = new Button(100, 230, 100, 30, "60s"); this.dropdown = false; } } else { diff --git a/website/ui_elements/timer.js b/website/ui_elements/timer.js index 637e868..e13a399 100644 --- a/website/ui_elements/timer.js +++ b/website/ui_elements/timer.js @@ -148,7 +148,7 @@ class Timer { * This method is called to start the timer */ start() { - this.startTime = frameCount; + this.startTime = millis(); // framecount is a special p5 value that counts the number of frames that have passed // I am using the amount of frames passed to calculate the time, assuming that the website is running at 60q frames // per second @@ -160,8 +160,10 @@ class Timer { * it keeps track of the amount of time passed */ tick() { - this.timeElapsed = frameCount - this.startTime; - if (this.timeElapsed == this.time * 60) this.end(); + this.timeElapsed = (millis() - this.startTime) / 1000; + if (this.timeElapsed >= this.time) { + this.end(); + }; } /** @@ -198,14 +200,13 @@ class Timer { // draws a bar that move across the screen to show the time left if (this.bar) { - fill(this.backgroundColor); - rect(this.y, this.x, windowWidth - windowWidth / (this.time * 60) * this.timeElapsed , this.height); + fill(user.colorScheme.timerBar); + rect(this.y, this.x, windowWidth - windowWidth * (this.timeElapsed / this.time), this.height); } // draws the text in the corner of the screen noStroke(); - fill(this.textColor); - let time = (this.time * 60 - this.timeElapsed) / 60 - text(Math.ceil(time), this.x + this.width / 6, this.y + this.height / 2) + fill(user.colorScheme.timerText); + text(Math.ceil(this.time - this.timeElapsed), this.x + this.width / 6, this.y + this.height / 2) } } \ No newline at end of file diff --git a/wordlist.txt b/wordlist.txt new file mode 100644 index 0000000..f10b1af --- /dev/null +++ b/wordlist.txt @@ -0,0 +1,1000 @@ +the +of +to +and +a +in +is +it +you +that +he +was +for +on +are +with +as +I +his +they +be +at +one +have +this +from +or +had +by +not +word +but +what +some +we +can +out +other +were +all +there +when +up +use +your +how +said +an +each +she +which +do +their +time +if +will +way +about +many +then +them +write +would +like +so +these +her +long +make +thing +see +him +two +has +look +more +day +could +go +come +did +number +sound +no +most +people +my +over +know +water +than +call +first +who +may +down +side +been +now +find +any +new +work +part +take +get +place +made +live +where +after +back +little +only +round +man +year +came +show +every +good +me +give +our +under +name +very +through +just +form +sentence +great +think +say +help +low +line +differ +turn +cause +much +mean +before +move +right +boy +old +too +same +tell +does +set +three +want +air +well +also +play +small +end +put +home +read +hand +port +large +spell +add +even +land +here +must +big +high +such +follow +act +why +ask +men +change +went +light +kind +off +need +house +picture +try +us +again +animal +point +mother +world +near +build +self +earth +father +head +stand +own +page +should +country +found +answer +school +grow +study +still +learn +plant +cover +food +sun +four +between +state +keep +eye +never +last +let +thought +city +tree +cross +farm +hard +start +might +story +saw +far +sea +draw +left +late +run +don't +while +press +close +night +real +life +few +north +open +seem +together +next +white +children +begin +got +walk +example +ease +paper +group +always +music +those +both +mark +often +letter +until +mile +river +car +feet +care +second +book +carry +took +science +eat +room +friend +began +idea +fish +mountain +stop +once +base +hear +horse +cut +sure +watch +color +face +wood +main +enough +plain +girl +usual +young +ready +above +ever +red +list +though +feel +talk +bird +soon +body +dog +family +direct +pose +leave +song +measure +door +product +black +short +numeral +class +wind +question +happen +complete +ship +area +half +rock +order +fire +south +problem +piece +told +knew +pass +since +top +whole +king +space +heard +best +hour +better +true +during +hundred +five +remember +step +early +hold +west +ground +interest +reach +fast +verb +sing +listen +six +table +travel +less +morning +ten +simple +several +vowel +toward +war +lay +against +pattern +slow +center +love +person +money +serve +appear +road +map +rain +rule +govern +pull +cold +notice +voice +unit +power +town +fine +certain +fly +fall +lead +cry +dark +machine +note +wait +plan +figure +star +box +noun +field +rest +correct +able +pound +done +beauty +drive +stood +contain +front +teach +week +final +gave +green +oh +quick +develop +ocean +warm +free +minute +strong +special +mind +behind +clear +tail +produce +fact +street +inch +multiply +nothing +course +stay +wheel +full +force +blue +object +decide +surface +deep +moon +island +foot +system +busy +test +record +boat +common +gold +possible +plane +stead +dry +wonder +laugh +thousand +ago +ran +check +game +shape +equate +hot +miss +brought +heat +snow +tire +bring +yes +distant +fill +east +paint +language +among +grand +ball +yet +wave +drop +heart +am +present +heavy +dance +engine +position +arm +wide +sail +material +size +vary +settle +speak +weight +general +ice +matter +circle +pair +include +divide +syllable +felt +perhaps +pick +sudden +count +square +reason +length +represent +art +subject +region +energy +hunt +probable +bed +brother +egg +ride +cell +believe +fraction +forest +sit +race +window +store +summer +train +sleep +prove +lone +leg +exercise +wall +catch +mount +wish +sky +board +joy +winter +sat +written +wild +instrument +kept +glass +grass +cow +job +edge +sign +visit +past +soft +fun +bright +gas +weather +month +million +bear +finish +happy +hope +flower +clothe +strange +gone +jump +baby +eight +village +meet +root +buy +raise +solve +metal +whether +push +seven +paragraph +third +shall +held +hair +describe +cook +floor +either +result +burn +hill +safe +cat +century +consider +type +law +bit +coast +copy +phrase +silent +tall +sand +soil +roll +temperature +finger +industry +value +fight +lie +beat +excite +natural +view +sense +ear +else +quite +broke +case +middle +kill +son +lake +moment +scale +loud +spring +observe +child +straight +consonant +nation +dictionary +milk +speed +method +organ +pay +age +section +dress +cloud +surprise +quiet +stone +tiny +climb +cool +design +poor +lot +experiment +bottom +key +iron +single +stick +flat +twenty +skin +smile +crease +hole +trade +melody +trip +office +receive +row +mouth +exact +symbol +die +least +trouble +shout +except +wrote +seed +tone +join +suggest +clean +break +lady +yard +rise +bad +blow +oil +blood +touch +grew +cent +mix +team +wire +cost +lost +brown +wear +garden +equal +sent +choose +fell +fit +flow +fair +bank +collect +save +control +decimal +gentle +woman +captain +practice +separate +difficult +doctor +please +protect +noon +whose +locate +ring +character +insect +caught +period +indicate +radio +spoke +atom +human +history +effect +electric +expect +crop +modern +element +hit +student +corner +party +supply +bone +rail +imagine +provide +agree +thus +capital +won't +chair +danger +fruit +rich +thick +soldier +process +operate +guess +necessary +sharp +wing +create +neighbor +wash +bat +rather +crowd +corn +compare +poem +string +bell +depend +meat +rub +tube +famous +dollar +stream +fear +sight +thin +triangle +planet +hurry +chief +colony +clock +mine +tie +enter +major +fresh +search +send +yellow +gun +allow +print +dead +spot +desert +suit +current +lift +rose +continue +block +chart +hat +sell +success +company +subtract +event +particular +deal +swim +term +opposite +wife +shoe +shoulder +spread +arrange +camp +invent +cotton +born +determine +quart +nine +truck +noise +level +chance +gather +shop +stretch +throw +shine +property +column +molecule +select +wrong +gray +repeat +require +broad +prepare +salt +nose +plural +anger +claim +continent +oxygen +sugar +death +pretty +skill +women +season +solution +magnet +silver +thank +branch +match +suffix +especially +fig +afraid +huge +sister +steel +discuss +forward +similar +guide +experience +score +apple +bought +led +pitch +coat +mass +card +band +rope +slip +win +dream +evening +condition +feed +tool +total +basic +smell +valley +nor +double +seat +arrive +master +track +parent +shore +division +sheet +substance +favor +connect +post +spend +chord +fat +glad +original +share +station +dad +bread +charge +proper +bar +offer +segment +slave +duck +instant +market +degree +populate +chick +dear +enemy +reply +drink +occur +support +speech +nature +range +steam +motion +path +liquid +log +meant +quotient +teeth +shell +neck \ No newline at end of file