improvements to profile screen

This commit is contained in:
Arlo Filley 2022-11-29 12:21:38 +00:00
parent 239391e777
commit 7d918b0995
4 changed files with 86 additions and 11 deletions

View File

@ -71,7 +71,7 @@ class API {
* Validates all the parameters used for the postTest function which it then calls
*/
validateTest() {
const test = screenManager.screen.textbox.getLetters();
const test = screenManager.screen.textbox.getWords();
const testType = "words";
let testLength = test.length;
let testTime = screenManager.screen.timer.getTime();
@ -79,7 +79,10 @@ class API {
const quoteId = 0;
let wpm;
const userId = Number(user.userId);
let test_content = screenManager.screen.textbox.testContent;
let test_content = screenManager.screen.textbox.getTestContent();
console.log(test);
console.log(test_content);
let string = "";
let inaccurateLetters = 0;
@ -91,7 +94,7 @@ class API {
}
}
const accuracy = (test.length - inaccurateLetters) / test.length * 100;
const accuracy = Math.round(((test.length - inaccurateLetters) / test.length) * 100);
// this is the wpm calculation factoring in the time of test
// it assumes that all words are 5 characters long because on average
@ -286,8 +289,8 @@ class API {
if (text.length + textArr[i].length < effectiveWidth) {
text += `${textArr[i]} `
} else {
finalText.push(text);
text = textArr[i];
finalText.push(text.substring(0,text.length-1));
text = `${textArr[i]} `;
}
}
user.nextTest = finalText;

View File

@ -18,6 +18,12 @@ class ProfileScreen {
constructor() {
this.menu = new Menu();
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"),
]
this.offset = 0;
}
draw() {
@ -32,11 +38,56 @@ class ProfileScreen {
textSize(20);
fill("#000");
if (user.tests != undefined) {
for (let i = 0; i < user.tests.length; i++) {
text(`Test ${i+1}: ${user.tests[i].wpm}wpm | Characters Typed: ${user.tests[i].test_length}`, 0, i*30+300, windowWidth, 30);
if (this.testButtons === undefined) {
this.createTestButtons();
}
}
for (let i = 0; i < this.buttons.length; i++) {
this.buttons[i].draw();
}
if (this.testButtons !== undefined) {
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 (user.tests.length < 13 + this.offset) {
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);
}
fill("#000");
text(`Logged in as ${user.username}`, windowWidth-400, 15);
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")
]];
let j = 300;
for (let i = user.tests.length-1-offset; i >= user.tests.length-13-offset; 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}`)
])
j+=30;
}
}
}

View File

@ -188,8 +188,17 @@ class Button {
fill(this.hoverTextColor);
text(this.label, this.x, this.y, this.width, this.height);
} else {
if (this.border) {
strokeWeight(2);
stroke(this.borderColor)
} else {
noStroke();
}
fill(this.backgroundColor);
rect(this.x, this.y, this.width, this.height);
noStroke();
fill(this.textColor);
text(this.label, this.x, this.y, this.width, this.height);
}

View File

@ -186,7 +186,11 @@ class Textbox {
}
getWords() {
return this.words;
let text = "";
for (let i = 0; i < this.words.length; i++) {
text += this.words[i];
}
return text;
}
setWords(pWords) {
@ -201,6 +205,14 @@ class Textbox {
this.allowedLetters = pAllowedLetters;
}
getTestContent() {
let text = "";
for (let i = 0; i < this.testContent.length; i++) {
text += this.testContent[i];
}
return text;
}
/**
* draws a Textbox
* @returns
@ -235,7 +247,7 @@ class Textbox {
let i = this.x;
let j = this.y;
if (this.words[this.currentLine].length > this.testContent[this.currentLine].length) {
if (this.words[this.currentLine].length >= this.testContent[this.currentLine].length) {
this.currentLine++;
this.words.push("");
}