diff --git a/game.js b/game.js index bcaee6c..bc1afea 100644 --- a/game.js +++ b/game.js @@ -76,7 +76,7 @@ function updateLayout() { document.getElementById("col2").style.backgroundColor = ""; } -function delay(time) { +export function delay(time) { return new Promise(resolve => setTimeout(resolve, time)); } diff --git a/gst.html b/gst.html index c14380b..8350f28 100644 --- a/gst.html +++ b/gst.html @@ -49,22 +49,22 @@
-
+
-
- +
- + +
+
diff --git a/gst.js b/gst.js index f1db796..04e96da 100644 --- a/gst.js +++ b/gst.js @@ -4,7 +4,7 @@ var currentCpu; var score; var highScore; -async function main() { +export async function main() { // init cpu list await (fetch('./data.json') .then((response) => response.json()) @@ -17,6 +17,8 @@ function nextRound() { currentCpu = getRandomCpu(); document.getElementById("cpuName").innerText = currentCpu.name; + + document.getElementById("mainCol").style.backgroundColor = ""; } function getRandomCpu() { @@ -32,6 +34,59 @@ function getRandomCpu() { } } +import { delay } from "./game"; + +export async function btnClick(typ) { + // 0 -> Desktop + // 1 -> Laptop + // 2 -> Mobile/Embedded + // remove bootstrap class + + let btnDesktop = document.getElementById("btnDesktop"); + let btnLaptop = document.getElementById("btnLaptop"); + let btnMobile = document.getElementById("btnMobile"); + + let btns = [btnDesktop, btnLaptop, btnLaptop]; + + btns.forEach( (el) => { + el.className = el.className.replace("bg-info", ""); + }) + + switch (typ) { + case 0: + btnDesktop.style.backgroundColor = "#FF4444"; + break; + case 1: + btnLaptop.style.backgroundColor = "#FF4444"; + break; + case 2: + btnMobile.style.backgroundColor = "#FF4444"; + break; + } + // make correct button green and wrong button red!!!! bg-success | bg-danger + + switch (currentCpu.type) { + case "Desktop": + btnDesktop.style.backgroundColor = "lightgreen"; + break; + case "Laptop": + btnLaptop.style.backgroundColor = "lightgreen"; + break; + case "Mobile/Embedded": + btnMobile.style.backgroundColor = "lightgreen"; + break; + } + + await delay(2000); + + btns.forEach( (el) => { + el.className = el.className + " bg-info"; + el.style.backgroundColor = ""; + }) + + nextRound(); +} + function getRandomInt(min, max) { min = Math.ceil(min); max = Math.floor(max);