'; return html; } function slug(name){ return name.toLowerCase().replace(/[^a-z0-9]+/g,'-'); } function cuisineIcon(cuisine){ const c = cuisine.toLowerCase(); if(c.includes('seafood') || c.includes('raw bar')) return '🦞'; if(c.includes('steak')) return '🥩'; if(c.includes('italian') || c.includes('pizza')) return '🍝'; if(c.includes('mexican')) return '🌮'; if(c.includes('breakfast')) return '🥞'; if(c.includes('bakery') || c.includes('dessert')) return '🍦'; if(c.includes('sushi')) return '🍣'; if(c.includes('chinese')) return '🥡'; if(c.includes('bbq')) return '🍖'; if(c.includes('irish') || c.includes('pub') || c.includes('brewery')) return '🍺'; if(c.includes('mediterranean')) return '🥙'; if(c.includes('acai') || c.includes('smoothie')) return '🍧'; if(c.includes('cruise')) return '🛥️'; return '🌺'; } // Build cuisine filter options const cuisineSet = Array.from(new Set(restaurants.map(r=>r.cuisine))).sort(); const cuisineFilter = document.getElementById('cuisineFilter'); cuisineFilter.innerHTML = '' + cuisineSet.map(c=>``).join(''); const listEl = document.getElementById('list'); const searchInput = document.getElementById('searchInput'); const areaFilter = document.getElementById('areaFilter'); const statusFilter = document.getElementById('statusFilter'); const emptyMsg = document.getElementById('emptyMsg'); const countLine = document.getElementById('countLine'); function render(){ const q = searchInput.value.trim().toLowerCase(); const cuisine = cuisineFilter.value; const area = areaFilter.value; const status = statusFilter.value; const filtered = restaurants.filter(r=>{ const key = slug(r.name); const isVisited = !!visited[key]; if(q){ const hay = (r.name + ' ' + r.cuisine + ' ' + r.dishes).toLowerCase(); if(!hay.includes(q)) return false; } if(cuisine !== 'all' && r.cuisine !== cuisine) return false; if(area !== 'all' && r.area !== area) return false; if(status === 'visited' && !isVisited) return false; if(status === 'unvisited' && isVisited) return false; return true; }); filtered.sort((a,b)=>a.name.localeCompare(b.name)); listEl.innerHTML = ''; emptyMsg.style.display = filtered.length ? 'none' : 'block'; countLine.textContent = `Showing ${filtered.length} of ${restaurants.length} restaurants`; filtered.forEach(r=>{ const key = slug(r.name); const isVisited = !!visited[key]; const card = document.createElement('div'); const isGoodland = r.area === 'Goodland'; card.className = 'card' + (isVisited ? ' visited' : '') + (isGoodland ? ' goodland-card' : ''); const mapsUrl = 'https://www.google.com/maps/search/?api=1&query=' + encodeURIComponent(r.name + ' ' + r.address); const phoneHtml = r.phone ? ` · ${r.phone}` : ''; card.innerHTML = ` `; card.querySelector('input').addEventListener('change', (e)=>{ if(e.target.checked){ visited[key] = true; } else { delete visited[key]; } save(); render(); }); card.querySelectorAll('.star').forEach(starEl=>{ starEl.addEventListener('click', (e)=>{ const value = parseInt(e.target.getAttribute('data-value'), 10); if(ratings[key] === value){ delete ratings[key]; } else { ratings[key] = value; } saveRatings(); render(); }); }); listEl.appendChild(card); }); } searchInput.addEventListener('input', render); cuisineFilter.addEventListener('change', render); areaFilter.addEventListener('change', render); statusFilter.addEventListener('change', render); document.getElementById('resetBtn').addEventListener('click', ()=>{ if(confirm('Clear all visited checkmarks?')){ visited = {}; save(); render(); } }); render();