/*
 *  @vars
 */
var gsearchObj;
var mapObj;
var resultObj;

var defaultLatitude = 35.471304;
var defaultLongitude = 139.627364;
var defaultZoomLevel = 10;
var cityZoomLevel    = 12;
var shopZoomLevel    = 14;
/*
 *  on Load Google Map
 */
function onLoadPrepareGoogleMap( setMapMethod, shopId )
{
    /*
     *  Google AJAX Search API
     */
    gsearchObj = new GlocalSearch();
    /*
     *  set Callback function
     */
    gsearchObj.setSearchCompleteCallback(null, onLocalSearch);
    /*
     *  set icon
     */
    var iconObj = new GIcon();
    iconObj.image = "/img/paseos_pin.gif";
    iconObj.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
    iconObj.iconSize = new GSize(35, 48);
    iconObj.shadowSize = new GSize(22, 20);
    iconObj.iconAnchor = new GPoint(35, 48);
    iconObj.infoWindowAnchor = new GPoint(5, 1);      
    
    /*
     *  Google MAP API
     */
    mapObj = new GMap2(document.getElementById("dispMap"));
    mapObj.setCenter(new GLatLng(defaultLatitude, defaultLongitude), defaultZoomLevel);
    mapObj.addControl(new GOverviewMapControl());
	mapObj.addControl(new GLargeMapControl());
	mapObj.addControl(new GMapTypeControl());
	mapObj.addControl(new GScaleControl());
    
    /*
     *  add Events
     */
    GEvent.addListener( mapObj, 'click', onMapClick );
    GEvent.addListener( mapObj, 'dblclick', onMapDoubleClick );
    GEvent.addListener( mapObj, 'dragstart', onMapDragStart );

    /*
     *  set map
     */
    switch( setMapMethod ){
        case 'prefecture':
            setPrefecture();
            break;
        case 'city':
            setCity();
            break;
        case 'detail':
            setShopDetail( shopId );
            break;
        default:
            break;
    }

    // Download the data in data.xml and load it on the map. The format we
    // expect is:
    // <markers>
    //   <marker lat="37.441" lng="-122.141"/>
    //   <marker lat="37.322" lng="-121.213"/>
    // </markers>
    GDownloadUrl(
        "/shop_list_xml", 
        function(data) {
            var xml = GXml.parse(data);
            var shops = xml.documentElement.getElementsByTagName("shop");
            for ( var i = 0; i < shops.length; i++ ) {
                var pointObj = new GLatLng(
                                parseFloat( shops[i].getAttribute("lat") ),
                                parseFloat( shops[i].getAttribute("lng") )
                );
                markerObj = createMarker( pointObj, iconObj, shops[i] )
                mapObj.addOverlay( markerObj );
            }
        }
    );

}

/*
 *  craete marker
 */
function createMarker(pointObj, iconObj, shopObj )
{
	// make marker
	var markerObj = new GMarker(pointObj, iconObj);

	// add event listener
	GEvent.addListener(
        markerObj, 
        'click', 
        function() {
            showDetail();
			markerObj.openInfoWindowHtml( shopObj.getAttribute("info") );
            mapObj.setZoom(shopZoomLevel);
            HTML_AJAX.replace('shopDetail', '/shop_detail/' + shopObj.getAttribute("id"));
        }
    );

	return markerObj;
}


/* 
 *  search prefecture
 */
function onChangePrefecture()
{
    // get cities
    HTML_AJAX.replace('cities', '/shop_city/default/' + document.forms[0].elements['prefecture'].value );
//    setPrefecture();
}

/* 
 *  set prefecture
 */
function setPrefecture()
{
    // get shops
//    HTML_AJAX.replace('shopListPart', '/shop_list_part/'+ document.forms[0].elements['prefecture'].value);
    prefIndex = document.forms[0].elements['prefecture'].selectedIndex;
    prefecture = document.forms[0].elements['prefecture'].options[prefIndex].text;
    gsearchObj.execute( prefecture );
    // set zoom
    mapObj.setZoom(defaultZoomLevel);
}
/*
 *  search city
 */
function onChangeCity()
{
    setCity();
}
/*
 *  set city
 */
function setCity()
{
    prefIndex = document.forms[0].elements['prefecture'].selectedIndex;
    prefecture = document.forms[0].elements['prefecture'].options[prefIndex].text;
//console.debug( prefecture );
    cityIndex = document.forms[0].elements['city'].selectedIndex;
    city = document.forms[0].elements['city'].options[cityIndex].text;
//console.debug( city );
    // get shops
//    HTML_AJAX.replace('shopListPart', '/shop_list_part/'+ document.forms[0].elements['prefecture'].value + '/' +document.forms[0].elements['city'].value);

    gsearchObj.execute( prefecture + city );
    // set zoom
    mapObj.setZoom( cityZoomLevel );
}
/*
 *  set shop detail
 */
function setShopDetail( id )
{
    onClickShopDetail( id );
}
/*
 *  on click shop detail
 */
function onClickShopDetail( id )
{
    GDownloadUrl(
        "/shop_list_xml/detail/" + id, 
        function(data) {
            var xml = GXml.parse(data);
            var shops = xml.documentElement.getElementsByTagName("shop");
            for ( var i = 0; i < shops.length; i++ ) {
                HTML_AJAX.replace('shopDetail', '/shop_detail/' + id);
                mapObj.setCenter(new GLatLng(shops[i].getAttribute("lat"), shops[i].getAttribute("lng")), shopZoomLevel)
//                mapObj.panTo(new GLatLng(parseFloat( shops[i].getAttribute("lat") ), parseFloat( shops[i].getAttribute("lng"))  ));
//                mapObj.setZoom(shopZoomLevel);
//            	markerObj.openInfoWindowHtml( shops[i].getAttribute("info") );
// console.debug( parseFloat( shops[i].getAttribute("lat") ) );
//  console.debug( parseFloat( shops[i].getAttribute("lng") ) );
            }
        }
    );

    showDetail();
}

/*
 *  Callback function
 */
function onLocalSearch() {
    getGeocode();
}

/*
 *  get geocode
 */
function getGeocode()
{
    if (gsearchObj.results.length == 0) return;
    // get first result 
    resultObj = gsearchObj.results[0];
//console.debug( resultObj );
    // set geocode
    lat = parseFloat(resultObj.lat);
//console.debug( lat );
    lng = parseFloat(resultObj.lng);
//console.debug( lng );
    // move
    mapObj.panTo(new GLatLng(lat, lng));
}

/*
 *  on Map Click
 */
function onMapClick()
{
//    console.debug( 'onMapClick' );
}

/*
 *  on Map Double Click
 */
function onMapDoubleClick()
{
//    console.debug( 'onMapDoubleClick' );
    showList();
}

/*
 *  on Map Drag Start
 */
function onMapDragStart()
{
    showList();
}

/*
 *  on Marker Click
 */
function onMarkerClick( lat )
{
}

/*
 *  show list
 */
function showList()
{
    document.getElementById('shopDetail').style.display = 'none';
    document.getElementById('shopList').style.display = 'block';
    document.getElementById('newsList').style.display = 'block';
}

/*
 *  show detail
 */
function showDetail()
{
    document.getElementById('shopDetail').style.display = 'block';
    document.getElementById('shopList').style.display = 'none';
    document.getElementById('newsList').style.display = 'none';
}