//<![CDATA[

var BASE_URL = "http://www.repairnavi.net/";
var GMAP_FILE = "map/gmap.xml";
var ICON_DEFAULT = "images/common/icon_gmap_clothing.png";
var ICON_SHADOW = "images/common/icon_gmap_shadow.png";

var map;
var baseicon;
var xmlHttp;

function init() {

    map      = new GMap(document.getElementById("map")); // 地図オブジェクトを生成
    baseicon = new GIcon();  // アイコンオブジェクトを作成
    xmlHttp  = GXmlHttp.create(); // XmlHttpRequest オブジェクトを作成

    // 地図を設定
    map.addControl(new GLargeMapControl()); // 拡大縮小のボタン
    map.addControl(new GMapTypeControl());  // 地図と衛星の切り替え
    map.centerAndZoom(new GPoint(137.329102, 37.857507), 12); // ベイエリアを表示
    
    // アイコンを設定
    baseicon.image            = BASE_URL + ICON_DEFAULT;
    baseicon.shadow           = BASE_URL + ICON_SHADOW;
    baseicon.iconSize         = new GSize (22, 22);
    baseicon.shadowSize       = new GSize (34, 20);
    baseicon.iconAnchor       = new GPoint( 11,  22);  // <- (icon_width / 2, icon_height)
    baseicon.infoWindowAnchor = new GPoint( 9,  2);
    baseicon.infoShadowAnchor = new GPoint(18, 25);
    
    // マーカーを設定: XML データを読み込んで表示
    xmlHttp.open("GET", BASE_URL + GMAP_FILE,  true);
    xmlHttp.onreadystatechange = showMarkers;
    xmlHttp.send(null); 
}

function showMarkers() {

    if (xmlHttp.readyState == 4) {

        var xmlDoc = xmlHttp.responseXML;
        var marker = xmlDoc.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < marker.length; i++) {
            addMarker(marker[i]);
        } // End of for
    }
}

function addMarker(xml) {

    var point  = new GPoint(xml.getAttribute("lng"),
                            xml.getAttribute("lat"));
    baseicon.image = BASE_URL + xml.getAttribute("icon");
    var icon   = new GIcon(baseicon);
    var marker = new GMarker(point, icon);
    map.addOverlay(marker);
    var html   = '<div id="InfoWindow">'
               + '<img src="' + baseicon.image + '" alt="icon" class="imgLeft"> '
               + '<strong><a href="' + xml.getAttribute("site") + '">'
               + xml.getAttribute("name")
               + '</a></strong><br />'
               + xml.getAttribute("city") + '<br />'
               + xml.getAttribute("phone")  + '<br />'
               + '<!--<a href="' + BASE_URL + xml.getAttribute("link") + '">'
               + 'レビューを読む'
               + '</a><br />-->'
               + '</div>';
    GEvent.addListener(marker, "click", function() {
    //  marker.showMapBlowup(3);  // 吹き出しに地図が表示される模様。
    //  map.centerAndZoom(p, 3);
        marker.openInfoWindowHtml(html);
    });  // click のイベントリスナ登録
}
//]]>
