// 地図の初期化 (山形県酒田市の中心に近い座標)
    const map = L.map('map').setView([38.9122, 139.8360], 13);
    const firebaseConfig = { /* ... Firebase設定のプレースホルダー ... */ };

    // 国土地理院の地図タイルレイヤーを追加
    L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
        attribution: '<a href="https://maps.gsi.go.jp/development/ichiran.html">国土地理院</a>',
        maxZoom: 18,
        minZoom: 5
    }).addTo(map);

    // ページ読み込み時の処理
    window.addEventListener('load', () => {
        loadSavedComments(); 
        setTimeout(() => {
            map.invalidateSize(); 
        }, 100); 
    });

    // マーカーを管理する配列。
    let markers = []; 

    // 地図をクリックしてマーカーと情報ウィンドウを追加
    map.on('click', (e) => {
        const { lat, lng } = e.latlng;
        addMarker(lat, lng);
    });

    // マーカーとコメント入力ウィンドウを追加
    function addMarker(lat, lng) {
        const marker = L.marker([lat, lng]).addTo(map);
        const popupContent = `
            <div class="info-window">
                <p>活動日記を入力してください:</p>
                <textarea id="comment" rows="3" style="width:100%;"></textarea>
                <button onclick="saveComment('${lat}', '${lng}')">保存</button>
            </div>
        `;
        marker.bindPopup(popupContent).openPopup();
    }

    // コメントを保存し、履歴に追加
    function saveComment(lat, lng) {
        const comment = document.getElementById("comment").value;
        const timestamp = new Date().toLocaleString();

        if (!comment.trim()) {
            alert("コメントを入力してください。");
            return;
        }

        const entry = { lat, lng, comment, timestamp };
        saveToLocalStorage(entry);  
        
        reloadComments(); // UIを再同期
    
   
    }

    // 保存されたコメントをロードして表示し、対応するマーカーも作成
    function loadSavedComments() {
        const comments = JSON.parse(localStorage.getItem('comments')) || [];
        
        markers.forEach(marker => map.removeLayer(marker)); 
        markers = []; 
        document.getElementById("comments-list").innerHTML = "";

        comments.forEach((entry, index) => {
            addCommentToHistory(entry, index); 
            
            const marker = L.marker([entry.lat, entry.lng]).addTo(map); 
            markers.push(marker); 
            
            marker.bindPopup(`
                <div class="info-window">
                    <p><strong>日時:</strong> ${entry.timestamp}</p>
                    <p><strong>コメント:</strong> ${entry.comment}</p>
                </div>
            `);
        });

        // コメントエントリにランダムな回転を適用（デザイン用）
        document.querySelectorAll('.history-entry').forEach((el) => {
            const rotation = (Math.random() * 2 - 1).toFixed(1); 
            el.style.setProperty('--rotation', rotation);
        });
    }

    // 履歴にコメント要素を動的に追加
    function addCommentToHistory({ lat, lng, comment, timestamp }, index) {
        const commentsList = document.getElementById("comments-list");
        const commentEntryDiv = document.createElement('div');
        commentEntryDiv.className = "history-entry";
        commentEntryDiv.setAttribute('data-index', index); 

        commentEntryDiv.innerHTML = `
            <p><strong>日時:</strong> ${timestamp}</p>
            <p><strong>場所:</strong> 緯度 ${lat}, 経度 ${lng}</p>
            <p><strong>活動日記:</strong> 
                <span class="comment-text" contenteditable="true" onblur="updateComment(${index}, this)">
                    ${comment}
                </span>
            </p>
            <button onclick="deleteComment(${index})">削除</button>
        `;
        commentsList.appendChild(commentEntryDiv);
    }

    // コメントを削除（対応するマーカーも同時に削除されるように修正）
    function deleteComment(index) {
        let comments = JSON.parse(localStorage.getItem('comments')) || [];

        if (markers[index]) {
            map.removeLayer(markers[index]);
            markers.splice(index, 1); 
        }

        comments.splice(index, 1);
        localStorage.setItem('comments', JSON.stringify(comments));

        reloadComments(); // UIを再同期
    }

    // コメントを直接編集し保存する
    function updateComment(index, element) {
        let comments = JSON.parse(localStorage.getItem('comments')) || [];
        const newComment = element.textContent.trim(); 

        if (!newComment) {
            alert("コメントは空白にできません。元の内容に戻します。");
            element.textContent = comments[index].comment; 
            return;
        }

        comments[index].comment = newComment;
        localStorage.setItem('comments', JSON.stringify(comments)); 
        
        reloadComments(); // UIを再同期
    }

    // コメント履歴とマーカーを完全にリロードして同期させる関数
    function reloadComments() {
        loadSavedComments(); 
    }