<!DOCTYPE html>
<html lang="el">
<head>
<meta charset="UTF-8">
<title>Digital Advertising Board Greece</title>
<style>
body { background: #0a0a0a; color: white; font-family: 'Segoe UI', Arial, sans-serif; margin: 0; padding: 15px; height: 100vh; overflow: hidden; box-sizing: border-box; }
.grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 1fr); gap: 15px; height: 100%; }
.card { background: linear-gradient(145deg, #1e1e1e, #111); border: 1px solid #333; border-radius: 15px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px; text-align: center; box-shadow: 0 4px 15px rgba(0,0,0,0.5); }
.card img { max-width: 100%; max-height: 55%; border-radius: 10px; object-fit: cover; margin-bottom: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.3); }
.title { color: #FFD700; font-size: 1.3rem; font-weight: bold; margin-bottom: 5px; text-transform: uppercase; }
.price { color: #00FF7F; font-size: 1.1rem; font-weight: bold; background: rgba(0,255,127,0.1); padding: 2px 10px; border-radius: 5px; }
.empty { color: #666; font-size: 0.9rem; }
.empty b { color: #00aaff; font-size: 1.1rem; }
</style>
</head>
<body>
<div class="grid" id="content">Загрузка...</div>
<script>
const pubUrl = "https://docs.google.com/spreadsheets/d/e/2PACX-1vQkJg-ateJ916_iAnG4ZUigWnVAh5Rhm0j7wutgrkf2Kl71EIckZiuwcZ4rvs8qEqTqfFEJHwaMdyZc/pubhtml";
async function updateBoard() {
try {
const res = await fetch(pubUrl);
const htmlText = await res.text();
const parser = new DOMParser();
const doc = parser.parseFromString(htmlText, 'text/html');
const rows = Array.from(doc.querySelectorAll('tr')).slice(1); // Берем строки таблицы
let html = '';
for (let i = 0; i < 16; i++) {
const row = rows[i];
const cells = row ? Array.from(row.querySelectorAll('td')) : [];
// Ячейка 1 - Номер, 2 - Заголовок, 3 - Цена, 4 - Картинка
const title = cells[1] ? cells[1].innerText : "";
const price = cells[2] ? cells[2].innerText : "";
const img = cells[3] ? cells[3].innerText : "";
if (title && title.trim().length > 1) {
html += `
<div class="card">
<img src="${img || 'https://via.placeholder.com/300x200?text=No+Image'}">
<div class="title">${title}</div>
<div class="price">${price}</div>
</div>`;
} else {
html += `
<div class="card">
<div class="empty">Διαφημιστείτε εδώ<br><b>WhatsApp</b><br>+30 690 000 000</div>
</div>`;
}
}
document.getElementById('content').innerHTML = html;
} catch (e) {
console.error(e);
document.getElementById('content').innerHTML = "Ошибка связи с Google. Обновляем...";
}
}
updateBoard();
setInterval(updateBoard, 20000); // Обновление каждые 20 секунд
</script>
</body>
</html>