Full typescript and mvvm implementation #3

Merged
Schmidii99 merged 26 commits from Developer into main 2023-04-23 20:02:32 +02:00
4 changed files with 35 additions and 76 deletions
Showing only changes of commit 644447526f - Show all commits

View File

@ -30,10 +30,17 @@ export class CpuRepository {
return __classPrivateFieldGet(this, _CpuRepository_nextCPU, "f");
}
getRandomCpu() {
let randomIndex = __classPrivateFieldGet(this, _CpuRepository_instances, "m", _CpuRepository_getRandomInt).call(this, 0, __classPrivateFieldGet(this, _CpuRepository_cpuList, "f").length);
let randomIndex;
do {
randomIndex = __classPrivateFieldGet(this, _CpuRepository_instances, "m", _CpuRepository_getRandomInt).call(this, 0, __classPrivateFieldGet(this, _CpuRepository_cpuList, "f").length);
} while (__classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex]["value"] == null || __classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex]["type"] == null);
__classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex]["name"] = __classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex]["name"].split('@')[0];
return __classPrivateFieldGet(this, _CpuRepository_cpuList, "f")[randomIndex];
}
nextRound() {
__classPrivateFieldSet(this, _CpuRepository_currentCPU, __classPrivateFieldGet(this, _CpuRepository_nextCPU, "f"), "f");
__classPrivateFieldSet(this, _CpuRepository_nextCPU, this.getRandomCpu(), "f");
}
}
_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);

View File

@ -2,52 +2,36 @@
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);
repo.nextCpu.cpuScore < repo.currentCpu.cpuScore ? showResult(true) : showResult(false);
}
export function btnHigherClick() {
nextCpu.score > currentCpu.score ? showResult(true) : showResult(false);
repo.nextCpu.cpuScore > repo.currentCpu.cpuScore ? 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;
document.getElementById("highScore").innerText = localStats.highScore.toString();
document.getElementById("score").innerText = localStats.score.toString();
countUp();
}
// updates view based on the cpu objects
function updateLayout() {
document.getElementById("highScore").innerText = localStats.highScore;
;
document.getElementById("currentCpuTitle").innerText = currentCpu.name;
document.getElementById("highScore").innerText = localStats.highScore.toString();
document.getElementById("currentCpuTitle").innerText = repo.currentCpu.name;
// add "." to large numbers
document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(currentCpu.score);
document.getElementById("nextCpuTitle").innerText = nextCpu.name;
document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(repo.currentCpu.cpuScore);
document.getElementById("nextCpuTitle").innerText = repo.nextCpu.name;
document.getElementById("nextCpuScore").innerText = "?";
document.getElementById("col2").style.backgroundColor = "";
}
@ -56,12 +40,12 @@ function delay(time) {
}
async function countUp() {
const options = {
startVal: nextCpu.score / 2,
startVal: repo.nextCpu.cpuScore / 2,
separator: '.',
decimal: ',',
duration: 2
};
let counter = new CountUp('nextCpuScore', nextCpu.score, options);
let counter = new CountUp('nextCpuScore', repo.nextCpu.cpuScore, options);
if (!counter.error) {
counter.start();
}
@ -74,12 +58,6 @@ async function countUp() {
document.getElementById("btnLower").removeAttribute("disabled");
}
function nextRound() {
currentCpu = nextCpu;
nextCpu = getRandomCpu();
repo.nextRound();
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
}

View File

@ -12,20 +12,20 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
var _Stats_score, _Stats_highScore, _Stats_highScoreStorageKey;
export class Stats {
constructor(highScoreStorageKey) {
// used as key for localStorage
var _a;
_Stats_score.set(this, void 0);
_Stats_highScore.set(this, void 0);
_Stats_highScoreStorageKey.set(this, void 0);
// used as key for localStorage
__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");
__classPrivateFieldSet(this, _Stats_highScore, (_a = Number(localStorage.getItem(__classPrivateFieldGet(this, _Stats_highScoreStorageKey, "f")))) !== null && _a !== void 0 ? _a : 0, "f");
}
incrementScore(value = 1) {
__classPrivateFieldSet(this, _Stats_score, __classPrivateFieldGet(this, _Stats_score, "f") + value, "f");
if (__classPrivateFieldGet(this, _Stats_highScore, "f") < __classPrivateFieldGet(this, _Stats_score, "f")) {
__classPrivateFieldSet(this, _Stats_highScore, __classPrivateFieldGet(this, _Stats_score, "f"), "f");
localStorage.setItem(__classPrivateFieldGet(this, _Stats_highScoreStorageKey, "f"), __classPrivateFieldGet(this, _Stats_highScore, "f"));
localStorage.setItem(__classPrivateFieldGet(this, _Stats_highScoreStorageKey, "f"), __classPrivateFieldGet(this, _Stats_highScore, "f").toString());
}
}
resetScore() {

View File

@ -3,12 +3,8 @@ import { CountUp } from "https://cdnjs.cloudflare.com/ajax/libs/countup.js/2.6.0
import { Stats } from "./statistics.js";
import { CpuRepository } from "./cpuRepository.js"
let cpuList;
let currentCpu;
let nextCpu;
var repo;
var localStats;
var repo: CpuRepository;
var localStats: Stats;
export async function main() {
localStats = new Stats("highScore_cpu");
@ -16,30 +12,15 @@ export async function main() {
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);
repo.nextCpu.cpuScore < repo.currentCpu.cpuScore ? showResult(true) : showResult(false);
}
export function btnHigherClick() {
nextCpu.score > currentCpu.score ? showResult(true) : showResult(false);
repo.nextCpu.cpuScore > repo.currentCpu.cpuScore ? showResult(true) : showResult(false);
}
function showResult(isCorrect) {
@ -50,20 +31,20 @@ function showResult(isCorrect) {
isCorrect ? localStats.incrementScore() : localStats.resetScore();
document.getElementById("highScore").innerText = localStats.highScore;
document.getElementById("score").innerText = localStats.score;
document.getElementById("highScore").innerText = localStats.highScore.toString();
document.getElementById("score").innerText = localStats.score.toString();
countUp();
}
// updates view based on the cpu objects
function updateLayout() {
document.getElementById("highScore").innerText = localStats.highScore;;
document.getElementById("highScore").innerText = localStats.highScore.toString();
document.getElementById("currentCpuTitle").innerText = currentCpu.name;
document.getElementById("currentCpuTitle").innerText = repo.currentCpu.name;
// add "." to large numbers
document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(currentCpu.score)
document.getElementById("nextCpuTitle").innerText = nextCpu.name;
document.getElementById("currentCpuScore").innerText = new Intl.NumberFormat().format(repo.currentCpu.cpuScore)
document.getElementById("nextCpuTitle").innerText = repo.nextCpu.name;
document.getElementById("nextCpuScore").innerText = "?";
@ -76,12 +57,12 @@ function delay(time) {
async function countUp() {
const options = {
startVal: nextCpu.score / 2,
startVal: repo.nextCpu.cpuScore / 2,
separator: '.',
decimal: ',',
duration: 2
};
let counter = new CountUp('nextCpuScore', nextCpu.score, options);
let counter = new CountUp('nextCpuScore', repo.nextCpu.cpuScore, options);
if (!counter.error) {
counter.start();
} else {
@ -96,14 +77,7 @@ async function countUp() {
}
function nextRound() {
currentCpu = nextCpu;
nextCpu = getRandomCpu();
repo.nextRound();
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
}