diff --git a/index.html b/index.html
index aebc047..db774b1 100644
--- a/index.html
+++ b/index.html
@@ -89,7 +89,6 @@
wrapper.style.marginTop = "12px";
wrapper.className = "car-block";
- // --- elementen ---
const carSelect = document.createElement("select");
carSelect.className = "car-select";
@@ -108,16 +107,14 @@
wrapper.appendChild(img);
carList.appendChild(wrapper);
- // --- cars ophalen ---
const url = '/cars';
const res = await fetch(url);
const data = await res.json();
- const cars = data.cars; // array met cars
+ const cars = data.cars;
console.log(cars);
- // cars inladen
cars.forEach(car => {
let o = document.createElement("option");
o.value = car.name; // of car.id
@@ -125,7 +122,6 @@
carSelect.appendChild(o);
});
- // --- helper: laad skins voor de geselecteerde car ---
function loadSkins(carName) {
const car = cars.find(c => c.name === carName);
skinSelect.innerHTML = "";
@@ -137,27 +133,23 @@
skinSelect.appendChild(o);
});
- // direct de eerste skin tonen
+ // show first stkin
try {
updateImage(car.skins[0].image);
} catch (e) {
- console.warn("No image for skin " + car.skins[0].name);
updateImage("");
}
}
- // --- helper: update image ---
function updateImage(imgPath) {
img.src = imgPath;
}
- // --- event: auto veranderen ---
carSelect.addEventListener("change", () => {
const selectedCar = carSelect.value;
loadSkins(selectedCar);
});
- // --- event: skin veranderen ---
skinSelect.addEventListener("change", () => {
const selectedCar = carSelect.value;
const selectedSkin = skinSelect.value;
@@ -168,12 +160,11 @@
try{
updateImage(cfg.image);
} catch (e) {
- console.warn("No image for skin " + selectedSkin);
updateImage("");
}
});
- // laad skins voor de eerste auto direct
+ // immediately load skins for first car
loadSkins(cars[0].name);
}