Full typescript and mvvm implementation #3

Merged
Schmidii99 merged 26 commits from Developer into main 2023-04-23 20:02:32 +02:00
5 changed files with 2 additions and 256 deletions
Showing only changes of commit 40e9213c19 - Show all commits

1
.gitignore vendored
View File

@ -1,2 +1,3 @@
.DS_Store
node_modules
./js/*

View File

@ -1,49 +0,0 @@
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 {
constructor() {
_CpuRepository_instances.add(this);
_CpuRepository_cpuList.set(this, void 0);
_CpuRepository_currentCPU.set(this, void 0);
_CpuRepository_nextCPU.set(this, void 0);
}
async init() {
const fetchResult = await fetch("./js/data.json");
__classPrivateFieldSet(this, _CpuRepository_cpuList, await fetchResult.json(), "f");
__classPrivateFieldSet(this, _CpuRepository_currentCPU, this.getRandomCpu(), "f");
__classPrivateFieldSet(this, _CpuRepository_nextCPU, this.getRandomCpu(), "f");
}
get currentCpu() {
return __classPrivateFieldGet(this, _CpuRepository_currentCPU, "f");
}
get nextCpu() {
return __classPrivateFieldGet(this, _CpuRepository_nextCPU, "f");
}
getRandomCpu() {
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);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min) + min); // The maximum is exclusive and the minimum is inclusive
};

View File

@ -1,63 +0,0 @@
// @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";
var repo;
var localStats;
export async function main() {
localStats = new Stats("highScore_cpu");
repo = new CpuRepository();
await repo.init();
updateLayout();
}
export function btnLowerClick() {
repo.nextCpu.cpuScore < repo.currentCpu.cpuScore ? showResult(true) : showResult(false);
}
export function btnHigherClick() {
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.toString();
document.getElementById("score").innerText = localStats.score.toString();
countUp();
}
// updates view based on the cpu objects
function updateLayout() {
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(repo.currentCpu.cpuScore);
document.getElementById("nextCpuTitle").innerText = repo.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: repo.nextCpu.cpuScore / 2,
separator: '.',
decimal: ',',
duration: 2
};
let counter = new CountUp('nextCpuScore', repo.nextCpu.cpuScore, 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() {
repo.nextRound();
updateLayout();
}

102
js/gst.js
View File

@ -1,102 +0,0 @@
var cpuList;
var currentCpu;
var score;
var highScore;
export async function main() {
var _a;
// init cpu list
await (fetch('./data.json')
.then((response) => response.json())
.then((json) => cpuList = json));
highScore = (_a = localStorage.getItem("highScore_socket")) !== null && _a !== void 0 ? _a : 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();

View File

@ -1,41 +0,0 @@
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 {
constructor(highScoreStorageKey) {
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 = 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").toString());
}
}
resetScore() {
__classPrivateFieldSet(this, _Stats_score, 0, "f");
}
get highScore() {
return __classPrivateFieldGet(this, _Stats_highScore, "f");
}
get score() {
return __classPrivateFieldGet(this, _Stats_score, "f");
}
}
_Stats_score = new WeakMap(), _Stats_highScore = new WeakMap(), _Stats_highScoreStorageKey = new WeakMap();