// ============================================================
// Sabor Flow Da Nang — main.js
// Update SCHEDULE array monthly when the weekly program changes.
// ============================================================
const SCHEDULE = [
{ day: 'Monday', venue: 'Webe Coffee', social: 'BOM', music: '8 Bachata · 1 Salsa · 1 Kizomba', city: 'Da Nang', organizer: 'Luu Phuong & Shai', mapUrl: 'https://maps.app.goo.gl/jvaQgcNt4doYwZ2N7' },
{ day: 'Tuesday', venue: 'La Riva', social: 'Latino Dancing', music: '2 Salsa · 2 Bachata · 2 Kizomba', city: 'Hoi An', organizer: 'David Tavares', mapUrl: 'https://www.google.com/maps/search/?api=1&query=La+Riva+An+Bang+Hoi+An+Vietnam' },
{ day: 'Tuesday', venue: 'Caliz Bar', social: 'Sensual Night', music: '3 Bachata · 2 Salsa · 2 Kizomba', city: 'Da Nang', organizer: 'Daisy Nguyen', mapUrl: 'https://www.google.com/maps/place/C%C3%A1liz+Wine+Bar/@16.0485026,108.2470699,17z' },
{ day: 'Wednesday', venue: 'Ket Fai Bar', social: 'Bachata Kiz Night', music: 'Kizomba 19:30 · Bachata 21:00', city: 'Da Nang', organizer: 'Sean Kim', mapUrl: 'https://www.google.com/maps/search/?api=1&query=Ket+Fai+Bar+Da+Nang+Vietnam' },
{ day: 'Thursday', venue: 'Malibu', social: 'Salsa Nights', music: '2 Salsa · 2 Bachata', city: 'Da Nang', organizer: 'Lucho Giraldes', mapUrl: 'https://www.google.com/maps/search/?api=1&query=Malibu+Beach+Club+Da+Nang+Vietnam' },
{ day: 'Friday', venue: 'An Thuong By Night', social: 'Dance Unity Party', music: '2 Salsa · 2 Bachata · 2 Kizomba', city: 'Da Nang', organizer: 'Nadiya Yagfarova', mapUrl: 'https://www.google.com/maps/search/?api=1&query=An+Thuong+Tourist+Street+Da+Nang+Vietnam' },
{ day: 'Saturday', venue: 'La Riva', social: 'Latino Dancing', music: '2 Salsa · 2 Bachata · 2 Kizomba', city: 'Hoi An', organizer: 'David Tavares', mapUrl: 'https://www.google.com/maps/search/?api=1&query=La+Riva+An+Bang+Hoi+An+Vietnam' },
{ day: 'Saturday', venue: 'An Thuong By Night', social: 'Bachata Party', music: 'Only Bachata', city: 'Da Nang', organizer: 'Vaclav & Kseniya', mapUrl: 'https://www.google.com/maps/search/?api=1&query=An+Thuong+Tourist+Street+Da+Nang+Vietnam' },
{ day: 'Sunday', venue: 'Last Call', social: 'Latin Dance Social', music: '3 Bachata · 2 Salsa', city: 'Da Nang', organizer: 'Vaclav & Kseniya', mapUrl: 'https://www.google.com/maps/search/?api=1&query=Last+Call+Bar+Da+Nang+Vietnam' },
{ day: 'Sunday', venue: 'Corner Bar', social: 'Sunday Latin', music: '3 Bachata · 2 Salsa · 3 Kizomba', city: 'Da Nang', organizer: 'Daisy Nguyen', mapUrl: 'https://www.google.com/maps/search/?api=1&query=Corner+Bar+Da+Nang+Vietnam' },
];
// ---- Navigation ----
function initNav() {
const hamburger = document.getElementById('hamburger');
const navLinks = document.getElementById('nav-links');
if (!hamburger || !navLinks) return;
hamburger.addEventListener('click', () => {
const isOpen = navLinks.classList.toggle('open');
hamburger.setAttribute('aria-expanded', String(isOpen));
});
navLinks.querySelectorAll('a').forEach(link => {
link.addEventListener('click', () => navLinks.classList.remove('open'));
});
}
// ---- Schedule: full table ----
function renderScheduleTable() {
const tbody = document.getElementById('schedule-tbody');
if (!tbody) return;
tbody.innerHTML = SCHEDULE.map(row => `
|
${row.day}
|
${row.mapUrl
? `${row.venue}`
: row.venue}
|
${row.social} |
${row.music} |
${row.city} |
${row.organizer} |
`).join('');
}
// ---- Home: "Coming up this week" teaser (3 events starting from today) ----
function renderScheduleTeaser() {
const container = document.getElementById('schedule-teaser');
if (!container) return;
const DAYS = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
const today = DAYS[new Date().getDay()];
const startIdx = DAYS.indexOf(today);
const order = [...DAYS.slice(startIdx), ...DAYS.slice(0, startIdx)];
const sorted = [...SCHEDULE].sort(
(a, b) => order.indexOf(a.day) - order.indexOf(b.day)
);
container.innerHTML = sorted.slice(0, 3).map(row => `
${row.day}
${row.social}
@ ${row.venue}
${row.music} · ${row.city}
`).join('');
}
// ---- Filter pills (studios.html / classes.html) ----
function initFilters() {
const pills = document.querySelectorAll('.filter-pill');
if (!pills.length) return;
pills.forEach(pill => {
pill.addEventListener('click', () => {
pills.forEach(p => p.classList.remove('active'));
pill.classList.add('active');
const filter = pill.dataset.filter;
document.querySelectorAll('.filterable-card').forEach(card => {
if (filter === 'all') {
card.classList.remove('hidden');
} else {
const styles = (card.dataset.styles || '')
.split(',')
.map(s => s.trim().toLowerCase());
card.classList.toggle('hidden', !styles.includes(filter));
}
});
});
});
}
// ---- Init ----
document.addEventListener('DOMContentLoaded', () => {
initNav();
renderScheduleTable();
renderScheduleTeaser();
initFilters();
});