//<![CDATA[

if(GBrowserIsCompatible()){
  
  // this variable will collect the html which will eventually be placed in the side_bar
  var side_bar_html = "";

  // arrays to hold copies of the markers and html used by the side_bar
  // because the function closure trick doesnt work there
  var gmarkers = [];


  // A function to create the marker and set up the event window
  function createMarker(point,name,html) {
    var marker = new GMarker(point);
    GEvent.addListener(marker, "click", function() {
      marker.openInfoWindowHtml(html);
    });
    // save the info we need to use later for the side_bar
    gmarkers.push(marker);
    // add a line to the side_bar html
    side_bar_html += '<a href="javascript:myclick(' + (gmarkers.length-1) + ')">' + name + '';
     return marker;
  }


  // This function picks up the click and opens the corresponding info window
  function myclick(i) {
    GEvent.trigger(gmarkers[i], "click");
  }


  // create the map
  var map = new GMap2(document.getElementById("map"));
  //map.addControl(new GLargeMapControl());
  //map.addControl(new GMapTypeControl());
  map.setCenter(new GLatLng( 40.727076,-74.005455), 16);

  // add the points    
  var point = new GLatLng(40.727076,-74.005455);
  var marker = createMarker(point,"<div class='mapLocation1'><span class='forIe8'>New York&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span></a><br /><span class='location_info'><br />160 Varick St.<br />New York NY 10013<br /><br /><b>P</b> 212.633.0080<br /><b>F</b> 212.463.8643</span></div>","<span class='mapLocationName AKZIGBES'>KBS+P&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span><br /><span class='mapAddress'>160 Varick St.<br />New York, NY 10013</span>")
  map.addOverlay(marker);

  var point = new GLatLng(33.760842,-84.386033);
  var marker = createMarker(point,"<div class='mapLocation2'><span class='forIe8'>Atlanta&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span></a><br /><span class='location_info'><br />303 Peachtree Center Avenue<br />Suite 625, Atlanta, GA 30303<br /><br /><b>P</b> 404.221.1188 <br /><b>F</b> 404.223.1136</span></div>","<span class='mapLocationName AKZIGBES'>KBS+P&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span><br /><span class='mapAddress'>303 Peachtree Center Avenue<br />Suite 625<br />Atlanta, GA 30303</span>")
  map.addOverlay(marker);
  
  
  
  var point = new GLatLng(45.503516,-73.566452);
  var marker = createMarker(point,"<div class='mapLocation1 mapLocationbtm'><span class='forIe8'>Montreal&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span></a><br /><span class='location_info'><br />555, Boul. René-Lévesque Ouest<br />17E Étage, Montréal Québec H2Z 1B1<br /><br /><b>P</b> 514.875.7400 <br /><b>F</b> 514.875.0568</span></div>","<span class='mapLocationName AKZIGBES'>KBS+P&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span><br /><span class='mapAddress'>555, Boul. René-Lévesque Ouest<br />17E Étage, Montréal Québec H2Z 1B1</span>")
  map.addOverlay(marker);

  var point = new GLatLng(43.670708,-79.386674);
  var marker = createMarker(point,"<div class='mapLocation2 mapLocationbtm'><span class='forIe8'>Toronto&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span></a><br /><span class='location_info'><br />2 Bloor Street East, 26th Floor<br />Toronto, Ontario M4W 3J4<br /><br /><b>P</b> 416.260.7000<br /><b>F</b> 416.260.7100</span></div>","<span class='mapLocationName AKZIGBES'>KBS+P&nbsp;<img src='images/orangeArrow.png' width='3' height='5' alt='' /></span><br /><span class='mapAddress'>2 Bloor Street East, 26th Floor<br />Toronto, Ontario M4W 3J4</span>")
  map.addOverlay(marker);
  
          
                   
  // put the assembled side_bar_html contents into the side_bar div
  document.getElementById("side_bar").innerHTML = side_bar_html;
  
}

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

//]]>