// ----------------------------
// Supabase 設定
// ----------------------------
const supabaseUrl = "https://ogtlmtnjkpsxsqzqlacj.supabase.co"; // Project URL
const supabaseKey = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im9ndGxtdG5qa3BzeHNxenFsYWNqIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NjMyOTU3NjUsImV4cCI6MjA3ODg3MTc2NX0.JnCE7oUQwrSgGqiu-QRbwnaLBZrO8JX1_RUb37VIMFI";                    // anon key
const supabase = supabaseJs.createClient(supabaseUrl, supabaseKey);

// ----------------------------
// URLパラメータ取得
// ----------------------------
const params = new URLSearchParams(location.search);
const GROUP = params.get("group") || "未設定";

// HTMLに表示
document.getElementById("groupName").textContent = GROUP;

// ----------------------------
// 地図初期化
// ----------------------------
const map = L.map("map").setView([35.0, 135.0], 15);

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

let userMarker = null;
let otherMarkers = [];

// ----------------------------
// 自分の現在位置取得
// ----------------------------
navigator.geolocation.getCurrentPosition(async pos => {
    const lat = pos.coords.latitude;
    const lng = pos.coords.longitude;

    // 自分のマーカー
    userMarker = L.marker([lat, lng]).addTo(map)
        .bindPopup(`自分<br>グループ: ${GROUP}`)
        .openPopup();

    // 地図を自分の位置へ移動
    map.setView([lat, lng], 15);

    // Supabase に保存
    await supabase.from("locations").insert({
        group_name: GROUP,
        lat: lat,
        lng: lng
    });

    // 他のユーザーの位置をロード
    loadOthers();
    setInterval(loadOthers, 3000);
});

// ----------------------------
// 他ユーザーの位置取得と表示
// ----------------------------
async function loadOthers() {
    const { data, error } = await supabase
        .from("locations")
        .select("*")
        .eq("group_name", GROUP)
        .order("updated_at", { ascending: false });

    if (error) {
        console.error(error);
        return;
    }

    // 古いマーカー削除
    otherMarkers.forEach(m => map.removeLayer(m));
    otherMarkers = [];

    // 自分以外を表示
    data.forEach(item => {
        // 自分の位置は表示済み
        if (userMarker && item.lat === userMarker.getLatLng().lat && item.lng === userMarker.getLatLng().lng) return;

        const marker = L.marker([item.lat, item.lng])
            .addTo(map)
            .bindPopup(`メンバー<br>グループ: ${item.group_name}`);
        otherMarkers.push(marker);
    });
}