// our namespace 
var g = {};

g.map;
g.results = new Array();
g.markers = new Array();
g.popup   = new Array();
g.lastMarkerIndex;
g.origin_postal_code;
g.iconFolder = "http://www.techcouver.com/images/icons";


// create a base icon for all of our markers that specifies the shadow, icon dimensions, etc.
g.baseIcon = new GIcon();
g.baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
g.baseIcon.iconSize = new GSize(20, 34);
g.baseIcon.shadowSize = new GSize(37, 34);
g.baseIcon.iconAnchor = new GPoint(9, 34);
g.baseIcon.infoWindowAnchor = new GPoint(9, 2);
g.baseIcon.infoShadowAnchor = new GPoint(18, 25);


/**
 * Submits the search form.
 */
g.submit_search = function(f)
{
  // check required fields 
  if (!f.city.value)
  {
    alert("Please select a city to search.");
    f.city.focus();
    return false;
  }

  f.submit();
  
  return false;
}


/**
 * Initializes the Google Map, centered on BC. This is called when the user does his/her first
 * search.
 */
g.onPageLoad = function()
{
  if (GBrowserIsCompatible())
  {
    g.map = new GMap2(document.getElementById("map"));
    g.map.setCenter(new GLatLng(54.278111, -126.115307), 5); // focus on BC by default
    g.map.addControl(new GLargeMapControl());
    g.map.addControl(new GMapTypeControl());
  }
}


/**
 * Called after a user search. Resets the map based on the geographical results of a search. This 
 * function takes the top, left, bottom and right coordinates (lat & long), which form the the 
 * smallest rectangular box which contains all results found.            
 */
g.resetMap = function(top, left, bottom, right)
{
  g.map = new GMap2(document.getElementById("map"));
  g.map.clearOverlays();

  // first, set up map
  g.map.setCenter(new GLatLng(0,0), 0);
  var sw = new GLatLng(left, bottom);
  var ne = new GLatLng(right, top);  
  var bounds = new GLatLngBounds(sw, ne);
  
  // never zoom REALLY close in, even if there's only one result
  var calculated_zoom = g.map.getBoundsZoomLevel(bounds);
  var actual_zoom = (calculated_zoom > 16) ? 16 : calculated_zoom;
  g.map.setZoom(actual_zoom);

  var center_lat = (bounds.getNorthEast().lat() + bounds.getSouthWest().lat()) /2;
  var center_lng = (bounds.getNorthEast().lng() + bounds.getSouthWest().lng()) /2;
  g.map.addControl(new GLargeMapControl());
  g.map.addControl(new GMapTypeControl());
  g.map.setCenter(new GLatLng(center_lat, center_lng));

  // now populate the sucker with the contents of g.results
  for (i=0; i<g.results.length; i++)
  {
    currMarker = _createMarker(g.results[i], i);
    g.markers.push(currMarker);
    g.map.addOverlay(currMarker);
  }
}


/**
 * Helper function to create a single marker on the map, complete with popup window
 */
function _createMarker(info, index)
{
  var point = new GPoint(info.x_coord, info.y_coord);
  //var letter = String.fromCharCode("A".charCodeAt(0) + index);
  var icon = new GIcon(g.baseIcon);
  icon.image = g.iconFolder + "/orange-dot2.png";
  var marker = new GMarker(point, icon);

  var email = (info.email != "") ? "Email: <a href=\"mailto:" + info.email + "\" class=\"gmap_link\">" + info.email + "</a><br />" : "Email: N/A<br />";
  var phone = (info.phone != "") ? "Phone: " + info.phone + "<br />" : "";

  var website = "";
  if (info.website != "")
  {
    website_link = info.website.replace(/^http:\/\//, "");
    website = "<a href=\"" + info.website + "\">" + website_link + "</a><br />";
  }

  // generate the popup content
  var tab1_content = "<div class='gmap_tab_content'>"
                     + "<span><b>" + info.organization_name + "</b></span><br/><br/>"
                     + info.street_address + "<br/>" 
                     + info.city + "<br/>" 
                     + info.postal_code + "<br/>"
                     + email
                     + phone
                     + website
                   + "</div>";

  var tab2_content = "<div class=\"gmap_tab_content\" style=\"width: 230px\">" + info.description + "</div>";

  var tab1 = new GInfoWindowTab("Contact", tab1_content);
  var tab2 = new GInfoWindowTab("Description", tab2_content);

  var tabs = new Array();
  tabs.push(tab1);
  tabs.push(tab2);

  g.popup[index] = new Array(tab1_content, tab2_content);

  GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowTabsHtml(tabs);
  });

  return marker;
}


/**
 * Pans to a marker on the map and pops it open.
 */
g.panToMarker = function(index)
{
  var destinationPoint = g.markers[index].getPoint();
  g.map.panTo(destinationPoint);
  g.lastMarkerIndex = index;

  _displayMarkerPopup();
}


/**
 * Displays a marker on the map. [need to be separate from pantomarker?
 */
g._displayMarkerPopup = function()
{
  var tab1_content = g.popup[g.lastMarkerIndex][0];
  var tab2_content = g.popup[g.lastMarkerIndex][1];
  var tab1 = new GInfoWindowTab("Contact", tab1_content);
  var tab2 = new GInfoWindowTab("Description", tab1_content);
  var tabs = new Array();
  tabs.push(tab1);
  tabs.push(tab2);  

  g.markers[g.lastMarkerIndex].openInfoWindowTabsHtml(tabs);
  g.lastMarkerIndex = "";
}


/**
 * [Called from child page.] Resets the variables storing the search values. 
 */
g.clearLastSearch = function()
{
  parent.g.results.length = 0;
  parent.g.markers.length = 0;
  parent.g.popup.length = 0;
}
