diff --git a/game.html b/game.html index 61b69ba..42848cc 100644 --- a/game.html +++ b/game.html @@ -41,6 +41,7 @@
Current Score: 0
+
Personal Highscore: 0
diff --git a/game.js b/game.js index 7c5e68a..5634f8f 100644 --- a/game.js +++ b/game.js @@ -6,7 +6,15 @@ var nextCpu; // current user score var score; -var highScore; +var highscore; + +function setHighscore(score) { + const currHighscore = localStorage.getItem("highscore_cpu") + if (currHighscore < score) { + localStorage.setItem("highscore_cpu", score) + highscore = score + } +} export async function main() { await (fetch('./data.json') @@ -16,7 +24,7 @@ export async function main() { currentCpu = getRandomCpu(); nextCpu = getRandomCpu(); score = 0; - highScore = 0; + highscore = localStorage.getItem("highscore_cpu") ?? 0 updateLayout(); } @@ -41,6 +49,9 @@ function showResult(isCorrect) { document.getElementById("btnLower").setAttribute("disabled", ""); document.getElementById("col2").style.backgroundColor = isCorrect ? "lightgreen" : "#FF4444"; + if (!isCorrect) { + setHighscore(score) + } score = isCorrect ? score + 1 : 0; if (score > highScore) { highScore = score; @@ -53,6 +64,7 @@ function showResult(isCorrect) { // updates view based on the cpu objects function updateLayout() { + document.getElementById("highscore").innerText = highscore; document.getElementById("currentCpuTitle").innerText = currentCpu.name; // add "." to large numbers document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(currentCpu.score)