var sites = [

[229, 'SUNY ESF Baker Laboratory PV', 43.03416667, -76.13777778]
,
[228, 'SUNY ESF Heiberg Memorial Forest Turbine', 42.76194444, -76.08583333],
[306, 'SUNY ESF Moon Library', 43.03472222, -76.13638889],
[169, 'SUNY ESF Walters Hall PV', 43.03444444, -76.13416667],
[230, 'SUNY Newcomb', 43.97083333, -74.22194444],
[305, 'Tully PV', 42.79722222, -76.12138889]
];

  var map ;
  var barr = [ ] ;
  var lastI ;
  var icon1 = 'http://www.sunviewer.net/images/google-sun.png';
  var icon2 = 'http://www.sunviewer.net/images/google-sun.png';
//var icon2 = 'http://www.sunviewer.net/images/google-sun2a.png';

  function mapInit()
  {
   var myLatLng = new google.maps.LatLng(42.8,-75.8);
   var myOptions = {
    zoom: 7,
    center: myLatLng,
    mapTypeControlOptions: {position: google.maps.ControlPosition.TOP_LEFT},
    mapTypeId: google.maps.MapTypeId.TERRAIN,
    sensor: 'false'
   };

   map = new google.maps.Map(document.getElementById("mapCanvas"), myOptions);

   // cycle through the sites array
   for (var i = 0; i < sites.length; i++) {

     var site = sites[i];
    barr[i] = new Object ;

    // Create the marker.  Two different colors depending on whether the site is original 50, or one of the new sites

    var latlng = new google.maps.LatLng(site[2],site[3]);

    // two classes of site markers based on site id
    // not used at the moment because the icons are defined elsewhere as the same
	    var marker = new google.maps.Marker({
		   position: latlng,
		   visible: true,
		   clickable: true,
		   title: site[1],
		   icon: icon1,
		   map: map});
	


    barr[i].sId = site[0];
    barr[i].marker = marker ;
    barr[i].html = "<span style='font-family:arial, helvetica; font-size:12px;'><span style='font-weight:bold;'>" + site[1] + "</span>";

    barr[i].html += "<br>Today's power output:";
    barr[i].html += "<br><img style='height:130px; width:260px; margin:0px 6px;' src='http://sunviewer.net/portals/esf/mapGraph.php?sid=" + site[0] + "'>";
    barr[i].html += "<div style='font-weight:bold; text-align:center;'>[ <a class='textLink' href='" + site[0] + ".html'>Site Information</a> ]&nbsp; - &nbsp;[ <a class='textLink' href='siteData.php?id=" +site[0] + "'>View Data</a> ]</div>";

    // Create the infoWindow...

    barr[i].infoWindow = new google.maps.InfoWindow({
     content: barr[i].html
    });

    // Create the listener with a closure...
    barr[i].listener = makeClosure(i, barr[i].marker) ;

   } //for


  } // mapInit

  // Make a simple closure with the listener...

  function makeClosure( i, marker )
  {
   var listener = google.maps.event.addListener(marker, 'click', function() {
   openInfoWindow(i);
   
   });
   return listener ;
  }

  // Open the infoWindow - called from the closure...

  function openInfoWindow(i)
  {
   if ( typeof(lastI) == 'number' && typeof(barr[lastI].infoWindow) == 'object' )
   {
    barr[lastI].infoWindow.close() ;
   }
   lastI = i ;
   barr[i].infoWindow.open(map,barr[i].marker) ;
  }