var map;
var _markers = [];
var Lots = [];
var _SVC;
var _StreetViewTopper

function createMarkerClickHandler(marker, lot) {
  return function() {
    marker.openInfoWindowHtml(
      '<h3>' + lot.Name + '</h3>' +
      '<table cellpading="2" border="0" style="text-align:left">' + 
        '<tr>' + 
            '<td valign="top">Location:</td>' + 
            '<td valign="top" style="width:150px">' + lot.Location + '</td>' + 
        '</tr>' +
        '<tr>' + 
            '<td>Monthly Parking:</td>' + 
            '<td>' + lot.MonthlyParking + '</td>' + 
        '</tr>' +
        '<tr>' + 
            '<td>Half hour rate (or less):</td>' + 
            '<td>' + lot.HalfRate + '</td>' + 
        '</tr>' +
        '<tr>' + 
            '<td>Early Bird Rate:</td>' + 
            '<td>' + lot.EarlyBirdRate + '</td>' + 
        '</tr>' +
        '<tr>' + 
            '<td>Nightly Prepay:</td>' + 
            '<td>' + lot.NightlyPrepay + '</td>' + 
        '</tr>' +
        '<tr>' + 
            '<td>Maximum Day Rate:</td>' + 
            '<td>' + lot.MaxDayRate + '</td>' + 
        '</tr>' +
        '<tr>' + 
            '<td valign="top">Maxium Night Rate<br/> (New day begins at 4:00am):</td>' + 
            '<td valign="top">' + lot.MaxNightRate + '</td>' + 
        '</tr>' + 
        '<tr colspan=2><a href=maps.google.com</tr>' + 
      '</table>');
    return false;
  };
}

function createMarkerMouseOverHandler(marker,listItem) {
  return function() {
    listItem.getElementsByTagName('div')[0].style.backgroundImage = "url(/common/images/maps/lotdot-red.png)";
    marker.setImage('/common/images/maps/red-dot-over.png');
    return false;
  };
}

function createMarkerMouseOutHandler(marker,listItem) {
  return function() {
    listItem.getElementsByTagName('div')[0].style.backgroundImage = "url(/common/images/maps/lotdot-white.png)";
    marker.setImage('/common/images/maps/white-dot.png');
    return false;
  };
}


function createMarker(pointData) {
  var latlng = new GLatLng(pointData.Lat, pointData.Lng);

  var icon = new GIcon();
  icon.image = '/common/images/maps/white-dot.png';
  icon.iconSize = new GSize(32, 32);
  icon.iconAnchor = new GPoint(16, 32);
  icon.infoWindowAnchor = new GPoint(16, 8);

  opts = {
    "icon": icon,
    "title": pointData.Name,
    "clickable": true,
    "labelText": pointData.Num,
    "labelOffset": new GSize(-17,-39)
  };

  var marker = new LabeledMarker(latlng, opts);
  var listItem = document.createElement('li');
  
  
  
  var clickHandler = createMarkerClickHandler(marker, pointData);
  var mouseOverHandler = createMarkerMouseOverHandler(marker, listItem);
  var mouseOutHandler = createMarkerMouseOutHandler(marker,listItem);

  GEvent.addListener(marker, "click", clickHandler);
  GEvent.addListener(marker, "mouseover", mouseOverHandler);
  GEvent.addListener(marker, "mouseout", mouseOutHandler);

  
  listItem.innerHTML = '<div class="label">'+pointData.Num+'</div><a href="http://www.ellisparking.com/main/content/monthly/signup.aspx?lotID=' + pointData.LotID + '">' + pointData.Name + '</a>';
  listItem.getElementsByTagName('a')[0].onclick = clickHandler;
  listItem.getElementsByTagName('a')[0].onmouseover = mouseOverHandler;
  listItem.getElementsByTagName('a')[0].onmouseout = mouseOutHandler;

  listItem.getElementsByTagName('div')[0].onclick = clickHandler;
  listItem.getElementsByTagName('div')[0].onmouseover = mouseOverHandler;
  listItem.getElementsByTagName('div')[0].onmouseout = mouseOutHandler;
  
  if(pointData.Num < Lots.length/2 +1)
  {
    document.getElementById('sidebar-list_1').appendChild(listItem);
  }
  else
  {
    document.getElementById('sidebar-list_2').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 initializeMap() {


    
    map = new GMap(document.getElementById("map"));
    map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
    
    var myUIOptions = map.getDefaultUI();
    myUIOptions.zoom.scrollwheel = false;
    myUIOptions.controls.maptypecontrol = true;
    myUIOptions.controls.largemapcontrol3d = false;
    map.setUI(myUIOptions);
    var largeControl3D = new GLargeMapControl3D(true)
    var smallControl3D = new GSmallZoomControl3D();
    map.addControl(largeControl3D);


//    //setup streetview
//    _SVC = new StreetViewController(
//        document.getElementById("streetView"), 
//        null, 
//        function() {
//            $("#map").css({ width: "150px", height: "150px", zIndex: 1, right: "0px", left: "" });
//            //restore the map
//            map.checkResize();
//            map.removeControl(_largeControl3D);
//            map.addControl(_smallControl3D);
//        }, 
//            function() {
//            $("#map").css({ width: "100%", height: "364px", zIndex: 0, right: "", left: "0px" });
//            //restore the map
//            map.checkResize();
//            map.addControl(_largeControl3D);
//            map.removeControl(_smallControl3D);
//        });

  //this function has to be implemented by the page including this file  
  MapCreatedGetData();
}


//Enables dragzoom on the map
function setupDragZoom() {
    /* first set of options is for the visual overlay.*/
    var boxStyleOpts = {
        opacity: .2,
        border: "2px solid red"
    };

    /* second set of options is for everything else */
    var otherOpts = {
        buttonHTML: "<img src='http://gmaps-utility-library.googlecode.com/svn/trunk/dragzoom/release/examples/zoom-button.gif' />",
        buttonZoomingHTML: "<img src='http://gmaps-utility-library.googlecode.com/svn/trunk/dragzoom/release/examples/zoom-button-activated.gif' />",
        buttonStartingStyle: { width: '24px', height: '24px' },
        overlayRemoveTime: 1000,
        title: "Zoom To Region"
    };

    map.addControl(new DragZoomControl(boxStyleOpts, otherOpts, {}), new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(1, 1)));

}; //end function




window.onload = initializeMap;
window.onunload = GUnload;
