/*************************************************
 * First American Title's Google Map API
 *************************************************/
var points = [];
var markers = [];
var counter = 0;
var sidebar_html = "";
var marker_html = [];
var to_htmls = [];
var from_htmls = [];
var map = null;
var geocoder = new GClientGeocoder();

function createMap(objectArray, mapCenterX, mapCenterY, zoomLevel) 
{    
	if (GBrowserIsCompatible()) 
	{	
		var mapObj = document.getElementById("map");		
		var officeObject = document.getElementById("selectOffice");
		officeObject.options.length=0;
		counter = 0; //Reset the counter without reloading the page
		officeObject[officeObject.options.length] = new Option("-- Please select an office --","");
		
		if (mapObj != "undefined" && mapObj != null) 
		{		
			
			map = new GMap2(document.getElementById("map"));
            for(x = 0; x < objectArray.length; x++)
            {
                generateMap(objectArray[x], mapCenterX, mapCenterY, zoomLevel);
                //FILL THE OFFICE SELECT                
                officeObject[officeObject.options.length] = new Option(objectArray[x].companyName,x);
            }		    
		}		
	}
	else 
	{
		alert("Sorry, the Google Maps API is not compatible with this browser.");
	}
	
} 

//****************GEOCODER***********************

function generateMap(addressObject, mapCenterX, mapCenterY, zoomLevel) 
{  
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(mapCenterX, mapCenterY), zoomLevel);        

        var point = new GLatLng(addressObject.lat, addressObject.lng, true);
        var marker = createMarker(point, addressObject.address + '(' + addressObject.companyName + ')', "<div id=\"gmapmarker\"><b>"+addressObject.companyName+"<\/b><br />"+ addressObject.address+"<br /><br />" + addressObject.phone + " " + addressObject.fax + "<\/div>",0,addressObject.companyName,addressObject.letter);
        map.addOverlay(marker);             
}

//************************************************
//FUNCTION CREATEMARKER
//PARAMETERS: POINT(COORDINATES X AND Y, TITLE FOR THE BALLOON, HTML IS THE TEXT INSIDE THE BALLOOON, TOOLTIP IS THE TEXT DISPLAYED WHEN MOUSE IS OVER, AND LETTER IS THE ACTUAL LETTER PRINTED IN THE MARKER)
function createMarker(point, title, html, n, tooltip, letter) {
	if(n >= 0) {
		n = -1; 
	}
/*
	var baseIcon = new GIcon(G_DEFAULT_ICON);
    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);
    baseIcon.infoShadowAnchor = new GPoint(18, 25);    
	
	var letteredIcon = new GIcon(baseIcon);
	letteredIcon.image = "http://www.google.com/mapfiles/marker" + letter + ".png";
	
    markerOptions = { icon:letteredIcon, 'title': tooltip };
    var marker = new GMarker(point, markerOptions);
*/
			var icon = new GIcon();
			icon.image = "http://www.firstam.com/title-ks/johnson/images/eagle3Shadowed.png";
			icon.iconSize = new GSize(30, 26);
			icon.iconAnchor = new GPoint(6, 18);
			icon.infoWindowAnchor = new GPoint(5, 1);

        markerOptions = { icon:icon, 'title': tooltip };
        var marker = new GMarker(point, markerOptions);
          	//var marker = new GMarker(point, icon);



	var tabFlag = isArray(html);

	if(!tabFlag) { 
		html = [{"contentElem": html}]; 
	}
	

//**************************DIRECTIONS********************************

	to_htmls[counter] = html[0].contentElem + '<form class="gmapDir" id="gmapDirTo" style="white-space: nowrap;" action="http://maps.google.com/maps" target="_blank"  method="GET">' +
    	'<span class="gmapDirHead" id="gmapDirHeadTo">Directions: <strong>To here</strong> - <a href="javascript:fromhere(' + counter + ')">From here</a></span>' +
        '<p class="gmapDirItem" id="gmapDirItemTo"><label for="gmapDirSaddr" class="gmapDirLabel" id="gmapDirLabelTo">Start address: (include addr, city st/region)<br /></label>' +
        '<input type="text" size="40" maxlength="40" name="saddr" class="gmapTextBox" id="gmapDirSaddr" value="" onfocus="this.style.backgroundColor = \'#e0e0e0\';" onblur="this.style.backgroundColor = \'#ffffff\';" />' +
        '<span class="gmapDirBtns" id="gmapDirBtnsTo"><input value="Get Directions" type="submit" class="gmapDirButton" id="gmapDirButtonTo" /></span></p>' +
        '<input type="hidden" name="daddr" value="' + title + '" /></form>';
        /* point.y + ',' + point.x + "(" + title.replace(new RegExp(/"/g),'&quot;') + ")" + '"  /></form>'; */
        from_htmls[counter] = html[0].contentElem + '<p /><form class="gmapDir" id="gmapDirFrom" style="white-space: nowrap;" action="http://maps.google.com/maps" target="_blank"  method="get"' +
        '<span class="gmapDirHead" id="gmapDirHeadFrom">Directions: <a href="javascript:tohere(' + counter + ')">To here</a> - <strong>From here</strong></span>' +
        '<p class="gmapDirItem" id="gmapDirItemFrom"><label for="gmapDirSaddr" class="gmapDirLabel" id="gmapDirLabelFrom">End address: (include addr, city st/region)<br /></label>' +
        '<input type="text" size="40" maxlength="40" name="daddr" class="gmapTextBox" id="gmapDirDaddr" value="" onfocus="this.style.backgroundColor = \'#e0e0e0\';" onblur="this.style.backgroundColor = \'#ffffff\';" />' +
        '<span class="gmapDirBtns" id="gmapDirBtnsFrom"><input value="Get Directions" type="submit" class="gmapDirButton" id="gmapDirButtonFrom" /></span></p>' +
        '<input type="hidden" name="saddr" value="' + title + '" /></form>';
        /* point.y + ',' + point.x + encodeURIComponent("(" + title.replace(new RegExp(/"/g),'&quot;') + ")") + '" /></form>'; */
        html[0].contentElem = html[0].contentElem + '<p /><div id="gmapDirHead" class="gmapDir" style="white-space: nowrap;">Directions: <a href="javascript:tohere(' + counter + ')">To here</a> - <a href="javascript:fromhere(' + counter + ')">From here</a></div>';

//**************************
	
	if(!tabFlag) { 
		html = html[0].contentElem; }if(isArray(html)) { GEvent.addListener(marker, "click", function() { marker.openInfoWindowTabsHtml(html); }); 
	}
	
	else { 
		GEvent.addListener(marker, "click", function() 
		    { 
		        marker.openInfoWindowHtml(html); 
		        //converting the letter index value into a number index value for the select office function
		        var index = Number(String(letter).charCodeAt(0)) - 64;
		        document.getElementById("selectOffice").selectedIndex = index;
	            selectOffice(String(index-1));  
		    }
		); 
	}
	
	points[counter] = point;
	markers[counter] = marker;
	marker_html[counter] = html;
	sidebar_html += '<li class="gmapSidebarItem" id="gmapSidebarItem_'+ counter +'"><a href="javascript:click_sidebar(' + counter + ')">' + title + '<\/a><\/li>';
	counter++;
	return marker;
}

// === create a GDirections Object === NOT ACTIVATED YET
var gdir=new GDirections(map, document.getElementById("directions"));

function getDirections() 
{
        var saddr = document.getElementById("saddr").value
        var daddr = document.getElementById("daddr").value
        gdir.load("from: " + saddr + " to: " + dadder);
}

function isArray(a) {return isObject(a) && a.constructor == Array;}

function isObject(a) {return (a && typeof a == 'object') || isFunction(a);}

function isFunction(a) {return typeof a == 'function';}

function click_sidebar(idx) {
	if(isArray(marker_html[idx])) { 
		markers[idx].openInfoWindowTabsHtml(marker_html[idx]); 
	}
	
  	else { 
		markers[idx].openInfoWindowHtml(marker_html[idx]); 
	}	
}

function tohere(idx) {
markers[idx].openInfoWindowHtml(to_htmls[idx]);
}

function fromhere(idx) {
markers[idx].openInfoWindowHtml(from_htmls[idx]);
}

function showGMapForm() {
  alert(document.getElementById('gmapDirFrom'));
}