var officeData = [
  {name: 'test 2', lat: 51.1, lng: 4, jobs: [{title: 'job 1', link: '#1'}, {title: 'job 2', link: '#2'}]},
  {name: 'test 3a', lat: 51.1, lng: 4.1, jobs: [{title: 'job 3', link: '#1'}, {title: 'job 2', link: '#2'}]},
  {name: 'test 3b', lat: 51, lng: 4.1, jobs: [{title: 'job 5', link: '#1'}, {title: 'job 2', link: '#2'}]},
  {name: 'test', lat: 51, lng: 4, jobs: [{title: 'job 7', link: '#1'}, {title: 'job 2', link: '#2'}]}
];

var mgr;
var officeicon;
var offices = [];
var bubble;
var maxzoomlevel = 11;

function initialize(xmllocation, calloutImgPath) {
  if (GBrowserIsCompatible()) {

    //officeData = loadOfficeData('locations.xml');
    officeData = loadOfficeData(xmllocation);

    buildIcon();
    buildOffices();
    
    var map = new GMap2(document.getElementById("map_canvas"));
    map.addControl(new GSmallMapControl()); 

    if (offices.length) {    
    var latlngbounds = new GLatLngBounds( );
    for ( oKey in offices ) {
      map.addOverlay(offices[oKey]);
      latlngbounds.extend( offices[oKey].getLatLng() );
    }
      var zoomlevel = map.getBoundsZoomLevel( latlngbounds );
      if (zoomlevel > maxzoomlevel) {
        zoomlevel = maxzoomlevel;
      }
      map.setCenter( latlngbounds.getCenter( ), zoomlevel);

    bubble = new EBubble(map, calloutImgPath, new GSize(332,314), new GSize(260,151), new GPoint(60, 29), new GPoint(290,280), true);   
      GEvent.addListener(map, "click", function(overlay,point) {
        if (!overlay) {
          bubble.hide();
        }
      });
    }
    else {
      map.setCenter(new GLatLng(51,4), 7);
    }
    //map.setCenter( latlngbounds.getCenter( ), map.getBoundsZoomLevel( latlngbounds ) );
    

   
    
  }
}

function buildIcon() {
  officeicon = new GIcon(G_DEFAULT_ICON);
//    officeicon.image = "images/icon.png";
  officeicon.image = "http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|996600"; 
  officeicon.iconSize = new GSize(16, 16);
  officeicon.iconAnchor = new GPoint(8, 8);
}

function buildOffices() {
  offices.length = 0;
  markerOptions = { icon:officeicon }; 

  for ( oKey in officeData ) {
    office = officeData[oKey];
    if (office.location) {
      offices.push(createOfficeMarker(office));
    }
  }
}

function createOfficeMarker(office) {
  markerOptions = { icon:officeicon }; 

  var point = new GLatLng(office.location[0].lat, office.location[0].lng);
  var marker = new GMarker(point, markerOptions);
  var oname = office.location[0].Text;
  var jobs = '<ul>';
  for ( jKey in office.jobs[0].job ) {
    job = office.jobs[0].job[jKey];
    if (job.description) {
      jobs += "<li><a href='" + job.url + "'>" + job.description[0].Text + "</a></li>" ;
    }    
  }    
  GEvent.addListener(marker, "click", function() { 
      bubble.hide();
      bubble.openOnMarker(marker, "<h2>" + oname + "</h2>" + jobs);
    }); 
  return marker;
}

function loadOfficeData (filename) {
  if (window.XMLHttpRequest) {
    xhttp=new XMLHttpRequest();
  }
  else {
    xhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xhttp.open("GET", filename, false);
  xhttp.send("");
  xmlDoc=xhttp.responseXML; 
  data = XMLObjectifier.xmlToJSON(xmlDoc); 
  return data.office;
}