//Leafletでの処理
function init(){
    //地図を表示するdiv要素のidを設定
    var map = L.map('mapcontainer');
    //座標の指定
    var mpoint = [38.7482, 139.9058];
    //地図の中心とズームレベルを指定
    map.setView(mpoint, 10);
    //表示するタイルレイヤのURLとAttributionコントロールの記述を設定して、地図に追加する
    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: '&copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors,'
    }).addTo(map);
    //地図に地点を表示する
    L.marker([38.5402753, 139.9758235],{title:"湯殿山神社大鳥居"}).addTo(map).on("click", () => {
        clickMarker("torii.html", "鳥居の色は何色？", "赤", "青", "黄", "a");
    });
    L.marker([38.89327,139.8188],{title:"東北公益文科大学"}).addTo(map).on("click", () => {
        clickMarker("koeki.html", "階段は何ヶ所あるか？", "0ヶ所", "1ヶ所", "2ヶ所", "b");
    });;
}
//マーカーの情報に切り替わる
function clickMarker(url, quiz, a, b, c, ans){
    document.getElementById("model").setAttribute("src", url);
    document.getElementById("quiz").innerHTML = quiz;
    document.getElementById("a").innerHTML = a;
    document.getElementById("b").innerHTML = b;
    document.getElementById("c").innerHTML = c;
    document.getElementById("result").innerHTML = "　";
    document.getElementById("answer").innerHTML = ans;
    document.getElementById("image1").setAttribute("src", "../image/img.png");
}
//解答の判定
function judgeAnswer(abc) {
    var select = document.getElementById(abc).value;
    var answer = document.getElementById("answer");
    if (select == answer.textContent) {
        document.getElementById("result").innerHTML = "正解!!";
        document.getElementById("result").setAttribute("class", "correct");
        document.getElementById("image1").setAttribute("src", "../image/koeki.png");
    } else {
        document.getElementById("result").innerHTML = "不正解…";
        document.getElementById("result").setAttribute("class", "incorrect");
    }
}
//選択肢がクリックされたときの処理
document.addEventListener("DOMContentLoaded", () => {
    document.getElementById("a").addEventListener("click", () => {
        judgeAnswer("a");
    });
    document.getElementById("b").addEventListener("click", () => {
        judgeAnswer("b");
    });
    document.getElementById("c").addEventListener("click", () => {
        judgeAnswer("c");
    });
});