﻿var gMap;

function initializeMap(mapContainerID, latSW, lngSW, latNE, lngNE)
{     
    //find map container
    var mapContainer = document.getElementById(mapContainerID);    
        
    if (!mapContainer)
    {
        alert("cannot find map container");
    }
            
    //init map
    if (GBrowserIsCompatible())
    {   
        gMap = new GMap2(mapContainer);
        //gMap.enableScrollWheelZoom();
        gMap.addControl(new GSmallMapControl());
        gMap.addControl(new GMapTypeControl());
        var bounds = new GLatLngBounds(new GLatLng(latSW, lngSW), new GLatLng(latNE, lngNE));  
        gMap.setCenter(bounds.getCenter(), gMap.getBoundsZoomLevel(bounds));
    }
    else
    {
        alert("Your brower is not compatible, cannot show maps");
    }
}

function initMap(mapContainerID)
{         
    //find map container 
    var mapContainer = document.getElementById(mapContainerID);
            
    if (!mapContainer)
    {
        alert("cannot find map container");
    }
    //init map            
    if (GBrowserIsCompatible())
    {   
        gMap = new GMap2(mapContainer);
        gMap.enableScrollWheelZoom();
        gMap.addControl(new GSmallMapControl());
        gMap.addControl(new GMapTypeControl());        
        gMap.setCenter(new GLatLng(43.648994,-79.385834), 10);
    }
    else
    {
        alert("Your brower is not compatible, cannot show maps");
    }
}

//create google marker on the map
function createMarker(lat, lng, name, address, postcode, phone, picurl, moreinfourl, type) 
{
    var point = new GLatLng(lat, lng);
    var html = buildGeneralInfoWinHtml(name, address, postcode, phone, picurl, moreinfourl);
    var marker;
    if (type && type != '')
    {
        marker = new GMarker(point, createMarkerOptions(type));
    }
    else
    {
        marker = new GMarker(point);
    }
    GEvent.addListener(marker, "click", function() {        
        marker.openInfoWindowHtml(html);
    });

    gMap.addOverlay(marker);
}

//use different icons according to the types
function createMarkerOptions(type)
{
    var tinyIcon = new GIcon();    
    tinyIcon.image = "/LocationData/" + type + ".gif";    
    tinyIcon.iconSize = new GSize(23, 25);    
    tinyIcon.iconAnchor = new GPoint(6, 20);
    tinyIcon.infoWindowAnchor = new GPoint(5, 1);
    
    // Set up our GMarkerOptions object literal
    markerOptions = { icon:tinyIcon };
    
    return markerOptions;
}

//show bubble at a given location on the map
function showBubble(lat, lng, name, address, postcode, phone, picurl, moreinfourl, type)
{
    var point = new GLatLng(lat, lng);
    gMap.openInfoWindowHtml(point, buildGeneralInfoWinHtml(name, address, postcode, phone, picurl, moreinfourl));
}

//helper for building info window html
function buildGeneralInfoWinHtml(name, address, postcode, phone, picurl, moreinfourl)
{          
    var html;
    
    var typePictureHtml = '';
    if (picurl && picurl.length > 0)
    {
        typePictureHtml = '<img src="' + picurl + '" />';
    }
    
    if (moreinfourl && moreinfourl != '')
    {
        html =
        '<table width="320px" height="175px" cellpadding="0" cellspacing="0" border="0">' +
            '<tr align="left">' +
                '<td rowspan="2" valign="top" align="left" style="padding-right:20">' +
                    typePictureHtml +
                '</td><td rowspan="2"><div style="width:10px;height:100%"></div></td>' +                
                '<td style="font-weight:bold">' + name + '<a href="'+ moreinfourl + '">[more&nbsp;info]</a>' + 
                '</td>' +
            '</tr>' +
            '<tr align="left">' +
                '<td  colspan="2">' + address + "&nbsp;" + postcode + '<br/>' + phone +
                '</td>' +
            '</tr>' +
            '<tr align="left">' +
                '<td colspan="3"><input id="hiddeninput" type="hidden" value="' + address.replace("<br/>", " ").replace("<br/>", " ").replace("<br/>", " ") + '"/><a id="archorDirection" onclick="javascript:return false;">Get directions</a><br/><div id="divDirection">Start address&nbsp;<input id="sourceAddress" type="Text" onkeypress="javascript:return onPressOpenGoogleMap(sourceAddress.value, hiddeninput.value, event)"  /><input type="button" value="Go" onclick="openGoogleMap(sourceAddress.value, hiddeninput.value)" /></div></td>' +
            '</tr>' +
        '</table>';
     }
     else
     {
        html =
        '<table width="320px"  height="175px" cellpadding="0" cellspacing="0" border="0">' +
            '<tr align="left">' +
                '<td rowspan="2" valign="top" align="left" style="padding-right:20">' +
                    typePictureHtml +
                '</td><td rowspan="2"><div style="width:10px;height:100%"></div></td>' +                
                '<td style="font-weight:bold">' + name +
                '</td>' +
            '</tr>' +
            '<tr align="left">' +
                '<td  colspan="2">' + address + "&nbsp;" + postcode + '<br/>' + phone +
                '</td>' +
            '</tr>' +
            '<tr align="left">' +
                '<td colspan="3"><input id="hiddeninput" type="hidden" value="' + address.replace("<br/>", " ").replace("<br/>", " ").replace("<br/>", " ") + '"/><a id="archorDirection" onclick="javascript:return false;">Get directions</a><br/><div id="divDirection">Start address&nbsp;<input id="sourceAddress" type="Text" onkeypress="javascript:return onPressOpenGoogleMap(sourceAddress.value, hiddeninput.value, event)" /><input type="button" value="Go" onclick="openGoogleMap(sourceAddress.value, hiddeninput.value)" /></div></td>' +
            '</tr>' +
        '</table>';
     }
          
    return html;
}

//open google map for direction
function openGoogleMap(sourceAddress, destinationPostcode)
{
    //url encode address and postcode
    sourceAddress = escape(sourceAddress);
    destinationPostcode = escape(destinationPostcode);
    window.open("http://maps.google.ca/maps?f=d&hl=en&geocode=&saddr=" + sourceAddress + "&daddr=" + destinationPostcode);
}

//handle key stroke of "Enter" for getting direction
function onPressOpenGoogleMap(sourceAddress, destinationPostcode, e)
{  
    var keycode;
    if (window.event) keycode = window.event.keyCode;
    else if (e) keycode = e.which;
    else return false;
    if (keycode == 13)
    {	
	    //openGoogleMap(sourceAddress, destinationPostcode);
	    return false;
    }         
}

function findMapContainer(partialID)
{
    var x=document.getElementsByTagName("div");    
    for (var i=0;i<x.length;i++)
    {         
        if (x[i].id.toLowerCase().indexOf(partialID.toLowerCase()) >= 0)
        {            
            return x[i];
        }
    }
}
