zach
/
artseyio-typing-tutor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI tweaks

This commit is contained in:
Zach Graham 2023-08-15 23:12:21 -05:00
parent f4f9921f45
commit 6f0fe9afad
2 changed files with 10 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
css/artsey-tutor.css
View File

@ -35,7 +35,6 @@ body {
flex-basis: auto; flex-basis: auto;
align-self: auto; align-self: auto;
order: 0; order: 0;
width: 400px;
font-size: 28px; font-size: 28px;
text-align: center; text-align: center;
margin: 0 auto 20px; margin: 0 auto 20px;
@ -49,7 +48,6 @@ body {
align-self: auto; align-self: auto;
order: 0; order: 0;
margin: 0 auto; margin: 0 auto;
width: 400px;
} }
#keyboard { #keyboard {

11
js/artsey-tutor.js
View File

@ -94,7 +94,7 @@ async function setNextLetter() {
if (currentLetterIndex > currentString.length-1) if (currentLetterIndex > currentString.length-1)
return; return;
let prevIndex = currentLetterIndex-1; let prevIndex = currentLetterIndex-1;
if (prevIndex >= -1) if (prevIndex >= -1 || currentLetterIndex === 0)
await unHighlightLetter(letterbox.children()[currentLetterIndex]); await unHighlightLetter(letterbox.children()[currentLetterIndex]);
currentLetterIndex++; currentLetterIndex++;
currentLetter = currentString.charAt(currentLetterIndex).toLowerCase(); currentLetter = currentString.charAt(currentLetterIndex).toLowerCase();
@ -103,6 +103,13 @@ async function setNextLetter() {
await artseyDraw(); await artseyDraw();
} }
async function showWrongInput() {
let letter = $("#letterbox").children()[currentLetterIndex];
$(letter).css("background-color", "red").animate(1000).delay(500).queue(function () {
$(letter).css("background-color", "yellow").animate(1000);
})
}
let currentLetterIndex = -1; let currentLetterIndex = -1;
let currentLetter = ''; let currentLetter = '';
let currentString = "hello world"; let currentString = "hello world";
@ -115,6 +122,8 @@ $(document).ready(async function () {
console.log("current letter: " + currentLetter + " typed letter: " + String.fromCharCode(e.which).toLowerCase()); console.log("current letter: " + currentLetter + " typed letter: " + String.fromCharCode(e.which).toLowerCase());
if (currentLetter === String.fromCharCode(e.which).toLowerCase()) if (currentLetter === String.fromCharCode(e.which).toLowerCase())
await setNextLetter(); await setNextLetter();
else
await showWrongInput();
})); }));
await sleep(1000); await sleep(1000);