/////////////////////////////////////////////////////////
//  Created By:  Levi Tonet                            //
//         For:  The Penn State Electro-Optics Center  //
/////////////////////////////////////////////////////////

//<![CDATA[	  
if (GBrowserIsCompatible()) {
  var gmarkers = [];
  var htmls = [];
  var to_htmls = [];
  var from_htmls = [];
  var side_bar_html = "";	      
  var i=0;
  var clickedPixel;
  
  // Display the map 
  var map = new GMap2(document.getElementById("map"));
  map.addControl(new GLargeMapControl3D());
  map.addControl(new GHierarchicalMapTypeControl());
  
  // Sets the center position and zoom
  map.setCenter(new GLatLng( 40.701573408737914,-79.66951489448547), 10);
  
  // Sets up the general attributes of the icons
  var baseIcon = new GIcon();
  baseIcon.shadow = "images/mm_20_shadow.png";
  baseIcon.shadowSize = new GSize(22, 20);
  baseIcon.iconSize = new GSize(12, 20);
  baseIcon.iconAnchor = new GPoint(6, 20);
  baseIcon.infoWindowAnchor = new GPoint(5, 1);
  baseIcon.infoShadowAnchor = new GPoint(10,12);
 
  // A function to create the marker and set up the event window
  function createMarker(point,name,html,color,index) {
	// Creates the "To Here" link for obtaining directions
	to_htmls[i] = html + '<font class="paneltext"><br>Directions: <font class="textbody"><b>To here</b> - <a class="textbody" href="javascript:fromhere(' + i + ')"><font class="textbody">From here</a>' +
	   '<br><font class="textbody">Start address:<form action="http://maps.google.com/maps" method="get" target="_blank">' +
	   '<input type="text" SIZE=40 MAXLENGTH=40 name="saddr" id="saddr" value="" /><br>' +
	   '<INPUT value="Get Directions" TYPE="SUBMIT">' +
	   '<input type="hidden" name="daddr" value="' + point.lat() + ',' + point.lng() + 
			  // "(" + name + ")" + 
	   '"/>';
	// Creates the "From Here" link for obtaining directions
	from_htmls[i] = html + '<font class="paneltext"><br>Directions: <font class="textbody"><a class="textbody" href="javascript:tohere(' + i + ')">To here</a> - <font class="textbody"><b>From here</b>' +
	   '<br><font class="textbody">End address:<form class="textbody" action="http://maps.google.com/maps" method="get"" target="_blank">' +
	   '<input type="text" SIZE=40 MAXLENGTH=40 name="daddr" id="daddr" value="" /><br>' +
	   '<INPUT value="Get Directions" TYPE="SUBMIT">' +
	   '<input type="hidden" name="saddr" value="' + point.lat() + ',' + point.lng() +
			  // "(" + name + ")" + 
	   '"/>';
	   
	
	//Creates a new marker
	var icon = new GIcon(baseIcon);
    icon.image = "images/" + color + ".png";
	var marker = new GMarker(point, icon);
	marker.type=color;
	marker.name=name;
	
	//Adds the "To Here" and "From Here" links to the popup window
	var html = html + '<br><font class="paneltext">Directions: <a class="textbody" href="javascript:tohere('+i+')">To here</a> - <a class="textbody" href="javascript:fromhere('+i+')">From here</a>';
	
	GEvent.addListener(marker, "click", function() {marker.openInfoWindowHtml(html);});
	
	side_bar_html = '<a class="textbody" href="javascript:myclick(0)">Freeport Facility</a><br><a class="textbody" href="javascript:myclick(1)">Northpointe Facility</a><br>';
	
	panel = document.getElementById("side_bar");
    panel.innerHTML = side_bar_html;
	
	gmarkers[i] = marker;
	htmls[i] = html;
	i++;	  
	return marker;
	};

	// === create the context menu div ===
      var contextmenu = document.createElement("div");
      contextmenu.style.visibility="hidden";
      contextmenu.style.background="#ffffff";
      contextmenu.style.border="1px solid #8888FF";

      contextmenu.innerHTML = '<a href="javascript:zoomInHere()" style="text-decoration:none;" class="textbody"><div>&nbsp;&nbsp;Zoom In&nbsp;&nbsp;<\/div><\/a>'
                            + '<a href="javascript:zoomOutHere()" style="text-decoration:none;" class="textbody"><div>&nbsp;&nbsp;Zoom Out&nbsp;&nbsp;<\/div><\/a>'
                            + '<a href="javascript:centreMapHere()" style="text-decoration:none;" class="textbody"><div>&nbsp;&nbsp;Center Here&nbsp;&nbsp;<\/div><\/a>';

      map.getContainer().appendChild(contextmenu);

      // === listen for singlerightclick ===
      GEvent.addListener(map,"singlerightclick",function(pixel,tile) {
        // store the "pixel" info in case we need it later
        // adjust the context menu location if near an egde
        // create a GControlPosition
        // apply it to the context menu, and make the context menu visible
        clickedPixel = pixel;
        var x=pixel.x;
        var y=pixel.y;
        if (x > map.getSize().width - 120) { x = map.getSize().width - 120 }
        if (y > map.getSize().height - 100) { y = map.getSize().height - 100 }
        var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(x,y));  
        pos.apply(contextmenu);
        contextmenu.style.visibility = "visible";
      });

      // === functions that perform the context menu options ===
      function zoomInHere() {
        // perform the requested operation
        var point = map.fromContainerPixelToLatLng(clickedPixel)
        map.zoomIn(point,true);
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }      
      function zoomOutHere() {
        // perform the requested operation
        var point = map.fromContainerPixelToLatLng(clickedPixel)
        map.setCenter(point,map.getZoom()-1); // There is no map.zoomOut() equivalent
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }      
      function centreMapHere() {
        // perform the requested operation
        var point = map.fromContainerPixelToLatLng(clickedPixel)
        map.setCenter(point);
        // hide the context menu now that it has been used
        contextmenu.style.visibility="hidden";
      }

      // === If the user clicks on the map, close the context menu ===
      GEvent.addListener(map, "click", function() {
        contextmenu.style.visibility="hidden";
      });
	  
	  map.enableScrollWheelZoom();

}
// display a warning if the browser was not compatible
else {
  alert("Sorry, the Google Maps API is not compatible with this browser");
}