//set up map variables
    var map = null;
    var geocoder = null;
    var p = null;
    var pt = null;
    var OverlayLayerParks;
    var OverlayLayerLabels;
    var loadingPOS;

function onLoad() {
if (GBrowserIsCompatible()) {
    map = new GMap2(document.getElementById("map"));
    var mapWidth = document.getElementById("map").clientWidth;
    loadingPOS = mapWidth/2 -50;
    geocoder = new GClientGeocoder();
    map.setCenter(new GLatLng(37.405074,-120.102539), 6);
    map.addControl(new GLargeMapControl());
    var mapControl = new GMapTypeControl();
    map.addControl(mapControl);

    var htmlinfo='<div style="background-color:white; -moz-opacity: .9; padding: 5px; font-weight:bold; font-size:16px; color: #638c39; font-family:arial; text-align:center"><img src="images/ajaxLoading.gif" border="0"><br>Getting Info...</div>';
    loadingInfoMessage=new HtmlControl(htmlinfo);

    var html='<div id="overlay-toggles" style="width: 130px;"><span class="left"><input type="checkbox" name="parks2" id="parks2" checked="checked" onclick="toggleParks(this.id)"><label for="parks2">Show CPAD Data</label> </span></div>';
    //	second create the HtmlControl, no optional arguments passed so default settings will be used for visible(true), selectable(false) and printable(false)
    parksToggle=new HtmlControl(html);
    //	last we add the new control to the map
    map.addControl(parksToggle, new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(8, 30)));
 
    var tileParks = new GTileLayer(null,null,null,{
    tileUrlTemplate: 'http://www.parkinfo.org/tilecache/tilecache.py/1.0.0/calands_access16/{Z}/{X}/{Y}.png?type=google',
    isPng:true});
    tileParks.getOpacity = function() { return .7; }

    OverlayLayerParks = new GTileLayerOverlay(tileParks);
    map.addOverlay(OverlayLayerParks);


 // ====== Restricting the range of Zoom Levels =====
      // Get the list of map types      
      var mt = map.getMapTypes();
      // Overwrite the getMinimumResolution() and getMaximumResolution() methods
      for (var i=0; i<mt.length; i++) {
        mt[i].getMinimumResolution = function() {return 5;}
        mt[i].getMaximumResolution = function() {return 17;}
      }

    var myEventListener = GEvent.bind(this.map, "click", this, function(overlay,point) {
					if(overlay){ return; }
					pt = new GLatLng(point.y,point.x);
					addInfoTipMarker(pt);		
      }); 
     GEvent.addListener(map, "maptypechanged", function() {
          if (map.getCurrentMapType() == G_NORMAL_MAP) {
               // show CPAD-Map legend
               document.getElementById("cpadsat-legend").style.display="none";
               document.getElementById("cpadmap-legend").style.display="block";
          } else if (map.getCurrentMapType() == G_SATELLITE_MAP ||map.getCurrentMapType() == G_HYBRID_MAP) {
              // show CPAD-Sat legend
              document.getElementById("cpadmap-legend").style.display="none";
              document.getElementById("cpadsat-legend").style.display="block";
          } 
      }); 
     //These options are for the drag zoom button
    			var zoomOpts = { 
          			buttonStartingStyle: {background: 'transparent'},
          			buttonHTML: '<img title="Drag Zoom In" src="images/zoomin_off.png">',
          			buttonStyle: {background: 'transparent', padding:'0px', width:'30px', height:'30px',border:'none'},
          			buttonZoomingHTML: 'Drag a region on the map (click here to reset)',
          			buttonZoomingStyle: {background:'#EBEBEB',width:'80px',height:'100%',padding:'5px',fontFamily:'arial',fontSize:'75%',border:'1px solid #666666'},
          			backButtonHTML: '<img title="Zoom Back Out" src="images/zoomout_off.png">',  
          			backButtonStyle: {display:'none',marginTop:'5px',width:'30px', height:'30px'},
          			backButtonEnabled: true, 
          			overlayRemoveTime: 1500}  

          map.addControl(new DragZoomControl({}, zoomOpts, {}), new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(20,230)));

    } else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }

} 

//This code allows us to retrieve attributes as getfeatureinfo requests
   /*
Call generic wms service for GoogleMaps v2
John Deck, UC Berkeley
Inspiration & Code from:
	Mike Williams http://www.econym.demon.co.uk/googlemaps2/ V2 Reference & custommap code
	Brian Flood http://www.spatialdatalogic.com/cs/blogs/brian_flood/archive/2005/07/11/39.aspx V1 WMS code
	Kyle Mulka http://blog.kylemulka.com/?p=287  V1 WMS code modifications
	http://search.cpan.org/src/RRWO/GPS-Lowrance-0.31/lib/Geo/Coordinates/MercatorMeters.pm
*/

var MAGIC_NUMBER=6356752.3142;
var DEG2RAD=0.0174532922519943;
var PI=3.14159267;
function dd2MercMetersLng(p_lng) { 
	return MAGIC_NUMBER*(p_lng*DEG2RAD); 
}

function dd2MercMetersLat(p_lat) {
	if (p_lat >= 85) p_lat=85;
	if (p_lat <= -85) p_lat=-85;
	return MAGIC_NUMBER*Math.log(Math.tan(((p_lat*DEG2RAD)+(PI/2)) /2));
}

   loadPopup = function(a) {
             map.removeControl(loadingInfoMessage);
             if (a !="") {
                  var html1 = "";
		    html1 += '<div class="popup"><a href="javascript:zoomIN('+p+');">Zoom In</a>&nbsp;|&nbsp;<a href="javascript:zoomOUT('+p+');">Zoom Out</a><br><br>';
		    html1 += a;
            html1 += '</div>';      
		map.openInfoWindowHtml(pt, html1);
             } 
     
   }

   function addInfoTipMarker(pt){
   	      p = new GPoint(pt);
		// code from Lance on the Google Maps Group

		var b = map.getBounds();
		var sw = b.getSouthWest();
		var ne = b.getNorthEast();
		var w = sw.lng();
		var e = ne.lng();
		var n = ne.lat();
		var s = sw.lat();
		var ts = s;
		var tw = w;
		if(n<s) { s=n; n = ts; }
		if(e<w){ w=e; e = tw; }
		if(s<-90)s=-90;
		if(n>90)n=90;
		if(e>180)e=180;
		if(w<-180)w=-180;

		var span_ew = Math.abs(e - w);
		var span_ns = Math.abs(n - s);
		var width  = 768*span_ew/span_ns;
		var height = 768;

		var x = (pt.x - w) * width/span_ew;
		var y = (n - pt.y) * height/span_ns;

		var label1 = 'Main';
		var label2 = 'Details';
		var html2 = "You clicked on <br>" + pt;
		var URL = GetURL(x, y, w, s, e, n, width, height);                
              GDownloadUrl(URL, loadPopup);
              map.addControl(loadingInfoMessage, new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(loadingPOS, 210)));
	}


	function GetURL(x, y, w, s, e, n, width, height){
		query = "http://www.parkinfo.org/cgi-bin/mapserv?map=/home/user/mapfiles/wms_calands_query.map";
		query+="&SERVICE=WMS";
		query+="&SRS=EPSG:4326";
		query+="&VERSION=1.1.1";
		query+="&REQUEST=GetFeatureInfo";
		query+="&X=" + parseInt(x);
		query+="&Y=" + parseInt(y);
		query+="&QUERY_LAYERS=Parks_GetInfo";
		query+="&LAYERS=Parks_GetInfo";
		query+="&INFO_FORMAT=text/html";
		query+="&BBOX="+w+","+s+","+e+","+n;
		query+="&WIDTH="+parseInt(width)+"&HEIGHT="+ parseInt(height)+"&FORMAT=image/png&STYLES=";
		return query;           
	}

	function zoomIN(pt) {
           map.setCenter(pt,map.getZoom()+1);
        }

	function zoomOUT(pt) {
           map.setCenter(pt,map.getZoom()-1);
        }

 function toggleParks(id)
    {
       if ( document.getElementById("parks2").checked == true ) {
         map.addOverlay( OverlayLayerParks );
       }
       else {
          map.removeOverlay( OverlayLayerParks );
       }

    } 


    function showAddress(address) {
      if (geocoder) {
        geocoder.getLatLng(
          address,
          function(point) {
            if (!point) {
              alert(address + " not found");
            } else {
              map.setCenter(point, 13);
              var marker = new GMarker(point);
              map.addOverlay(marker);
              marker.openInfoWindowHtml(address);
            }
          }
        );
      }
    }



