var map = null;
var ListOpen = "True";
var CountABC = 0;
var Count123 = 0;
var Code = null;

// Mini Map hide & show calls
function HideMiniMap()
         {
            map.HideMiniMap();
         }
         
         function ShowMiniMap()
         {
            if (map.GetMapMode() == VEMapMode.Mode3D)
            {
               map.SetMapMode(VEMapMode.Mode2D);
            }

            map.ShowMiniMap(10, 300);            
         }

function funcListClose()
{
if (ListOpen=="True")
	{
	ListOpen="False";
	document.getElementById("List").style.height = 25 + 75 + '100px';
	document.getElementById("ListBody").style.height = 0 + 'px';
	var InnerHtml = '<a href="javascript:;" onclick="funcListClose()" style="font-size: 14pt; text-decoration:none" oncontextmenu="return false;">&#9660</a>'
	document.getElementById("OpenClose").innerHTML = InnerHtml;
	}
	else
	{
	ListOpen="True";
	var winW = 630, winH = 460, d=document; 
	if (typeof window.innerWidth!='undefined')
		{ 
		winW = window.innerW6idth; 
		winH = window.innerHeight; 
		}
	else
		{
		if (d.documentElement && typeof d.documentElement.clientWidth!='undefined' && d.documentElement.clientWidth!=0) { 
		winW = d.documentElement.clientWidth
		winH = d.documentElement.clientHeight
		}
	else
		{
		if (d.body && typeof d.body.clientWidth!='undefined')
			{
			winW = d.body.clientWidth
			winH = d.body.clientHeight
			}
		}
	}
	document.getElementById("ListBody").style.height=winH - 305 - 15 +'px';
	document.getElementById("List").style.height=winH - 200 - 20 +'px';
	var InnerHtml = '<a href="javascript:;" onclick="funcListClose()" style="font-size: 14pt; text-decoration:none" oncontextmenu="return false;">&#9650</a>'
	document.getElementById("OpenClose").innerHTML = InnerHtml;
	}
}

function ZoomZoom(LatLong, ZoomLevel)
{
	map.SetCenterAndZoom(LatLong, ZoomLevel);
}

function GetInfo(){alert('The latitude,longitude at the center of the map is: '+map.GetCenter()+', Zoom level:'+map.GetZoomLevel())}

function OnPageLoad()
{	
	map = new VEMap('myMap');
	
	map.LoadMap(new VELatLong(35, -90), 4 ,'h' ,false,VEMapMode.Mode2D,true);
	//map.AttachEvent('onmodenotavailable', No3DInstalled);
	map.AttachEvent('oninitmode', ModeChange);
	//map.AttachEvent('onclick', GetInfo);
	map.AddControl(document.getElementById("List"));   
	AddShim(document.getElementById("List"),"ListShim");         
	ShowMiniMap()
	//add pushpins
	for (var i=0;i<FUSA.length;i++)
		{
		htmlcode = "<table><tr><td width='182' valign='center' align='center'><font face='Trebuchet MS' size='2'>";
					htmlcode += FUSA[i][2] +"</b></font></td>";
					htmlcode += "<td width='118' align='right'><img border=0 src='memberimage/";
					htmlcode += FUSA[i][8] + "' width=117 height=77></td></tr>";
					htmlcode += "<tr><td width='300' colspan='2'>";
					htmlcode += "<font face='Trebuchet MS' size='2'>"+FUSA[i][7]+"</font></td></tr></table>";
					htmlcode += "<br/><a href='" + FUSA[i][10] + "'  target='frame1' style='font-family: Tahoma; color: blue; text-decoration:none'>Web Link</a>";
					htmlcode += "<br/><br/><a href='javascript:;' oncontextmenu='return false'; onclick='ZoomZoom(new  VELatLong(" + FUSA[i][4] + "," + FUSA[i][5] + "), 13)' style='font-family: Tahoma; color: blue; text-decoration:none'>Zoom in</a> <a href='javascript:map.ZoomOut();' style='font-family: Tahoma; color: blue; text-decoration:none'>Zoom out</a>";

					var location = new VELatLong(FUSA[i][4], FUSA[i][5]);	//location
					var pin = new VEShape(VEShapeType.Pushpin, location);
					pin.SetZIndex(100 + FUSA[i][9]);
					pin.SetCustomIcon("<div><img src='http://www.fulhamusa.com/fusamap/images/msn1.gif'></div>");
					pin.SetTitle("<div>" + FUSA[i][0] + ", FUSA Member #" + FUSA[i][1] + "</div>");
					pin.SetDescription(htmlcode);
					map.AddShape(pin);
					}
				
				//add Craven Cottage pushpin
				htmlcode = '<table><tr><td width="182" valign="center" align="center"><font face="Trebuchet MS" size="2">';
				htmlcode += 'London, England</b></font></td>';
				htmlcode += '<td width="118" align="right"><img border=0 src="memberimage/CravenCottage.gif"';
				htmlcode += ' width=117 height=77></td></tr>';
				htmlcode += '<tr><td width="300" colspan="2">';
				htmlcode += '<font face="Trebuchet MS" size="2">Fulham is the oldest of Londons first class clubs and its long history began back in 1879 with some Sunday-school boys knocking a ball around on a long-forgotten park pitch</font></td></tr></table>';
				htmlcode += '<br/><a href="http://www.fulhamfc.com/Football_Craven_Cottage_124790_17.html" target="frame1" style="font-family: Tahoma; color: blue; text-decoration:none">Web Link</a>';

				var location = new VELatLong(51.475, -0.2219);
				var FFCpin = new VEShape(VEShapeType.Pushpin, location);
				FFCpin.SetCustomIcon("<div><img src='images/ffc.gif'></div>");
				FFCpin.SetTitle("<div>Craven Cottage, the Home of Fulham</div>");
				FFCpin.SetDescription(htmlcode);
				map.AddShape(FFCpin);
				FFCpin.SetZIndex(200);
				FFCpin.Redraw(true,true,true,true);

				//add MLS Allstar pushpin
				htmlcode = '<table><tr><td width="182" valign="center" align="center"><font face="Trebuchet MS" size="2">';
				htmlcode += 'Columbus, Ohio</b></font></td>';
				htmlcode += '<td width="118" align="right"><img border=0 src="memberimage/mlsallstar.jpg"';
				htmlcode += ' width=117 height=77></td></tr>';
				htmlcode += '<tr><td width="300" colspan="2">';
				htmlcode += '<font face="Trebuchet MS" size="2">Location of the MLS All Stars game vs Fulham in 2005. It was a great opportunity to meet with the other members of the newly formed FulhamUSA</font></td></tr></table>';
				htmlcode += '<br/><a href="http://www.mlsnet.com/MLS/mls/events/all_star/2005/" target="frame1"  style="font-family: Tahoma; color: blue; text-decoration:none">Web Link</a>';				
				
				var location = new VELatLong(40.00940659209663, -82.99132347106936);	//location
				var MLSpin = new VEShape(VEShapeType.Pushpin, location);
				MLSpin.SetCustomIcon("<div><img src='images/ffc.gif'></div>");
				MLSpin.SetTitle("<div>MLS All-Star Game 2005</div>");
				MLSpin.SetDescription(htmlcode);
				map.AddShape(MLSpin);
				MLSpin.SetZIndex(200);
				MLSpin.Redraw(true,true,true,true);

				var ListBodyHtml = "<b>FFC Points of Interest:</b>";
				ListBodyHtml += "<table cellspacing='0' cellpadding='0'>";	
				ListBodyHtml += "<tr><td>";
				ListBodyHtml += "<tr><td>&#8226;&nbsp<a href='javascript:;' oncontextmenu='return false'; onclick='ZoomZoom(new VELatLong(51.475075043312806, -0.2219152450561844), 11)'>Craven Cottage</a></td></tr>";
				ListBodyHtml += "<tr><td>&#8226;&nbsp<a href='javascript:;' oncontextmenu='return false'; onclick='ZoomZoom(new VELatLong(40.00940659209663, -82.99132347106936),7)'>MLS All-Star Game 2005</a></td></tr>";
				ListBodyHtml += "</table><br>";

				//Members
				ListBodyHtml += "<b>Fulham USA Member List:</b>";
				ListBodyHtml += " <br>Sort by: ";
				ListBodyHtml += "(<a href='javascript:;' oncontextmenu='return false'; onclick='Clicked(FillPanel(1))'>abc</a>)";
				ListBodyHtml += " - (<a href='javascript:;' oncontextmenu='return false'; onclick='Clicked(FillPanel(3))'>Member #</a>)";
				ListBodyHtml += "<div id='MemberList'>";

				//END OF LIST
				ListBodyHtml += "</div>";
				
				document.getElementById('ListBody').innerHTML = ListBodyHtml;
				
				//add listings in panel
				FillPanel(1);	//sort by abc

				
			}
			
			function FillPanel(SortMethod)
				{
				document.getElementById('MemberList').innerHTML = "";
				Code = "";

				if (SortMethod == 1)
					{
					if (CountABC == 0)
						{
						FUSA.sort(Sort_ABC_a);
						CountABC = 1;
						}
					else
						{
						FUSA.sort(Sort_ABC_d);
						CountABC = 0;
						}
					}
				if (SortMethod == 3)
					{
					if (Count123 == 0)
						{
						FUSA.sort(Sort_MemberNo_a);
						Count123 = 1;
						}
					else
						{
						FUSA.sort(Sort_MemberNo_d);
						Count123 = 0;
						}
					}
									
				Code += "<table cellspacing='0' cellpadding='0'>";
				for (var i=0;i<FUSA.length;i++)
					{
					Code += "<tr><td>&#8226;&nbsp<a href='javascript:;' oncontextmenu='return false'; onclick='ZoomZoom(new  VELatLong(" + FUSA[i][4] + "," + FUSA[i][5] + ")," + FUSA[i][6] + ")'>" + FUSA[i][0] + " (#" + FUSA[i][1] + ")</a></td></tr>";
					}
				Code += "</table>";
				
				document.getElementById('MemberList').innerHTML = Code;
				//return Code;
				}			

			function Sort_ABC_a(x,y)
				{
				var a = String(x[0]).toUpperCase(); 
				var b = String(y[0]).toUpperCase(); 
				if (a > b) 
					return 1 
				if (a < b) 
					return -1 
				return 0; 
				}

			function Sort_ABC_d(x,y)
				{
				var a = String(x[0]).toUpperCase(); 
				var b = String(y[0]).toUpperCase(); 
				if (a < b) 
					return 1 
				if (a > b) 
					return -1 
				return 0; 
				}


function Sort_MemberNo_a(a,b){return (a[1]-b[1]);}
			
function Sort_MemberNo_d(a,b){return (b[1]-a[1]);}

function ResizeWindow()
{
	var winW = 630, winH = 460, d=document; 
	if (typeof window.innerWidth!='undefined')
	{ 
		winW = window.innerWidth; 
		winH = window.innerHeight; 
	}
	else
	{
		if (d.documentElement && typeof d.documentElement.clientWidth!='undefined' && d.documentElement.clientWidth!=0)
		{
		winW = d.documentElement.clientWidth
		winH = d.documentElement.clientHeight
		}
		else
		{
		if (d.body && typeof d.body.clientWidth!='undefined')
			{
			winW = d.body.clientWidth
			winH = d.body.clientHeight
			}
		}
	}
	document.getElementById("myMap").style.width=winW - 5 +'px';
	document.getElementById("myMap").style.height=winH - 5 +'px';
	document.getElementById("ffclogo").style.left= '5 px';
	document.getElementById("ffclogo").style.top=winH-130+'px';
	document.getElementById("ListBody").style.height=winH - 305 - 15 +'px';
	document.getElementById("List").style.height=winH - 200 - 20 +'px';
	document.getElementById("List").style.left=winW - 190 +'px';
}

function UnloadMap() //dispose map etc
{if (map != null)
  {
    map.Dispose();
  }
}

function AddShim(el,sid)  //add iframe shim     
{   
  if (map.GetMapMode() == VEMapMode.Mode3D)  
  {   
    var s = document.createElement("iframe");      
    s.id = sid;      
    s.frameBorder = "0";      
    s.style.position = "absolute";      
    s.style.zIndex = "100";      
    s.style.top  = el.offsetTop;      
    s.style.left = el.offsetLeft;      
    s.width  = el.offsetWidth;      
    s.height = el.offsetHeight;
    s.scrolling="no";
    s.className="Shim";
    el.shimElement = s;      
    el.parentNode.insertBefore(s, el);   
  }    
}
function RemoveShim(sid) //remove iframe shim      
{             
  var msh = document.getElementById(sid);     
  if (msh!=null) msh.parentNode.removeChild(msh);      
  msh = null;     
} 
function ModeChange() //Change from 2d to 3d etc
{
	if (map.GetMapMode() == VEMapMode.Mode3D)   
  
	{
    RemoveShim("ListShim");
  }else
  {

    AddShim(document.getElementById("List"),"ListShim");
  }
}
