added user logins and signups
This commit is contained in:
parent
f6d52f1610
commit
9f2a5641db
@ -1,6 +1,6 @@
|
|||||||
[default]
|
[default]
|
||||||
address = "192.168.0.131"
|
address = "192.168.0.109"
|
||||||
port = 8000
|
port = 10713
|
||||||
workers = 4
|
workers = 4
|
||||||
max_blocking = 512
|
max_blocking = 512
|
||||||
keep_alive = 5
|
keep_alive = 5
|
||||||
|
@ -74,10 +74,16 @@ fn create_user(
|
|||||||
).expect("Error: Couldn't create new user");
|
).expect("Error: Couldn't create new user");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[get("/login/<username>/<password>")]
|
||||||
|
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]
|
#[launch]
|
||||||
fn rocket() -> Rocket<Build> {
|
fn rocket() -> Rocket<Build> {
|
||||||
rocket::build()
|
rocket::build()
|
||||||
.mount("/test", routes![test]) // testing only, should return "Hello world"
|
.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
|
.mount("/typing", FileServer::from(relative!("website"))) // hosts the fileserver
|
||||||
}
|
}
|
34
src/sql.rs
34
src/sql.rs
@ -89,6 +89,7 @@ pub fn create_user(
|
|||||||
username: &str,
|
username: &str,
|
||||||
password: &str
|
password: &str
|
||||||
) -> Result<()> {
|
) -> Result<()> {
|
||||||
|
println!("{} {}",username, password);
|
||||||
let connection = get_connection();
|
let connection = get_connection();
|
||||||
|
|
||||||
connection.execute(
|
connection.execute(
|
||||||
@ -109,4 +110,37 @@ pub fn create_user(
|
|||||||
)?;
|
)?;
|
||||||
|
|
||||||
Ok(())
|
Ok(())
|
||||||
|
}
|
||||||
|
|
||||||
|
#[derive(Debug)]
|
||||||
|
pub struct User {
|
||||||
|
user_id: u32,
|
||||||
|
}
|
||||||
|
|
||||||
|
pub fn find_user(
|
||||||
|
username: &str,
|
||||||
|
password: &str
|
||||||
|
) -> Result<u32> {
|
||||||
|
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)
|
||||||
}
|
}
|
@ -1,7 +1,7 @@
|
|||||||
class API {
|
class API {
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
this.url = "http://192.168.0.131:8000/api/";
|
this.url = "http://arlofilley.com/api/";
|
||||||
// this is the url of the server
|
// this is the url of the server
|
||||||
// this may have to change later on
|
// this may have to change later on
|
||||||
}
|
}
|
||||||
@ -169,6 +169,7 @@ class API {
|
|||||||
username,
|
username,
|
||||||
password
|
password
|
||||||
) {
|
) {
|
||||||
|
console.log(username, password);
|
||||||
const user = {
|
const user = {
|
||||||
username: username,
|
username: username,
|
||||||
password: password
|
password: password
|
||||||
@ -184,4 +185,25 @@ class API {
|
|||||||
JSON.stringify(user)
|
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");
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
7
website/api/user.js
Normal file
7
website/api/user.js
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
class User {
|
||||||
|
constructor() {
|
||||||
|
this.username;
|
||||||
|
this.password;
|
||||||
|
this.userId;
|
||||||
|
}
|
||||||
|
}
|
@ -22,9 +22,11 @@
|
|||||||
<script src="./screens/startscreen.js"></script>
|
<script src="./screens/startscreen.js"></script>
|
||||||
<script src="./screens/testscreen.js"></script>
|
<script src="./screens/testscreen.js"></script>
|
||||||
<script src="./screens/endscreen.js"></script>
|
<script src="./screens/endscreen.js"></script>
|
||||||
|
<script src="./screens/signUpScreen.js"></script>
|
||||||
|
|
||||||
<!-- API Script Files -->
|
<!-- API Script Files -->
|
||||||
<script src="./api/api.js"></script>
|
<script src="./api/api.js"></script>
|
||||||
|
<script src="./api/user.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
@ -21,7 +21,7 @@ function draw() {
|
|||||||
|
|
||||||
// whenever a key is pressed this function is called
|
// whenever a key is pressed this function is called
|
||||||
function keyPressed() {
|
function keyPressed() {
|
||||||
screenManager.textbox.letterTyped(key);
|
screenManager.letterTyped(key);
|
||||||
}
|
}
|
||||||
|
|
||||||
// This ensures that the canvas is always the correct size and at the center
|
// This ensures that the canvas is always the correct size and at the center
|
||||||
|
@ -16,4 +16,13 @@ class ScreenManager {
|
|||||||
getScreen() {
|
getScreen() {
|
||||||
return this.screen;
|
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)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
@ -1,24 +1,61 @@
|
|||||||
class SignUpScreen {
|
class SignUpScreen {
|
||||||
constructor() {
|
constructor() {
|
||||||
textboxes = [
|
this.textboxes = [
|
||||||
new Textbox(
|
new Textbox(
|
||||||
0,0,
|
120,250,
|
||||||
0,0,
|
500,100,
|
||||||
true,
|
0,
|
||||||
"#000",
|
true,
|
||||||
false, "#000",
|
"#000",
|
||||||
"#000"
|
false, "#000",
|
||||||
|
"#000"
|
||||||
),
|
),
|
||||||
|
|
||||||
new Textbox(
|
new Textbox(
|
||||||
0,0,
|
120,400,
|
||||||
0,0,
|
500,100,
|
||||||
|
0,
|
||||||
true,
|
true,
|
||||||
"#000",
|
"#000",
|
||||||
false,"000",
|
false,"000",
|
||||||
"#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() {
|
draw() {
|
||||||
background("#eeeee4");
|
background("#eeeee4");
|
||||||
for (texbox in this.textboxes) {
|
for (let i = 0; i < this.buttons.length; i++) {
|
||||||
textbox.draw();
|
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
|
* @param {key} key
|
||||||
*/
|
*/
|
||||||
letterTyped(key) {
|
letterTyped(key) {
|
||||||
this.textboxes[0].letterTyped();
|
this.textboxes[this.activeTextBox].letterTyped(key);
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -1,12 +1,23 @@
|
|||||||
class StartScreen {
|
class StartScreen {
|
||||||
constructor() {
|
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() {
|
draw() {
|
||||||
background("#eeeee4");
|
background("#eeeee4");
|
||||||
textSize(100);
|
textSize(100);
|
||||||
textAlign(CENTER, CENTER);
|
textAlign(CENTER, CENTER);
|
||||||
|
fill("#000");
|
||||||
text("Press enter to start test", 0, 0, windowWidth - 100, windowHeight - 100);
|
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());
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -1,14 +1,18 @@
|
|||||||
class TestScreen {
|
class TestScreen {
|
||||||
constructor() {
|
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 = new Timer(0,0,windowWidth,50,0,true,"#fff", true, "#000", "#666", 15, true);
|
||||||
screenManager.timer.start();
|
screenManager.timer.start();
|
||||||
}
|
}
|
||||||
|
|
||||||
draw() {
|
draw() {
|
||||||
background("#eeeee4");
|
background("#eeeee4");
|
||||||
screenManager.textbox.draw();
|
this.textbox.draw();
|
||||||
screenManager.timer.draw();
|
screenManager.timer.draw();
|
||||||
screenManager.timer.tick();
|
screenManager.timer.tick();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
letterTyped(key) {
|
||||||
|
this.textbox.letterTyped(key);
|
||||||
|
}
|
||||||
}
|
}
|
@ -129,7 +129,6 @@ class Button {
|
|||||||
|
|
||||||
// if the mouse is within the bounds of the return that the button has been pressed
|
// 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) {
|
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 true;
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
@ -139,11 +138,12 @@ class Button {
|
|||||||
* This function draws the button with the label
|
* This function draws the button with the label
|
||||||
*/
|
*/
|
||||||
draw() {
|
draw() {
|
||||||
|
textSize(20);
|
||||||
fill(this.backgroundColor);
|
fill(this.backgroundColor);
|
||||||
rect(this.x, this.y, this.width, this.height);
|
rect(this.x, this.y, this.width, this.height);
|
||||||
|
|
||||||
fill(this.textColor);
|
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
|
// passing 4 arguments to this function means the text will wrap within this box
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -127,23 +127,20 @@ class Textbox {
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
letterTyped(pKey) {
|
letterTyped(pKey) {
|
||||||
if (pKey === "Enter" && (screenManager.screen.constructor.name === "StartScreen" /* || screenManager.screen.constructor.name === "EndScreen" */)) {
|
if (screenManager.screen.constructor.name === "TestScreen" && screenManager.timer.time === 0) {
|
||||||
screenManager.setScreen(new TestScreen());
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (screenManager.timer.time === 0) {
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (pKey === "Backspace" && this.letters.length > 0) {
|
if (pKey === "Backspace" && this.letters.length > 0) {
|
||||||
this.letters.pop();
|
this.letters.pop();
|
||||||
|
this.words.substring(0, this.words.length-1)
|
||||||
return;
|
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]) {
|
if (pKey.toLowerCase() === this.allowedLetters[i]) {
|
||||||
this.letters.push(pKey);
|
this.letters.push(pKey);
|
||||||
|
this.words += pKey;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user