document.addEventListener('DOMContentLoaded', () => {
  const map = L.map('map').setView([38.9175, 139.8353], 16);

  L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '© OpenStreetMap contributors'
  }).addTo(map);

  fetch('snack2.csv')
    .then(response => response.text())
    .then(text => {
      const rows = text.split('\n').filter(row => row.trim());
      const headers = rows[0].split(',').map(h => h.trim());

      for (let i = 1; i < rows.length; i++) {
        const values = rows[i].split(',').map(v => v.replace(/^"|"$/g, '').trim());
        const data = {};
        headers.forEach((key, index) => data[key] = values[index] || '');

        const lat = parseFloat(data.latitude);
        const lng = parseFloat(data.longitude);
        if (isNaN(lat) || isNaN(lng)) continue;

        // 説明文を統合
        const description = [data.description1, data.description2, data.description3, data.mama]
          .filter(Boolean)
          .map(d => d.trim())
          .join('<br>');

        // 画像を2枚まで取得（なければデフォルト画像）
        const image1 = data.img1 && data.img1.trim() !== '' ? data.img1 : 'images/default.png';
        const image2 = data.img2 && data.img2.trim() !== '' ? data.img2 : null;

        // アイコン画像
        const iconPath = data.icon && data.icon.trim() !== '' ? data.icon : 'images/snack-icon.png';
        const customIcon = L.icon({
          iconUrl: iconPath,
          iconSize: [32, 32],
          iconAnchor: [16, 32],
          popupAnchor: [0, -32]
        });

        // ポップアップ内の画像HTMLを作成
        let imagesHtml = `<img src="${image1}"width="106" height="73"  style="cursor: pointer;" />`;
        if (image2) {
          imagesHtml += `<br> <img src="${image2}" width="106" height="73"  style="cursor: pointer;" />`;
        }

        const popupContent = `
          <div class="popup-content">
            <h3>${data.name.replace(/"$/, '')}</h3>
            <p>${description}</p>
            ${imagesHtml}
            <button onclick="addToFavorites('${data.name}')">行きたいお店リストに追加</button>
          </div>
        `;

        L.marker([lat, lng], { icon: customIcon }).addTo(map)
          .bindPopup(popupContent);
      }
    })
    .catch(error => {
      console.error('CSV読み込みエラー:', error);
    });
});

function addToFavorites(name) {
  alert(`${name} を行きたいリストに追加しました`);
}