var map, manager;
var centerLatitude = 33.989, centerLongitude = -118.443, startZoom = 16;


function createMarkerClickHandler(marker, nam, des, dev, sta) {
  return function() {
  	var html = "";
  	if (is_string(nam)) {html = html + '<h3>' + nam + '</h3>'; }
  	html += '<p>';
  	if (is_string(dev)) {html = html + '<b>Developer:</b> ' + dev + '<br />';}
  	if (is_string(sta)) {html = html + '<b>Status:</b> ' + sta + '</p>';}
  	if (is_string(des)) {html = html + '<p>' + des + '</p>';}
    marker.openInfoWindowHtml(html);
    return false;
  };
}


function createMarker(pointData) {
  var latlng = new GLatLng(pointData.latitude, pointData.longitude);

  var icon = new GIcon();
  icon.image = 'images/red_marker.png';
  icon.iconSize = new GSize(20, 20);
  icon.iconAnchor = new GPoint(10, 10);
  icon.infoWindowAnchor = new GPoint(13, 7);

  opts = {
    "icon": icon,
    "clickable": true,
    "labelText": pointData.num,
    "labelOffset": new GSize(-16, -16)
  };
 
  var marker = new LabeledMarker(latlng, opts);
  var handler = createMarkerClickHandler(marker, pointData.name, pointData.desc, pointData.developer, pointData.status);
	
  GEvent.addListener(marker, "click", handler);

  
  
  var listItem = document.createElement('li');
  listItem.innerHTML = '<div class="label">' + pointData.num + '</div><a href="#">' + pointData.name + '</a>';
  listItem.getElementsByTagName('a')[0].onclick = handler;

  document.getElementById('sidebar-list').appendChild(listItem);
  
  return marker;
}

function windowHeight() {
  // Standard browsers (Mozilla, Safari, etc.)
  if (self.innerHeight) {
    return self.innerHeight;
  }
  // IE 6
  if (document.documentElement && document.documentElement.clientHeight) {
   return document.documentElement.clientHeight;
  }
  // IE 5
  if (document.body) {
    return document.body.clientHeight;
  }
  // Just in case. 
  return 0;
}

function handleResize() {
  var height = windowHeight() - document.getElementById('toolbar').offsetHeight - 30;
  document.getElementById('map').style.height = height + 'px';
  document.getElementById('sidebar').style.height = height + 'px';
}

function init() {
  handleResize();
	
  map = new GMap(document.getElementById("map"));
  map.addControl(new GSmallMapControl());
  map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
  map.addControl(new GMapTypeControl());
  map.setMapType(G_HYBRID_MAP);
  
  manager = new MarkerManager(map);
	
  // This is a sorting trick, don't worry too much about it.
  markers.sort(function(a, b) { return (a.num > b.num) ? +1 : -1; }); 
	
  batch = [];
  for(id in markers) {
    batch.push(createMarker(markers[id]));
  }
   
  	   
  var mcIcon = new GIcon();
  mcIcon.image = "images/maplogo2.png";
  mcIcon.iconSize = new GSize(155, 55);
  mcIcon.iconAnchor = new GPoint(140, 25);
  mcIcon.infoWindowAnchor = new GPoint(140, 40);
  var mcMarker = new LabeledMarker(new GLatLng(33.991962,-118.444782),{"icon":mcIcon,"clickable":true});
  var mcHandler = function() {var mcHtml = "<h3>Marina Collection Shopping Center</h3><p>13400 W. Washington Blvd.<br />Marina Del Rey, CA	90292<p><p>FOR LEASING INFORMATION CALL (310) 578-7280</p>"; mcMarker.openInfoWindowHtml(mcHtml); return false;};

  GEvent.addListener(mcMarker, "click", mcHandler);
  batch.push(mcMarker);
  
  manager.addMarkers(batch, 11);
  manager.refresh(); 

}

function is_string( mixed_var ){
    return (typeof( mixed_var ) == 'string');
}

window.onresize = handleResize;
window.onload = init;
window.onunload = GUnload;