full rework on typescript

This commit is contained in:
Florian Schmid 2023-04-21 22:41:22 +02:00
parent 72bc385048
commit 7a14937463
10 changed files with 118865 additions and 126 deletions

View File

@ -1,34 +1,42 @@
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
if (kind === "m") throw new TypeError("Private method is not writable");
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var _CpuRepository_instances, _CpuRepository_cpuList, _CpuRepository_currentCPU, _CpuRepository_nextCPU, _CpuRepository_getRandomInt;
export class CpuRepository { export class CpuRepository {
#cpuList; constructor() {
_CpuRepository_instances.add(this);
#currentCPU; _CpuRepository_cpuList.set(this, void 0);
#nextCPU; _CpuRepository_currentCPU.set(this, void 0);
_CpuRepository_nextCPU.set(this, void 0);
}
async init() { async init() {
const fetchResult = await fetch("./js/data.json"); const fetchResult = await fetch("./js/data.json");
this.#cpuList = await fetchResult.json(); __classPrivateFieldSet(this, _CpuRepository_cpuList, await fetchResult.json(), "f");
__classPrivateFieldSet(this, _CpuRepository_currentCPU, this.getRandomCpu(), "f");
this.#currentCPU = this.getRandomCpu(); __classPrivateFieldSet(this, _CpuRepository_nextCPU, this.getRandomCpu(), "f");
this.#nextCPU = this.getRandomCpu();
} }
get currentCpu() { get currentCpu() {
return this.#currentCpu; return __classPrivateFieldGet(this, _CpuRepository_currentCPU, "f");
} }
get nextCpu() { get nextCpu() {
return this.#nextCpu; return __classPrivateFieldGet(this, _CpuRepository_nextCPU, "f");
} }
getRandomCpu() { getRandomCpu() {
let randomIndex = this.#getRandomInt(0, this.#cpuList.length); let randomIndex = __classPrivateFieldGet(this, _CpuRepository_instances, "m", _CpuRepository_getRandomInt).call(this, 0, __classPrivateFieldGet(this, _CpuRepository_cpuList, "f").length);
this.#cpuList[randomIndex]["name"] = this.#cpuList[randomIndex]["name"].split('@')[0]; __classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex]["name"] = __classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex]["name"].split('@')[0];
return this.#cpuList[randomIndex]; return __classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex];
} }
}
#getRandomInt(min, max) { _CpuRepository_cpuList = new WeakMap(), _CpuRepository_currentCPU = new WeakMap(), _CpuRepository_nextCPU = new WeakMap(), _CpuRepository_instances = new WeakSet(), _CpuRepository_getRandomInt = function _CpuRepository_getRandomInt(min, max) {
min = Math.ceil(min); min = Math.ceil(min);
max = Math.floor(max); max = Math.floor(max);
return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive
} };
}

View File

@ -1,78 +1,59 @@
// @ts-ignore
import { CountUp } from "https://cdnjs.cloudflare.com/ajax/libs/countup.js/2.6.0/countUp.min.js"; import { CountUp } from "https://cdnjs.cloudflare.com/ajax/libs/countup.js/2.6.0/countUp.min.js";
import { Stats } from "./statistics.js"; import { Stats } from "./statistics.js";
import { CpuRepository } from "./cpuRepository.js" import { CpuRepository } from "./cpuRepository.js";
let cpuList;
var cpuList; let currentCpu;
var currentCpu; let nextCpu;
var nextCpu;
var repo; var repo;
var localStats; var localStats;
export async function main() { export async function main() {
localStats = new Stats("highScore_cpu"); localStats = new Stats("highScore_cpu");
repo = new CpuRepository(); repo = new CpuRepository();
await repo.init(); await repo.init();
await (fetch('./js/data.json') await (fetch('./js/data.json')
.then((response) => response.json()) .then((response) => response.json())
.then((json) => cpuList = json)); .then((json) => cpuList = json));
currentCpu = getRandomCpu(); currentCpu = getRandomCpu();
nextCpu = getRandomCpu(); nextCpu = getRandomCpu();
updateLayout(); updateLayout();
} }
function getRandomCpu() { function getRandomCpu() {
let randomIndex = getRandomInt(0, cpuList.length) let randomIndex = getRandomInt(0, cpuList.length);
return { return {
name: cpuList[randomIndex]["name"].split('@')[0], name: cpuList[randomIndex]["name"].split('@')[0],
score: cpuList[randomIndex]["cpuScore"] score: cpuList[randomIndex]["cpuScore"]
} };
} }
export function btnLowerClick() { export function btnLowerClick() {
nextCpu.score < currentCpu.score ? showResult(true) : showResult(false); nextCpu.score < currentCpu.score ? showResult(true) : showResult(false);
} }
export function btnHigherClick() { export function btnHigherClick() {
nextCpu.score > currentCpu.score ? showResult(true) : showResult(false); nextCpu.score > currentCpu.score ? showResult(true) : showResult(false);
} }
function showResult(isCorrect) { function showResult(isCorrect) {
document.getElementById("btnHigher").setAttribute("disabled", ""); document.getElementById("btnHigher").setAttribute("disabled", "");
document.getElementById("btnLower").setAttribute("disabled", ""); document.getElementById("btnLower").setAttribute("disabled", "");
document.getElementById("col2").style.backgroundColor = isCorrect ? "lightgreen" : "#FF4444"; document.getElementById("col2").style.backgroundColor = isCorrect ? "lightgreen" : "#FF4444";
isCorrect ? localStats.incrementScore() : localStats.resetScore(); isCorrect ? localStats.incrementScore() : localStats.resetScore();
document.getElementById("highScore").innerText = localStats.highScore; document.getElementById("highScore").innerText = localStats.highScore;
document.getElementById("score").innerText = localStats.score; document.getElementById("score").innerText = localStats.score;
countUp(); countUp();
} }
// updates view based on the cpu objects // updates view based on the cpu objects
function updateLayout() { function updateLayout() {
document.getElementById("highScore").innerText = localStats.highScore;; document.getElementById("highScore").innerText = localStats.highScore;
;
document.getElementById("currentCpuTitle").innerText = currentCpu.name; document.getElementById("currentCpuTitle").innerText = currentCpu.name;
// add "." to large numbers // add "." to large numbers
document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(currentCpu.score) document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(currentCpu.score);
document.getElementById("nextCpuTitle").innerText = nextCpu.name; document.getElementById("nextCpuTitle").innerText = nextCpu.name;
document.getElementById("nextCpuScore").innerText = "?"; document.getElementById("nextCpuScore").innerText = "?";
document.getElementById("col2").style.backgroundColor = ""; document.getElementById("col2").style.backgroundColor = "";
} }
function delay(time) { function delay(time) {
return new Promise(resolve => setTimeout(resolve, time)); return new Promise(resolve => setTimeout(resolve, time));
} }
async function countUp() { async function countUp() {
const options = { const options = {
startVal: nextCpu.score / 2, startVal: nextCpu.score / 2,
@ -83,26 +64,22 @@ async function countUp() {
let counter = new CountUp('nextCpuScore', nextCpu.score, options); let counter = new CountUp('nextCpuScore', nextCpu.score, options);
if (!counter.error) { if (!counter.error) {
counter.start(); counter.start();
} else { }
else {
console.log(counter.error); console.log(counter.error);
} }
await delay(2500);
await delay(2500)
nextRound(); nextRound();
document.getElementById("btnHigher").removeAttribute("disabled"); document.getElementById("btnHigher").removeAttribute("disabled");
document.getElementById("btnLower").removeAttribute("disabled"); document.getElementById("btnLower").removeAttribute("disabled");
} }
function nextRound() { function nextRound() {
currentCpu = nextCpu; currentCpu = nextCpu;
nextCpu = getRandomCpu(); nextCpu = getRandomCpu();
updateLayout(); updateLayout();
} }
function getRandomInt(min, max) { function getRandomInt(min, max) {
min = Math.ceil(min); min = Math.ceil(min);
max = Math.floor(max); max = Math.floor(max);
return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive
} }

View File

@ -1,64 +1,49 @@
var cpuList; var cpuList;
var currentCpu; var currentCpu;
var score; var score;
var highScore; var highScore;
export async function main() { export async function main() {
var _a;
// init cpu list // init cpu list
await (fetch('./data.json') await (fetch('./data.json')
.then((response) => response.json()) .then((response) => response.json())
.then((json) => cpuList = json)); .then((json) => cpuList = json));
highScore = (_a = localStorage.getItem("highScore_socket")) !== null && _a !== void 0 ? _a : 0;
highScore = localStorage.getItem("highScore_socket") ?? 0
score = 0; score = 0;
updateScores(); updateScores();
nextRound(); nextRound();
} }
function nextRound() { function nextRound() {
currentCpu = getRandomCpu(); currentCpu = getRandomCpu();
document.getElementById("cpuName").innerText = currentCpu.name; document.getElementById("cpuName").innerText = currentCpu.name;
document.getElementById("mainCol").style.backgroundColor = ""; document.getElementById("mainCol").style.backgroundColor = "";
} }
function getRandomCpu() { function getRandomCpu() {
let randomIndex; let randomIndex;
do { do {
randomIndex = getRandomInt(0, cpuList.length) randomIndex = getRandomInt(0, cpuList.length);
} while (typeof(cpuList[randomIndex]["type"]) == null || cpuList[randomIndex]["type"] == "null" || cpuList[randomIndex]["type"] == null); } while (typeof (cpuList[randomIndex]["type"]) == null || cpuList[randomIndex]["type"] == "null" || cpuList[randomIndex]["type"] == null);
return { return {
name: cpuList[randomIndex]["name"].split('@')[0], name: cpuList[randomIndex]["name"].split('@')[0],
type: cpuList[randomIndex]["type"] type: cpuList[randomIndex]["type"]
} };
} }
function delay(time) { function delay(time) {
return new Promise(resolve => setTimeout(resolve, time)); return new Promise(resolve => setTimeout(resolve, time));
} }
export async function btnClick(typ) { export async function btnClick(typ) {
// 0 -> Desktop // 0 -> Desktop
// 1 -> Laptop // 1 -> Laptop
// 2 -> Mobile/Embedded // 2 -> Mobile/Embedded
// 3 -> Server // 3 -> Server
let btnDesktop = document.getElementById("btnDesktop");
let btnDesktop = document.getElementById("btnDesktop"); let btnLaptop = document.getElementById("btnLaptop");
let btnLaptop = document.getElementById("btnLaptop"); let btnMobile = document.getElementById("btnMobile");
let btnMobile = document.getElementById("btnMobile"); let btnServer = document.getElementById("btnServer");
let btnServer = document.getElementById("btnServer");
let btns = [btnDesktop, btnLaptop, btnMobile, btnServer]; let btns = [btnDesktop, btnLaptop, btnMobile, btnServer];
btns.forEach((el) => { btns.forEach((el) => {
el.setAttribute("disabled", ""); el.setAttribute("disabled", "");
}) });
switch (typ) { switch (typ) {
case 0: case 0:
btnDesktop.style.backgroundColor = "#FF4444"; btnDesktop.style.backgroundColor = "#FF4444";
@ -73,24 +58,23 @@ export async function btnClick(typ) {
btnServer.style.backgroundColor = "#FF4444"; btnServer.style.backgroundColor = "#FF4444";
break; break;
} }
if (currentCpu.type.includes("Desktop")) {
if(currentCpu.type.includes("Desktop")) {
btnDesktop.style.backgroundColor = "lightgreen"; btnDesktop.style.backgroundColor = "lightgreen";
} }
if(currentCpu.type.includes("Laptop")) { if (currentCpu.type.includes("Laptop")) {
btnLaptop.style.backgroundColor = "lightgreen"; btnLaptop.style.backgroundColor = "lightgreen";
} }
if(currentCpu.type.includes("Mobile/Embedded")) { if (currentCpu.type.includes("Mobile/Embedded")) {
btnMobile.style.backgroundColor = "lightgreen"; btnMobile.style.backgroundColor = "lightgreen";
} }
if(currentCpu.type.includes("Server")) { if (currentCpu.type.includes("Server")) {
btnServer.style.backgroundColor = "lightgreen"; btnServer.style.backgroundColor = "lightgreen";
} }
// Score // Score
if (btns[typ].style.backgroundColor == "lightgreen") { if (btns[typ].style.backgroundColor == "lightgreen") {
score++; score++;
} else { }
else {
score = 0; score = 0;
} }
// Highscore // Highscore
@ -99,26 +83,20 @@ export async function btnClick(typ) {
localStorage.setItem("highScore_socket", highScore); localStorage.setItem("highScore_socket", highScore);
} }
updateScores(); updateScores();
await delay(1000); await delay(1000);
btns.forEach((el) => {
btns.forEach( (el) => {
el.style.backgroundColor = "#3CC3FA"; el.style.backgroundColor = "#3CC3FA";
el.removeAttribute("disabled"); el.removeAttribute("disabled");
}) });
nextRound(); nextRound();
} }
function updateScores() { function updateScores() {
document.getElementById("score").innerText = score; document.getElementById("score").innerText = score;
document.getElementById("highScore").innerText = highScore; document.getElementById("highScore").innerText = highScore;
} }
function getRandomInt(min, max) { function getRandomInt(min, max) {
min = Math.ceil(min); min = Math.ceil(min);
max = Math.floor(max); max = Math.floor(max);
return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive
} }
main();
main();

View File

@ -1,35 +1,41 @@
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
if (kind === "m") throw new TypeError("Private method is not writable");
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var _Stats_score, _Stats_highScore, _Stats_highScoreStorageKey;
export class Stats { export class Stats {
#score;
#highScore;
#highScoreStorageKey;
constructor(highScoreStorageKey) { constructor(highScoreStorageKey) {
// used as key for localStorage // used as key for localStorage
var _a;
this.#highScoreStorageKey = highScoreStorageKey; _Stats_score.set(this, void 0);
_Stats_highScore.set(this, void 0);
this.#score = 0; _Stats_highScoreStorageKey.set(this, void 0);
this.#highScore = localStorage.getItem(this.#highScoreStorageKey) ?? 0; __classPrivateFieldSet(this, _Stats_highScoreStorageKey, highScoreStorageKey, "f");
__classPrivateFieldSet(this, _Stats_score, 0, "f");
__classPrivateFieldSet(this, _Stats_highScore, (_a = localStorage.getItem(__classPrivateFieldGet(this, _Stats_highScoreStorageKey, "f"))) !== null && _a !== void 0 ? _a : 0, "f");
} }
incrementScore(value = 1) { incrementScore(value = 1) {
this.#score += value; __classPrivateFieldSet(this, _Stats_score, __classPrivateFieldGet(this, _Stats_score, "f") + value, "f");
if (__classPrivateFieldGet(this, _Stats_highScore, "f") < __classPrivateFieldGet(this, _Stats_score, "f")) {
if (this.#highScore < this.#score) { __classPrivateFieldSet(this, _Stats_highScore, __classPrivateFieldGet(this, _Stats_score, "f"), "f");
this.#highScore = this.#score; localStorage.setItem(__classPrivateFieldGet(this, _Stats_highScoreStorageKey, "f"), __classPrivateFieldGet(this, _Stats_highScore, "f"));
localStorage.setItem(this.#highScoreStorageKey, this.#highScore);
} }
} }
resetScore() { resetScore() {
this.#score = 0; __classPrivateFieldSet(this, _Stats_score, 0, "f");
} }
get highScore() { get highScore() {
return this.#highScore; return __classPrivateFieldGet(this, _Stats_highScore, "f");
} }
get score() { get score() {
return this.#score; return __classPrivateFieldGet(this, _Stats_score, "f");
} }
} }
_Stats_score = new WeakMap(), _Stats_highScore = new WeakMap(), _Stats_highScoreStorageKey = new WeakMap();

34
src/cpuRepository.ts Normal file
View File

@ -0,0 +1,34 @@
export class CpuRepository {
#cpuList;
#currentCPU;
#nextCPU;
async init() {
const fetchResult = await fetch("./js/data.json");
this.#cpuList = await fetchResult.json();
this.#currentCPU = this.getRandomCpu();
this.#nextCPU = this.getRandomCpu();
}
get currentCpu() {
return this.#currentCPU;
}
get nextCpu() {
return this.#nextCPU;
}
getRandomCpu() {
let randomIndex = this.#getRandomInt(0, this.#cpuList.length);
this.#cpuList[randomIndex]["name"] = this.#cpuList[randomIndex]["name"].split('@')[0];
return this.#cpuList[randomIndex];
}
#getRandomInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive
}
}

118458
src/data.json Normal file

File diff suppressed because it is too large Load Diff

109
src/game.ts Normal file
View File

@ -0,0 +1,109 @@
// @ts-ignore
import { CountUp } from "https://cdnjs.cloudflare.com/ajax/libs/countup.js/2.6.0/countUp.min.js";
import { Stats } from "./statistics.js";
import { CpuRepository } from "./cpuRepository.js"
let cpuList;
let currentCpu;
let nextCpu;
var repo;
var localStats;
export async function main() {
localStats = new Stats("highScore_cpu");
repo = new CpuRepository();
await repo.init();
await (fetch('./js/data.json')
.then((response) => response.json())
.then((json) => cpuList = json));
currentCpu = getRandomCpu();
nextCpu = getRandomCpu();
updateLayout();
}
function getRandomCpu() {
let randomIndex = getRandomInt(0, cpuList.length)
return {
name: cpuList[randomIndex]["name"].split('@')[0],
score: cpuList[randomIndex]["cpuScore"]
}
}
export function btnLowerClick() {
nextCpu.score < currentCpu.score ? showResult(true) : showResult(false);
}
export function btnHigherClick() {
nextCpu.score > currentCpu.score ? showResult(true) : showResult(false);
}
function showResult(isCorrect) {
document.getElementById("btnHigher").setAttribute("disabled", "");
document.getElementById("btnLower").setAttribute("disabled", "");
document.getElementById("col2").style.backgroundColor = isCorrect ? "lightgreen" : "#FF4444";
isCorrect ? localStats.incrementScore() : localStats.resetScore();
document.getElementById("highScore").innerText = localStats.highScore;
document.getElementById("score").innerText = localStats.score;
countUp();
}
// updates view based on the cpu objects
function updateLayout() {
document.getElementById("highScore").innerText = localStats.highScore;;
document.getElementById("currentCpuTitle").innerText = currentCpu.name;
// add "." to large numbers
document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(currentCpu.score)
document.getElementById("nextCpuTitle").innerText = nextCpu.name;
document.getElementById("nextCpuScore").innerText = "?";
document.getElementById("col2").style.backgroundColor = "";
}
function delay(time) {
return new Promise(resolve => setTimeout(resolve, time));
}
async function countUp() {
const options = {
startVal: nextCpu.score / 2,
separator: '.',
decimal: ',',
duration: 2
};
let counter = new CountUp('nextCpuScore', nextCpu.score, options);
if (!counter.error) {
counter.start();
} else {
console.log(counter.error);
}
await delay(2500)
nextRound();
document.getElementById("btnHigher").removeAttribute("disabled");
document.getElementById("btnLower").removeAttribute("disabled");
}
function nextRound() {
currentCpu = nextCpu;
nextCpu = getRandomCpu();
updateLayout();
}
function getRandomInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive
}

124
src/gst.ts Normal file
View File

@ -0,0 +1,124 @@
var cpuList;
var currentCpu;
var score;
var highScore;
export async function main() {
// init cpu list
await (fetch('./data.json')
.then((response) => response.json())
.then((json) => cpuList = json));
highScore = localStorage.getItem("highScore_socket") ?? 0
score = 0;
updateScores();
nextRound();
}
function nextRound() {
currentCpu = getRandomCpu();
document.getElementById("cpuName").innerText = currentCpu.name;
document.getElementById("mainCol").style.backgroundColor = "";
}
function getRandomCpu() {
let randomIndex;
do {
randomIndex = getRandomInt(0, cpuList.length)
} while (typeof(cpuList[randomIndex]["type"]) == null || cpuList[randomIndex]["type"] == "null" || cpuList[randomIndex]["type"] == null);
return {
name: cpuList[randomIndex]["name"].split('@')[0],
type: cpuList[randomIndex]["type"]
}
}
function delay(time) {
return new Promise(resolve => setTimeout(resolve, time));
}
export async function btnClick(typ) {
// 0 -> Desktop
// 1 -> Laptop
// 2 -> Mobile/Embedded
// 3 -> Server
let btnDesktop = document.getElementById("btnDesktop");
let btnLaptop = document.getElementById("btnLaptop");
let btnMobile = document.getElementById("btnMobile");
let btnServer = document.getElementById("btnServer");
let btns = [btnDesktop, btnLaptop, btnMobile, btnServer];
btns.forEach((el) => {
el.setAttribute("disabled", "");
})
switch (typ) {
case 0:
btnDesktop.style.backgroundColor = "#FF4444";
break;
case 1:
btnLaptop.style.backgroundColor = "#FF4444";
break;
case 2:
btnMobile.style.backgroundColor = "#FF4444";
break;
case 3:
btnServer.style.backgroundColor = "#FF4444";
break;
}
if(currentCpu.type.includes("Desktop")) {
btnDesktop.style.backgroundColor = "lightgreen";
}
if(currentCpu.type.includes("Laptop")) {
btnLaptop.style.backgroundColor = "lightgreen";
}
if(currentCpu.type.includes("Mobile/Embedded")) {
btnMobile.style.backgroundColor = "lightgreen";
}
if(currentCpu.type.includes("Server")) {
btnServer.style.backgroundColor = "lightgreen";
}
// Score
if (btns[typ].style.backgroundColor == "lightgreen") {
score++;
} else {
score = 0;
}
// Highscore
if (score > highScore) {
highScore = score;
localStorage.setItem("highScore_socket", highScore);
}
updateScores();
await delay(1000);
btns.forEach( (el) => {
el.style.backgroundColor = "#3CC3FA";
el.removeAttribute("disabled");
})
nextRound();
}
function updateScores() {
document.getElementById("score").innerText = score;
document.getElementById("highScore").innerText = highScore;
}
function getRandomInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive
}
main();

35
src/statistics.ts Normal file
View File

@ -0,0 +1,35 @@
export class Stats {
#score;
#highScore;
#highScoreStorageKey;
constructor(highScoreStorageKey) {
// used as key for localStorage
this.#highScoreStorageKey = highScoreStorageKey;
this.#score = 0;
this.#highScore = localStorage.getItem(this.#highScoreStorageKey) ?? 0;
}
incrementScore(value = 1) {
this.#score += value;
if (this.#highScore < this.#score) {
this.#highScore = this.#score;
localStorage.setItem(this.#highScoreStorageKey, this.#highScore);
}
}
resetScore() {
this.#score = 0;
}
get highScore() {
return this.#highScore;
}
get score() {
return this.#score;
}
}

10
tsconfig.json Normal file
View File

@ -0,0 +1,10 @@
{
"compilerOptions": {
"outDir": "./js",
"allowJs": true,
"target": "ES2017",
"lib": ["es2018", "dom"],
},
"include": ["./src/**/*"]
}