var gmap;
var currentMarker;
var mapcircle;
var tracing = false;
var traceControlBtn;
var shopMarkers = [];
var shopInfoWindows = [];
var isGeoPermitted = true;


async function initMap(){
    return new Promise(resolve =>{
        if (! navigator.geolocation) { isGeoPermitted=false; resolve(); }
        if(gmap){isGeoPermitted=false; resolve();}

        var currentPos = new google.maps.LatLng(AREA["A01"].lat, AREA["A01"].lon);

        gmap = new google.maps.Map($('#map').get(0), {
            center: currentPos,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            zoom: 17,
            disableDefaultUI: true
        });
        gmap.addListener( "drag", function () {
            changeTraceMode("off");
        } ) ;


        for(idx in MCNT_LIST){
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(MCNT_LIST[idx].LATI, MCNT_LIST[idx].LONGI),
                map: gmap,
            });
            shopInfoWindows.push(
                infoWindow({
                    "shopname":MCNT_LIST[idx].MCNT_NM,
                    "description" : MCNT_LIST[idx].DESC_CTNT,
                    "address" : MCNT_LIST[idx].ADDR,
                    "url" : MCNT_LIST[idx].HPG_URL,
                    "tel" : MCNT_LIST[idx].TEL_NO,
                    "imgurl" : MCNT_LIST[idx].IMG_URL
                })
            );
            marker.addListener("click", (function(idx){
                return function(){
                    shopInfoWindows.forEach(shopInfoWindow => {
                        shopInfoWindow.close();
                    });
                    shopInfoWindows[idx].open(gmap, shopMarkers[idx]);
                }
            })(idx),false);
    
            shopMarkers.push(marker);
        }

        
        navigator.geolocation.getCurrentPosition(
            function(pos) { 
                gmap.controls[google.maps.ControlPosition.TOP_LEFT].push(traceControl());
                var gpsPos = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);

                // 誤差を円で描く
                mapcircle = new google.maps.Circle({
                    map: gmap,
                    center: gpsPos,
                    radius: pos.coords.accuracy, // 単位はメートル
                    strokeColor: '#0088ff',
                    strokeOpacity: 0.8,
                    strokeWeight: 1,
                    fillColor: '#0088ff',
                    fillOpacity: 0.2
                });
                currentMarker = new google.maps.Marker({
                    position: gpsPos
                });
                currentMarker.setMap(gmap);
                changeTraceMode("off");
                setInterval(updateMap,200);
                resolve();
             },
            function() { isGeoPermitted = false; resolve();}
        );
    });
}

async function initMap2(){
    return new Promise(resolve =>{
        if(gmap){isGeoPermitted=false; resolve(false);}

        if (! navigator.geolocation) { isGeoPermitted=false; resolve(false); }

        navigator.geolocation.getCurrentPosition(function(pos) {
            var currentPos = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);

            gmap = new google.maps.Map($('#map').get(0), {
                center: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude),
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                zoom: 17,
                disableDefaultUI: true
            });
            gmap.controls[google.maps.ControlPosition.TOP_LEFT].push(traceControl());
            gmap.addListener( "drag", function () {
                changeTraceMode("off");
            } ) ;
            // 誤差を円で描く
            mapcircle = new google.maps.Circle({
                map: gmap,
                center: currentPos,
                radius: pos.coords.accuracy, // 単位はメートル
                strokeColor: '#0088ff',
                strokeOpacity: 0.8,
                strokeWeight: 1,
                fillColor: '#0088ff',
                fillOpacity: 0.2
            });
            currentMarker = new google.maps.Marker({
                position: currentPos
            });
            currentMarker.setMap(gmap);

            for(idx in MCNT_LIST){
                var marker = new google.maps.Marker({
                    position: new google.maps.LatLng(MCNT_LIST[idx].LATI, MCNT_LIST[idx].LONGI),
                    map: gmap,
                });
                shopInfoWindows.push(
                    infoWindow({
                        "shopname":MCNT_LIST[idx].MCNT_NM,
                        "description" : MCNT_LIST[idx].DESC_CTNT,
                        "address" : MCNT_LIST[idx].ADDR,
                        "url" : MCNT_LIST[idx].HPG_URL,
                        "tel" : MCNT_LIST[idx].TEL_NO,
                        "imgurl" : MCNT_LIST[idx].IMG_URL
                    })
                );
                marker.addListener("click", (function(idx){
                    return function(){
                        shopInfoWindows.forEach(shopInfoWindow => {
                            shopInfoWindow.close();
                        });
                        shopInfoWindows[idx].open(gmap, shopMarkers[idx]);
                    }
                })(idx),false);
        
                shopMarkers.push(marker);
            }

            changeTraceMode("off");
            setInterval(updateMap,200);
            resolve(true);

        }, function() {
            // gps 取得失敗
            //$('#gmap').text('GPSデータを取得できませんでした');
            isGeoPermitted=false; resolve(false);
        });
    });
}

function updateMap(){

    if (!isGeoPermitted) { return false; }

    navigator.geolocation.getCurrentPosition(function(pos) {
        // 現在位置にピンをたてる
        var currentPos = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);
        
        if(tracing){
        // 現在地にスクロールさせる
            mapcircle.setCenter( currentPos );
            currentMarker.setPosition( currentPos );
            gmap.panTo(currentPos);
        }

    }, function() {
        // gps 取得失敗
        //$('#gmap').text('GPSデータを取得できませんでした');
        return false;
    });
}

function pointShops(defaultLat=null, defaultLon=null, defaultZoom=null){
    changeTraceMode("off");
    gmap.setZoom(defaultZoom);
    gmap.panTo( new google.maps.LatLng(defaultLat, defaultLon) );
}

function infoWindow(data){
    var contentString = "";
    var shop_desc = data.description;
    var CR = String.fromCharCode(13);
    var LF = String.fromCharCode(10);
    
    if(FUNCKEY == "V00A010B001S0005FSC001"){
        if(data.description.indexOf('¥--'+CR+LF) != -1 ){
            var s = data.description.split('¥--'+CR+LF);
            var ss = s[1].split(CR+LF+"--¥");
            shop_desc = ss[0];
        }
    }
    if(FUNCKEY == "V00A010B001S0005FSC002"){
        if(data.description.indexOf('#--'+CR+LF) != -1 ){
            var s = data.description.split('#--'+CR+LF);
            var ss = s[1].split(CR+LF+'--#');
            shop_desc = ss[0];
        }
    }
    

    contentString += "<div class='map-info-window-box'>";
    contentString += "  <div class='shop-name'>" + data.shopname + "</div>";
    contentString += "  <div class='shop-address'>" + data.address + "</div>";
    contentString += "  <div class='shop-img-desc'><img src='" + data.imgurl + "'>";
    contentString += "  <p>" + shop_desc + "</p></div>";
    if(data.tel != "" && data.tel != null){ contentString += "  <div class='shop-tel'><a href='tel:" + data.tel + "'>電話する</a></div>"; }
    if(data.url != "" && data.url != null){ contentString += "  <div class='shop-www'><a href='" + data.url + "' target='_blank'>ウェブサイトを開く</a></div>"; }
    contentString += "</div>";

    return new google.maps.InfoWindow({
        content: contentString,
    });    
}

function traceControl(){
    
    // Set CSS for the control border.
    traceControlBtn = document.createElement("div");
    traceControlBtn.classList.add("map-trace-box");
    traceControlBtn.innerHTML = "現在地";
    traceControlBtn.addEventListener("click", () => {
        changeTraceMode("toggle");
    });
    return traceControlBtn;
}

function changeTraceMode(mode){
    if (!isGeoPermitted) { return false; }
    if(mode == "off"){
        traceControlBtn.classList.add("map-trace-box-off");
        traceControlBtn.classList.remove("map-trace-box-on");
        tracing = false;
        return;
    }
    if(mode == "on"){
        traceControlBtn.classList.add("map-trace-box-on");
        traceControlBtn.classList.remove("map-trace-box-off");
        tracing = true;
        return;
    }
    if(mode == "toggle"){
        if(tracing){
            traceControlBtn.classList.add("map-trace-box-off");
            traceControlBtn.classList.remove("map-trace-box-on");
            tracing = false;    
        }else{
            traceControlBtn.classList.add("map-trace-box-on");
            traceControlBtn.classList.remove("map-trace-box-off");
            tracing = true;
        }
        return;
    }
}