/***
Varilux Google Maps Script
***/

//declaring common variables that will be used in the various Google Maps functions
var map = null;
//list of the markers displayed on the map
var markers = new Array();
var markerKeys = new Array();
//list of the content displayed when one clicked on a marker
var windowHtmls = new Array();
//current address marker
var currentAddressMarker = null;

function RetrieveListOfOptician()
{
    markers = new Array();
    var imgLoading = document.getElementById(loadingPictureId);
    imgLoading.style.display = '';
    if(!GBrowserIsCompatible())
    {
      alert("browser aint compatible");
      imgLoading.style.display = 'none';
      return;
    }

    //retrieving the value of the elements of the form
    var url = providerUrl;
    var addressElement = document.getElementById(addressId);
    addressElement.style.width = "132px"; //IE6 loses the styling, and width must be adjusted again.
    var zipElement = document.getElementById(zipId);
    var townElement = document.getElementById(townId);
    if (addressElement == undefined ||  addressElement == null 
        || zipElement == undefined || zipElement == null
        || townElement == undefined || townElement == null)
    {
        imgLoading.style.display = 'none';
        return;
    }
    else
    {
        var addressValue = addressElement.value;
        var zipValue = zipElement.value;
        var townValue = townElement.value;
        
        if(zipValue.length == 0 && townValue.length == 0)
        {
            imgLoading.style.display = 'none';
            addressElement.disabled = false;
            zipElement.disabled = false;
            townElement.disabled = false;
            return;
        }
        
        if(addressValue != "")
            url += "address="+addressValue+"&";
        if(zipValue != "")
            url += "zip="+zipValue+"&";
        if(townValue != "")
            url += "town="+townValue+"&";
            
        url += "key="+googleKey;
        document.getElementById('MapAndResultsPanel').style.display = '';
        addressElement.disabled = true;
        zipElement.disabled = true;
        townElement.disabled = true;
    }

    GDownloadUrl(encodeURI(url), function(data, responseCode) {

        if (responseCode == 200) {

            var xml = GXml.parse(data);

            if (xml.documentElement.getElementsByTagName("error").length > 0) {
                alert("Error occured");
                imgLoading.style.display = 'none';
                addressElement.disabled = false;
                zipElement.disabled = false;
                townElement.disabled = false;
                return;
            }

            var results = document.getElementById(resultsId);

            var opticianTable = document.createElement('table');
            opticianTable.className = "OpticianLocatorStoreList";
            //adding caption
            var opticianTableCaption = document.createElement('caption');
            opticianTableCaption.appendChild(document.createTextNode(OpticianTableCaptionText));
            var opticianTBody = document.createElement('tbody');
            opticianTable.appendChild(opticianTBody);

            //creating header
            var Opticians = xml.documentElement.getElementsByTagName("Optician");
            if (Opticians.length != 0) {
                var header = document.createElement('tr');
                opticianTBody.appendChild(header);
                var storeNameHeader = document.createElement('th');
                storeNameHeader.appendChild(document.createTextNode(StoreNameHeaderText));
                header.appendChild(storeNameHeader);
                var addressHeader = document.createElement('th');
                addressHeader.appendChild(document.createTextNode(AddressHeaderText));
                header.appendChild(addressHeader);
                var zipCodeHeader = document.createElement('th');
                zipCodeHeader.appendChild(document.createTextNode(ZipHeaderText));
                header.appendChild(zipCodeHeader);
                var cityHeader = document.createElement('th');
                cityHeader.appendChild(document.createTextNode(CityHeaderText));
                header.appendChild(cityHeader);
                var phoneNumberHeader = document.createElement('th');
                phoneNumberHeader.appendChild(document.createTextNode(PhoneHeaderText));
                header.appendChild(phoneNumberHeader);
                var faxHeader = document.createElement('th');
                faxHeader.appendChild(document.createTextNode(FaxHeaderText));
                header.appendChild(faxHeader);
                var mailHeader = document.createElement('th');
                mailHeader.appendChild(document.createTextNode(EMailHeaderText));
                header.appendChild(mailHeader);
                var websiteHeader = document.createElement('th');
                websiteHeader.appendChild(document.createTextNode(WebSiteHeaderText));
                header.appendChild(websiteHeader);

            }
            else if (Opticians.length == 0) {
                var header = document.createElement('tr');
                opticianTBody.appendChild(header);
                var ItemNotFound = document.createElement('th');
                ItemNotFound.appendChild(document.createTextNode("Items not Found !"));
                header.appendChild(ItemNotFound);
            }
            //loading the map with the parameters in the form
            map = createOpticianStoreLocatorMap(mapId);
            if (map != null) {
                var CurrentAddresses = xml.documentElement.getElementsByTagName("CurrentAddress");
                var httpStatus = "";
                if (CurrentAddresses != null)
                    httpStatus = CurrentAddresses[0].getElementsByTagName('HttpStatus')[0].firstChild.nodeValue;
                else
                    httpStatus = "0";

                if (httpStatus == "200") {

                    var latitude = CurrentAddresses[0].getElementsByTagName('GeoLat')[0].firstChild.nodeValue;
                    var longitude = CurrentAddresses[0].getElementsByTagName('GeoLng')[0].firstChild.nodeValue; ;
                    var point = new GLatLng(parseFloat(latitude), parseFloat(longitude));
                    map.setCenter(point, 13);
//                    var icon = new GIcon();
//                    icon.image = CurrentAddressMarkerIconUrl;
//                    icon.iconSize = new GSize(28, 29);
//                    icon.iconAnchor = new GPoint(14, 15);
//                    icon.infoWindowAnchor = new GPoint(5, 1);
//                    currentAddressMarker = new GMarker(point, icon);
//                    map.addOverlay(currentAddressMarker);

                }
                else {
                    alert("Enable to locate the specified address.");
                    imgLoading.style.display = 'none';
                    addressElement.disabled = false;
                    zipElement.disabled = false;
                    townElement.disabled = false;
                    return;
                }
            }
            else {
                imgLoading.style.display = 'none';
                addressElement.disabled = false;
                zipElement.disabled = false;
                townElement.disabled = false;
                alert("if map !null");
                return;
            }

            //building the list of opticians as well as the markers
            if (Opticians == null || Opticians == undefined) {
                imgLoading.style.display = 'none';
                addressElement.disabled = false;
                zipElement.disabled = false;
                townElement.disabled = false;
                return;
            }

            for (var i = 0; i < Opticians.length; i++) {
                var stamp = "";
                var latitude = "";
                var longitude = "";
                var title = "";
                var address = "";
                var zipcode = "";
                var city = "";
                var telephone = "";
                var fax = "";

                var row = document.createElement('tr');
                var storeNameCell = document.createElement('td');
                storeNameCell.setAttribute("style","border-spacing:10px");
                row.appendChild(storeNameCell);
                var addressCell = document.createElement('td');
                row.appendChild(addressCell);
                var zipCodeCell = document.createElement('td');
                row.appendChild(zipCodeCell);
                var cityCell = document.createElement('td');
                row.appendChild(cityCell);
                var phoneNumberCell = document.createElement('td');
                row.appendChild(phoneNumberCell);
                var faxCell = document.createElement('td');
                row.appendChild(faxCell);
                var mailCell = document.createElement('td');
                row.appendChild(mailCell);
                var websiteCell = document.createElement('td');
                row.appendChild(websiteCell);

                stamp = Opticians[i].getElementsByTagName('CustomerNumber')[0].firstChild.nodeValue;

                for (var j = 0; j < Opticians[i].childNodes.length; j++) {
                    var cellContent = Opticians[i].childNodes[j].firstChild.nodeValue+" ";
                    switch (Opticians[i].childNodes[j].nodeName) {
                        case 'StoreName':
                            title = cellContent;
                            var link = document.createElement('a');
                            link.appendChild(document.createTextNode(cellContent));
                            link.setAttribute("href", "javascript:markerFocus('" + stamp + "')")
                            storeNameCell.appendChild(link);
                            break;
                        case 'StreetAddress':
                            address = cellContent;
                            addressCell.appendChild(document.createTextNode(cellContent));
                            break;
                        case 'ZipCode':
                            zipcode = cellContent;
                            zipCodeCell.appendChild(document.createTextNode(cellContent));
                            break;
                        case 'City':                            
                            city = cellContent;
                            cityCell.appendChild(document.createTextNode(cellContent));
                            break;
                        case 'PhoneNumber':                          
                            telephone = cellContent;
                            phoneNumberCell.appendChild(document.createTextNode(cellContent));
                            break;
                        case 'FaxNumber':
                            fax = cellContent;
                            faxCell.appendChild(document.createTextNode(cellContent));
                            break;
                        case 'EmailAddress':
                            var mailto = document.createTextNode(cellContent);
                            if (cellContent != " ")
                            {
                              mailto = document.createElement("a");
                              mailto.setAttribute("href", "mailto:" + cellContent);
                              var img = document.createElement("img");
                              img.setAttribute("src", "/Style Library/EssilorVariluxCore/images/divers/mail.gif");
                              img.setAttribute("style", "border:\"0\"");
                              mailto.appendChild(img);
                            }
                            mailCell.appendChild(mailto);
                            break;
                        case 'WebSite':
                            var website = document.createTextNode(cellContent);
                            if (cellContent != " ")
                            {
                              website = document.createElement("a");
                              website.setAttribute("href", "http://" + cellContent);
                              website.setAttribute("target", "_blank");
                              website.appendChild(document.createTextNode(cellContent));
                            }
                            websiteCell.appendChild(website);
                        case 'GeoLat':
                            latitude = cellContent;
                            break;
                        case 'GeoLng':
                            longitude = cellContent;
                            break;
                        default:
                            break;
                    }
                    ;
                }

                //adding the point to the list of markers
                var marker = null;
                var point = null;
                if (stamp != "" && latitude != "" && longitude != "") {
                    point = new GLatLng(parseFloat(latitude), parseFloat(longitude));
                    var icon = new GIcon();
                    icon.image = MarkerIconUrl;
                    icon.iconSize = new GSize(28, 29);
                    icon.iconAnchor = new GPoint(14, 15);
                    icon.infoWindowAnchor = new GPoint(5, 1);
                    marker = new GMarker(point, icon);

                    var htmlContent = "<div style=\"color:#000000\"><span style=\"font-weight:bold;\">" + title + "</span><br/>";
                    if (address != "") {
                        htmlContent += address + " ";
                    }
                    if (zipcode != "") {
                        htmlContent += "<br/>" + zipcode + ", ";
                    }
                    if (city != "") {
                        htmlContent += city;
                    }
                    if (telephone != "") {
                        htmlContent += "<br/>Tel : " + telephone;
                    }
                    if (fax != "") {
                        htmlContent += "<br/>Fax : " + fax;
                    }
                    htmlContent += "</div>";
                    map.addOverlay(marker);
                    markerKeys.push(stamp);
                    markers[stamp] = marker;
                    eval("GEvent.addListener(markers[stamp] , \"click\", function(){markers['" + stamp + "'].openInfoWindowHtml(windowHtmls['" + stamp + "']);});");
                    windowHtmls[stamp] = htmlContent;
                    opticianTBody.appendChild(row);
                }
            }
            if (results.hasChildNodes()) {
                results.removeChild(results.firstChild);
            }
            results.appendChild(opticianTable);
        }
        else if (responseCode == -1) {
            alert("Data request timed out. Please try later.");
        }
        else {
            alert("Request resulted in error. Check XML file is retrievable.");
        }
        imgLoading.style.display = 'none';
        addressElement.disabled = false;
        zipElement.disabled = false;
        townElement.disabled = false;
    });
}

function createOpticianStoreLocatorMap(mapContainerId)
{
	var mapToReturn = new GMap2(document.getElementById(mapContainerId));
	
	mapToReturn.addControl(new GLargeMapControl());
    mapToReturn.addControl(new GMapTypeControl());
    
//    var menuItem1 = document.createElement('a');
//    menuItem1.setAttribute('href', 'javascript:map.setCenter(currentAddressMarker.getPoint(), 13);');
//    menuItem1.className = 'OpticianLocatorVariluxSpecialist';
//    var menuImage1 = document.createElement('img');
//    menuImage1.setAttribute('src', CurrentAddressMarkerIconUrl);
//    menuImage1.setAttribute('alt', 'Current address marker icon');
//    menuItem1.appendChild(menuImage1);
//    menuItem1.appendChild(document.createTextNode('Your location'));
    
    var menuItem2 = document.createElement('a');
    menuItem2.setAttribute('href', 'javascript:showHideMarkers();');
    menuItem2.className = 'OpticianLocatorVariluxSpecialist';
    var menuImage2 = document.createElement('img');
    menuImage2.setAttribute('src', MarkerIconUrl);
    menuImage2.setAttribute('alt', 'Marker icon');
    menuItem2.appendChild(menuImage2);
    menuItem2.appendChild(document.createTextNode('Optician stores'));
    
//    storeLocatorMenuControl = new StoreLocatorMenuControl('storeLocatorMenu');
//	  storeLocatorMenuControl.appendMenuItem(menuItem1, 'YourAddress');
//    storeLocatorMenuControl.appendMenuItem(menuItem2, 'VariluxSpecialist');
//    mapToReturn.addControl(storeLocatorMenuControl);
    
    return mapToReturn;
}

//set center on the marker and open its window
function markerFocus(stamp)
{
    map.setCenter(markers[stamp].getPoint(),13);
    markers[stamp].openInfoWindowHtml(windowHtmls[stamp]);
}

// StoreLocatorMenuControl
// Building a control for the Varilux store locator map menu
function StoreLocatorMenuControl(id)
{
	this.menuid = id;
	
	var menu = document.createElement("ul");
	menu.setAttribute("id", this.menuid);
	//menu.style.display = "none";
	this.list = menu;
}

StoreLocatorMenuControl.prototype = new GControl();

StoreLocatorMenuControl.prototype.initialize = function(map) {
  var container = document.createElement("div");
  container.className = "OpticianLocatorStoreMapOptions";
  container.setAttribute("id", "OpticianLocatorStoreMapOptions");

  var showHideMenuDiv = document.createElement("a");
  showHideMenuDiv.setAttribute("href", "javascript:ReverseDisplay('" + this.menuid + "');");
  showHideMenuDiv.className = "OpticianLocatorStoreMapOptionsHider";

  container.appendChild(showHideMenuDiv);					
  showHideMenuDiv.appendChild(document.createTextNode("Map options"));						
  container.appendChild(this.list);
  
  map.getContainer().appendChild(container);
  return container;
}

StoreLocatorMenuControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 30));
}

//Add an item in the menu			
StoreLocatorMenuControl.prototype.appendMenuItem = function(node, cssClass)
{
	var menuItem = document.createElement("li");
  menuItem.className = cssClass;
	this.list.appendChild(menuItem);
	menuItem.appendChild(node);	
}
//end of StoreLocatorMenuControl

//Altern display style of the html element corresponding to the id specified
function ReverseDisplay(id)
{
	var element = document.getElementById(id);
	if(element != null)
	{
		if(element.style.display == 'none')
			element.style.display = 'block';
		else
			element.style.display = 'none';
	}
}

//show or hide markers
function showHideMarkers()
{
    for(var i = 0 ; i < markerKeys.length ; i++)
	{
		try
		{
			if(markers[markerKeys[i]].isHidden())
			{
				markers[markerKeys[i]].show();
			}
			else
			{
				markers[markerKeys[i]].hide();
			}
		}
		catch(error)
		{
			markers[markerKeys[i]].hide();
		}
	}
}