50 lines
1.2 KiB
HTML
50 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="it">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Sites Dashboard</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
<h1>Sites Dashboard</h1>
|
|
<div id="grid" class="grid"></div>
|
|
|
|
<script type="module">
|
|
async function loadSites() {
|
|
// carica sites.json dalla cartella superiore
|
|
const res = await fetch("./sites.json");
|
|
const sites = await res.json();
|
|
|
|
const grid = document.getElementById("grid");
|
|
grid.innerHTML = "";
|
|
|
|
sites.forEach(site => {
|
|
const card = document.createElement("div");
|
|
card.className = "card";
|
|
|
|
const img = document.createElement("img");
|
|
img.src = site.icon; // già completo
|
|
img.alt = site.name;
|
|
|
|
const title = document.createElement("div");
|
|
title.className = "title";
|
|
title.textContent = site.name;
|
|
|
|
card.appendChild(img);
|
|
card.appendChild(title);
|
|
|
|
// 👉 aggiungi click handler
|
|
card.addEventListener("click", () => {
|
|
// cambia l'iframe che contiene la dashboard
|
|
window.parent.document.getElementById("contentFrame").src = `/${site.dir}`;
|
|
});
|
|
|
|
|
|
grid.appendChild(card);
|
|
});
|
|
}
|
|
|
|
loadSites();
|
|
</script>
|
|
</body>
|
|
</html>
|