function markGeo()
{
    markLocation(new GLatLng(document.getElementById('locatLat').value, document.getElementById('locatLng').value));
}

function markLocation(latlng)
{
    var icon = new GIcon();
    icon.image = "/images/markers/flag_blue.png";
    icon.iconSize = new GSize(16, 16);
    icon.iconAnchor = new GPoint(15, 9);
    icon.infoWindowAnchor = new GPoint(15, 9);

    var markerv = new GMarker(latlng, icon); 
    map.addOverlay(markerv);
    
    map.setCenter(latlng, 12);
}
 
 function getMapInfo()
 {
	var center = map.getCenter();

    
    var infodiv = document.getElementById("mapinfo");
	infodiv.innerHTML = "Lng: " + parseFloat(center.x).toFixed(6) + "<br> Lat: " + parseFloat(center.y).toFixed(6) + "<br> Zoom: " + map.getZoom();
		
 }

function setMapSize() 
{ 
        var NS = getWindowSize(); 
        document.getElementById("map").style.height = (NS.height - 65) + 'px'; 
} 

function getWindowSize() 
{ 
        var e = new Object(); 
        if(window.self && self.innerWidth) 
        { 
                e.width = self.innerWidth; 
                e.height = self.innerHeight; 
        } 
        else if(document.documentElement && document.documentElement.clientHeight) 
        { 
                e.width = document.documentElement.clientWidth; 
                e.height = document.documentElement.clientHeight; 
        }
        else 
        { 
                e.width = document.body.clientWidth; 
                e.height = document.body.clientHeight; 
        } 
        return e;
} 

function zoomHere(lat, lng, zoomLevel)
{
    hideInfoBox();
    
    markLocation(new GLatLng(lat, lng), zoomLevel);
}
 
function map_zoom(oldZoom, newZoom)
{
    alert(oldZoom + " " + newZoom);  
    smallerIcon();    
}

var activeLocation;
var activeLocIcon = new GIcon();
activeLocIcon.image = "/images/markers/ActiveLoc.png";
activeLocIcon.iconAnchor = new GPoint(3, 3);
activeLocIcon.iconSize = new GSize(6, 6);
activeLocIcon.infoWindowAnchor = new GPoint(3, 3);


function displayMarker(marker)
{
    var loc = marker.getPoint();
	map.setCenter(loc);    
    var html = "<div style='width: 350px;'>" + marker.title + 
               "<div style='margin: 3px; font-weight: bold; font-size: xx-small; color: #696969;'>" + 
               "Brief Summary<div style='font-weight: normal; margin-left: 12px'>" +
                marker.info +
                "<\/div><div style='padding-top: 8px;'><a href='Info.aspx?Location=" + 
                marker.locationID + 
                "'>More Info...<\/a><img class='pointerhand' src='/images/zoom.png' onclick='AtlasZoom(" + 
                loc.lat() + "," + loc.lng() + ",this);' /><\/div><\/div>";
                
    
    marker.openInfoWindowHtml(html);
}

function showAddForm()
{

    var point = activeLocation.getPoint();
    var lng = point.lng();
    var lat = point.lat();
    
    /*
    // Display map's current Longitude and Lat
    var lspan = document.getElementById("lblLng");
    lspan.innerHTML = lng;
    lspan = document.getElementById("lblLat");
    lspan.innerHTML = lat;
    */
    
    // Set hidden form elements to return value to server side logic
    var hiddenInput1 = document.getElementById("_ctl0_ContentPlaceHolder1_hLng");
    hiddenInput1.setAttribute("value", lng);
    //
    var hiddenInput2 = document.getElementById("_ctl0_ContentPlaceHolder1_hLat");
    hiddenInput2.setAttribute("value", lat);
	
    // Grab Add Locations container and open a new Infowindow at the point specified
    // by the click event
    //var tdiv = document.getElementById("addLocationDiv");
    
//    var html = "<div style='padding: 3px'><h3>New Location</h3><div style='padding: 6px;'><h4>Location Title</h4>" +
//                "  <input type=text id='clientTitle' /><br /><select id='clientSpotType'>" + 
//                "  <option value='0'>Public Skatepark</option><option value='1'>Street</option></select>" + 
//                "  <input type='button' onclick='doAddSubmit();' value='Submit' />"
//                "</div></div>";
//                
                
    var html = "<div style='padding: 3px; font-weight: bold;'>New Location<br/>" +
                "  <form action='AddLocation.aspx' method='post'>" +
                "  <input type='hidden' id='Lat' name='lat' value='" + lat + "'/>" + 
                "  <input type='hidden' id='Lng' name='lng' value='" + lng + "'/>" + "  Location Title: <input type=text id='clientTitle' name='clientTitle' /><input type='submit' value='Submit' />"
                "  </form>" + 
                "</div></div>";
                
    activeLocation.openInfoWindowHtml(html);

    /*
    var m = map; 
    var b = m.getRelativeClickPoint(e,m.container); 
    */
}



function ShowControl(controlName, sourceFunction)
{
    var ctrl = document.getElementById(controlName);
    
    // Show the control if hidden
    if(ctrl.style.dispay != "")
        ctrl.style.display = "";
   
    // Decrease the top offset margin to scroll the ctrl up
    if(ctrl.TopDistance > 0)
    {
        ctrl.style.marginTop = ctrl.TopDistance + "px";
        ctrl.TopDistance -=4;
        window.setTimeout(sourceFunction, 90);
    }
}

function HideControl(controlName)
{
    var hideControl = document.getElementById(controlName);
    hideControl.style.marginTop = "19px";
    hideControl.TopDistance = 19;
    
    return hideControl;
}
function ShowLatControl() { ShowControl("LatControl", "ShowLatControl()"); }
function ShowLngControl() { ShowControl("LngControl", "ShowLngControl()"); }
function ShowAddItemControl() { ShowControl("AddItemControl", "ShowAddItemControl()"); }
    
function map_click(overlay, point) 
{
    hideInfoBox();
    
    if(activeLocation != null)
	    map.removeOverlay(activeLocation);
    
    if (overlay && overlay.title) 
	{
	    displayMarker(overlay)
	}
	else
	{
	    HideControl("LatControl").innerHTML = "Lat: " + point.lat();
        HideControl("LngControl").innerHTML = "Lng: " + point.lng();
        HideControl("AddItemControl");
        
        window.setTimeout("ShowLatControl()", 1000);
        window.setTimeout("ShowLngControl()", 1400);
        window.setTimeout("ShowAddItemControl()", 1800);

        activeLocation = new GMarker(point, activeLocIcon);
        map.addOverlay(activeLocation);
    }
    
	RootPage.DisplayLocationDetails(point.y,  point.x, map.getZoom(), DisplayLocationDetails_Callback);
}

// Set-up to use getMouseXY function onMouseMove
document.onclick = getMouseXY;

// Temporary variables to hold mouse x-y pos.s
var tempX = 0
var tempY = 0

// Main function to retrieve mouse x-y pos.s
function getMouseXY(e) {
  if (e == null) { // grab the x-y pos.s if browser is IE
    tempX = event.clientX + document.body.scrollLeft
    tempY = event.clientY + document.body.scrollTop
  } else {  // grab the x-y pos.s if browser is NS
    tempX = e.pageX
    tempY = e.pageY
  }  
  // catch possible negative values in NS4
  if (tempX < 0){tempX = 0}
  if (tempY < 0){tempY = 0}  

  return true
}



function DisplayLocationDetails_Callback(response)
{

    if(response.error != null)
    {
        var errorx = "Error: ";
        for(var i in response.error)
        {
            errorx += "Name: " + i + "   Value: " + response.error[i] + "\r\n";
        }
        alert(errorx);
    }
    if(response.value != null)
    {
        document.getElementById("sucks").innerHTML = response.value;
    }
}

var previousSpot;
var previousZoom;
var previousType;

// Supports the 'Zoom In' feature displayed on each markers InfoWindow
function AtlasZoom(lat, lng, img)
{
    if(img.src.indexOf('zoom.png') != -1)
    {
        // Store the current zoom and position of the map
        previousSpot = map.getCenter();
        previousZoom = map.getZoom();
        previousType = map.getCurrentMapType();
        
        // Zoom in and set the map to aerial view
        map.setCenter(new GLatLng(lat, lng), 17, G_SATELLITE_MAP);

        // Update image to reflect modified state
        img.src = '/images/restore.png'
    }
    else
    {
        // Restore the map zoom and position
        map.setCenter(previousSpot, previousZoom, previousType);
        
        // Update image to reflect modified state
        img.src = '/images/zoom.png';
    }                
}

//AjaxPro.onStateChanged = stateChanged;
RootPage.GetGeoLocations(GetGeoLocations_Callback);



function GetGeoLocations_Callback(response)
{
    if(response.error)
    {
        var errorx = "Error: ";
        for(var i in response.error)
        {
            errorx += "Name: " + i + "   Value: " + response.error[i] + "\r\n";
        }
        alert(errorx);
    }
    
    if(response.value != null)
    {
        var xml = response.value;
        //var thisObj = response.context;
        
        // If the responseXML is invalid, notify and exit
        if(!xml)
        {
            //thisObj.loadedAlbumID = null;
            alert("An error occured getting remote data. Please try again" + response.error.Message);
            return;
        }
        
        allMarkers = new Object();
        
        // Get the title info from the xml document
        var spots = xml.getElementsByTagName("spot");
        for(i = 0; i < spots.length; i++)
        {
            DisplayGeoLocation(spots[i]);
        }
    }
    
}


//function stateChanged(readystate, obj)
//{
//    if(readystate == 4)
//    {
//        var xml = obj.xmlHttp.responseXML;;
//        //var thisObj = response.context;
//        
//        // If the responseXML is invalid, notify and exit
//        if(!xml)
//        {
//            //thisObj.loadedAlbumID = null;
//            alert("Oops, an error occured getting remote data. Please try again" + response.error.Message);
//            return;
//        }
//        
//        // Get the title info from the xml document
//        var spots = xml.getElementsByTagName("spot");
//        for(i = 0; i < spots.length; i++)
//        {
//            DisplayGeoLocation(spots[i]);
//        }

//        obj.xmlHttp.open("GET","/include/blank.txt" ,true);
//        AjaxPro.onStateChanged = null;
//    }
//       
//}


function selectMarkerByID(locationID)
{
    /*
    if(activeLocation != null)
	    map.removeOverlay(activeLocation);
    */
    
    displayMarker(allMarkers[locationID]);
}
var allMarkers;

function DisplayGeoLocation(elem)
{
    var lng = parseFloat(elem.getAttribute("lng"));
    var lat = parseFloat(elem.getAttribute("lat"));
    var gpoint = new GPoint(lng, lat);
    var marker = new GMarker(gpoint, Icon);
    
    // Set marker properties to use on marker click -- handled by map click event -- hopefully
    marker.title = elem.getAttribute("title");
    marker.info = elem.getAttribute("info");
    marker.locationID = elem.getAttribute("locationID");
    
    allMarkers[marker.locationID] = marker;
    
    // Show this marker's index in the info window when it is clicked
    //GEvent.addListener(marker, 'click', function() {{
    map.addOverlay(marker);
}


    // A TextualZoomControl is a GControl that displays textual "Zoom In"
    // and "Zoom Out" buttons (as opposed to the iconic buttons used in
    // Google Maps).
    function TextualZoomControl() {
    }
    TextualZoomControl.prototype = new GControl();

    // Creates a one DIV for each of the buttons and places them in a container
    // DIV which is returned as our control element. We add the control to
    // to the map container and return the element for the map class to
    // position properly.
    TextualZoomControl.prototype.initialize = function(map) {
      var container = document.createElement("div");

      var zoomInDiv = document.createElement("div");
      this.setButtonStyle_(zoomInDiv);
      zoomInDiv.id = "fadeBtn";
      zoomInDiv.setAttribute("faded", "1");
      
      container.appendChild(zoomInDiv);
      zoomInDiv.appendChild(document.createTextNode("Atlas Faded"));
      GEvent.addDomListener(zoomInDiv, "click", function() {
        fadeTilesX(this);
      });

      map.getContainer().appendChild(container);
      return container;
    }

    // By default, the control will appear in the top left corner of the
    // map with 7 pixels of padding.
    TextualZoomControl.prototype.getDefaultPosition = function() {
      return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(80, 7));
    }

    // Sets the proper CSS for the given button element.
    TextualZoomControl.prototype.setButtonStyle_ = function(button) {
      button.style.color = "#000";
      button.style.backgroundColor = "white";
      button.style.font = "small Arial";
      button.style.border = "1px solid #c0c0c0";
      button.style.padding = "2px";
      button.style.marginBottom = "3px";
      button.style.textAlign = "center";
      button.style.width = "8em";
      button.style.cursor = "pointer";
    }


window.onresize = setMapSize;
setMapSize();

// Marker1
/*
Icon.image = "/images/markers/A6.png";
Icon.iconAnchor = new GPoint(10, 5);
Icon.iconSize = new GSize(12, 12);
Icon.infoWindowAnchor = new GPoint(10, 5);
*/

Icon.image = "/images/markers/dotx.png";
Icon.iconAnchor = new GPoint(3, 3);
Icon.iconSize = new GSize(6, 6);
Icon.infoWindowAnchor = new GPoint(6, 6);

map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl ()); //GSmallMapControl()
map.addControl(new GOverviewMapControl()); //GSmallMapControl()
map.addControl(new GMapTypeControl());
map.addControl(new TextualZoomControl());


//map.setCenter(new GLatLng(41.574361, -117.158203), 5);
map.setCenter(new GLatLng(44.024422, -118.916016), 5);
FadeTileImages(true);

GEvent.addListener(map, 'click', map_click);
GEvent.addListener(map, "maptypechanged", function() {
  FadeTileImages(document.getElementById('fadeBtn').getAttribute("faded") == "1");
});
    
function fadeTilesX(ctrl)
{
    if(ctrl.getAttribute("faded") == "1")
    {
        ctrl.style.borderColor = "#3c3c3c";
        ctrl.setAttribute("faded", "0");
        FadeTileImages(false);
    }
    else
    {
        FadeTileImages(true);
        ctrl.setAttribute("faded", "1");
        ctrl.style.borderColor = "#c0c0c0";
    }
}