var map;
var markers;
var imgDir = "/images/"

var SEARCH_ACCOMS_WITH_ADDRESS = "SEARCH_ACCOMS_WITH_ADDRESS";
var SEARCH_ACCOMS_WITH_CODES = "SEARCH_ACCOMS_WITH_CODES";
	
function recenter() {
    var lat = document.getElementById("lat");
    var lng = document.getElementById("lng");

    if (lat != null && lat.value != "" && lng != null && lng.value != "") {
        map.panTo(new GLatLng(lat.value, lng.value));
    }
}

function chooseHotel(index, maxResultPerPage) {
    var lat = document.getElementById("lat" + index);
    var lng = document.getElementById("lng" + index);

    if (lat != null && lat.value != "" && lng != null && lng.value != "") {
        var latLng = new GLatLng(lat.value, lng.value);
        
        map.panTo(latLng);
        map.openInfoWindow(latLng, getInfoContentHTML(index));
    }
    location.href="#mapview";
}

function getInfoTitleHTML(resultId) {
    var infoTitleHTML = null;
    try {
        var infoTitleHTMLTemplate = document.getElementById('infoTitleHTMLTemplate_' + resultId);
        infoTitleHTML = infoTitleHTMLTemplate.innerHTML;
        
        showcellandhideother(resultId);
    } catch (error) {
    }
    return infoTitleHTML;
}

function getBaseMarkerTitle(){
	var name = "";
	var searchType = document.getElementById("searchType");
	if (searchType != null){
		if (SEARCH_ACCOMS_WITH_ADDRESS == searchType.value){
			var poiAddress = document.getElementById("poiAddress");
			if (poiAddress != null){
				name = poiAddress.value;	
			}
		}else if(SEARCH_ACCOMS_WITH_CODES == searchType.value){
			var poiName = document.getElementById("poiName");
			if (poiName != null){
				name = poiName.value;	
			}
		}
	}
	return name;
}

function getInfoContentHTML(resultId) {
    var infoContentHTML = null;
    try {
        var infoContentHTMLTemplate = document.getElementById('infoContentHTMLTemplate_' + resultId);
        infoContentHTML = infoContentHTMLTemplate.innerHTML;
        
        showcellandhideother(resultId);
    } catch (error) {
    }
    return infoContentHTML;
}

function getLetterByNumber(nb) {
    var letter = String.fromCharCode("A".charCodeAt(0) + nb - 1);
    return letter;
}

function createIcon() {
	// Create a base icon for all of our markers that specifies the
    // shadow, icon dimensions, etc.
    var baseIcon = new GIcon();
    baseIcon.iconSize = new GSize(32, 32);
    baseIcon.shadowSize = new GSize(32, 32);
    baseIcon.iconAnchor = new GPoint(16, 16);
    baseIcon.infoWindowAnchor = new GPoint(16, 16);

    // Create a lettered icon for this point using our icon class
    return new GIcon(baseIcon);
}

function createMarker(point, index) {
	var onRequest = document.getElementById('onRequest' + index).value;
	var gicon = createIcon();
    
   
    gicon.image = imgDir + "picto_carte/picto" + index + ".png";

    // Set up our GMarkerOptions object
    markerOptions = {
        icon :gicon
    };
    var marker = new GMarker(point, markerOptions);

    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(getInfoContentHTML(index));
    });

    return marker;
}

function createBaseMarker(point) {
    
    var baseIcon = new GIcon();
    baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
    baseIcon.iconSize = new GSize(20, 34);
    baseIcon.shadowSize = new GSize(37, 34);
    baseIcon.iconAnchor = new GPoint(9, 34);
    baseIcon.infoWindowAnchor = new GPoint(9, 2);

    // Create a lettered icon for this point using our icon class
    var letteredIcon = new GIcon(baseIcon);
    letteredIcon.image = "http://www.google.com/mapfiles/marker.png";
    
    
    // Set up our GMarkerOptions object
    var currentTitle= getBaseMarkerTitle();
    markerOptions = {
        icon :letteredIcon,
        title:currentTitle
    };
    var marker = new GMarker(point, markerOptions);
    
    if (currentTitle != null && currentTitle.length > 0){
	    GEvent.addListener(marker, "click", function() {
	        marker.openInfoWindowHtml(currentTitle);
	    });
    }

    return marker;
}

function loadGoogleMap() {
    if (GBrowserIsCompatible()) {
        var mapWindowDiv = document.getElementById("mapWindow");

        if (mapWindowDiv != null) {
            map = new GMap2(mapWindowDiv);
            var lat = document.getElementById("lat");
            var lng = document.getElementById("lng");
            
            if (lat != null && lat.value != "" && lng != null && lng.value != "") {
                var point = new GLatLng(lat.value, lng.value);
            	var POImarker = createBaseMarker(point);
            	map.addOverlay(POImarker);
            	
            	var zoom = 10;
                var address = "ad";
                var point = new GLatLng(lat.value, lng.value);
                map.setCenter(point, zoom);

                map.addControl(new GLargeMapControl());
                map.addControl(new GMapTypeControl());
                map.addControl(new GScaleControl());
                // map.addControl(new GOverviewMapControl()) ;
                geocoder = new GClientGeocoder();

                var bounds = new GLatLngBounds();
                markers = new Array;
                
                var containersCount = document.getElementById('containersCount');
                var end = parseInt(containersCount.value) + 1;
                for (var i = 1; i < end; i++) {
                    var lati = document.getElementById("lat" + i);
                    var lngi = document.getElementById("lng" + i);

                    if (lati != null && lati.value != "" && lngi != null && lngi.value != "") {
                        var point = new GLatLng(lati.value, lngi.value);
                        var marker = createMarker(point, i);
                        
                        markers[i] = marker;
                        bounds.extend(new GLatLng(lati.value, lngi.value));
                        map.addOverlay(marker);
                    }
                }
                
                map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
            }
        }
    }
}
function showcellandhideother(ind) {
	var containersCount = document.getElementById('containersCount');
	var end = parseInt(containersCount.value) + 1;
	
    for (var i = 1; i < end; i++) {
    	var lati = document.getElementById("lat" + i);
        var lngi = document.getElementById("lng" + i);

        if (lati != null && lati.value != "" && lngi != null && lngi.value != "") {
	    	changeIcon(i, "picto_carte");
        }
        
        var container = document.getElementById('littleDescContainer' + i);
        
        container.style.border = "none";
    	container.style.color = "#444444";
        
        hideElement('littleDesc' + i);
    }
    
    var container = document.getElementById('littleDescContainer' + ind);
	container.style.border = "1px solid #DDDDDD";
	container.style.color = "#DDDDDD";
	
	var lat = document.getElementById("lat" + ind);
    var lng = document.getElementById("lng" + ind);

    if (lat != null && lat.value != "" && lng != null && lng.value != "") {
		changeIcon(ind, "picto_carte_select");
    }

    showElement('littleDesc' + ind);
}

function getSelected(i) {
	var picto_bouton = document.getElementById('picto_bouton' + i);
	var marker = markers[i];
    
    marker.setImage(imgDir + "picto_carte/selected.gif");
    picto_bouton.src = imgDir + "picto_carte/selected.gif";
}



function changeIcon(i, iconType) {
	var marker = markers[i];
    
   	marker.setImage(imgDir + iconType + "/picto" + i + ".png");
}

function showcell(ind) {
	var container = document.getElementById('littleDescContainer' + ind);
	container.style.border = "1px solid #DDDDDD";
	container.style.color = "#DDDDDD";
	showElement('littleDesc' + ind);
}

function hidecell(ind) {
	var container = document.getElementById('littleDescContainer' + ind);
	container.style.border = "none";
	container.style.color = "#444444";
	hideElement('littleDesc' + ind);
}
