﻿// JScript File
var map;
var centerLatitude = 20;
var centerLongitude = -156;
var startZoom = 8;
var xmlhttp;
var markers;

// Create "tiny" marker icon
var icon = new GIcon();
icon.image = "./images/tiny_marker_red.png";
icon.shadow = "./images/pin_shadow.png";
icon.iconSize = new GSize(12, 20);
icon.shadowSize = new GSize(22, 20);
icon.iconAnchor = new GPoint(6, 20);
icon.infoWindowAnchor = new GPoint(5, 1);
 
 
var deselectCurrent = function() {};
 
function focusMarker(lat, lng) {
       confirm("lat, lng=" + lat + ", " + lng);
       var point = new GLatLng(parseFloat(lat),parseFloat(lng));
       map.openInfoWindow(point,'xxx');
       map.panTo(point);
       return 0;                       
} 
 
function initializePoint(pointData) {
var point = new GLatLng(pointData.latitude, pointData.longitude);
var marker = new GMarker(point);
var listItem = document.createElement('li');
var listItemLink = listItem.appendChild(document.createElement('a'));
listItemLink.href = "#";
listItemLink.innerHTML = '<strong>' + pointData.address + ' </strong><span>' + pointData.city + ', ' + pointData.state + ' (' + pointData.height + 'm)</span>';
 
var focusPoint = function() {
deselectCurrent();
listItem.className = 'current';
deselectCurrent = function() { listItem.className = ''; }
marker.openInfoWindowHtml(pointData.address);
map.panTo(point);
return false;
}
 
GEvent.addListener(marker, 'click', focusPoint);
listItemLink.onclick = focusPoint;
 
document.getElementById('sidebar-list').appendChild(listItem);
 
map.addOverlay(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 changeBodyClass(from, to) {
document.body.className = document.body.className.replace(from, to);
return false;
}
 
function setAlertText(str) {
document.getElementById('alert').innerHTML = '<p>' + str + '</p>';
}
 
function initData() {
map = new GMap(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
 
for(id in markers) {
initializePoint(markers[id]);
}
 
changeBodyClass('loading', 'standby');
}

function initWithAllMarkers() {
map = new GMap(document.getElementById("map"));
map.addControl(new GLargeMapControl());
 
map.setCenter(new GLatLng(34, 5), 2);
resetAllMarkers()
 
changeBodyClass('loading', 'standby');
}

function init() {
document.getElementById('button-sidebar-hide').onclick = function() { return changeBodyClass('sidebar-right', 'nosidebar'); };
document.getElementById('button-sidebar-show').onclick = function() { return changeBodyClass('nosidebar', 'sidebar-right'); };
handleResize();

    xmlhttp = GXmlHttp.create();
    xmlhttp.open('GET', 'CreateMapMarkers.aspx?cid=0&hrs=36', true);

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4) {
            if (xmlhttp.status != 200) {
                setAlertText('Could not access map data.');
            } else {                
                //var responseText = xmlhttp.responseText;
                //confirm("xml=" + responseText);
                // denton 5/14/08 - The following statement causes an error.  
                // Workaround was to comment several lines
                // and move initWithAllMarkers outside of the if test.
                //markers = eval(responseText);
                /*                
                if (!markers) {
                    setAlertText('Map data error.');
                } else {
                    initWithAllMarkers();
                }
                */
                initWithAllMarkers();
            }
        }
    }
    xmlhttp.send(null); 

}
                                                 
    function resetMarker(cid, hrs) {
       var e = document.getElementById("CommunityDropDownList");       
       var cid = e.options[e.selectedIndex].value;
       //confirm ("cid=" + cid);
       var e2 = document.getElementById("HrsDropDownList"); 
       var hrs = e2.options[e2.selectedIndex].value;
       //confirm ("hrs=" + hrs);
       map.clearOverlays()
       mapMarkers = "CreateMapMarkers.aspx?cid=" + cid + "&hrs=" + hrs;    
       loadMarkers(mapMarkers);
    }
     
     function resetAllMarkers() {
       map.clearOverlays()
       mapMarkers = "CreateMapMarkers.aspx?cid=0&hrs=36";    
       loadMarkers(mapMarkers);
    }
    function createTab(point, desc, url, fileNameSmall, tagLine) {
          var tabHtml = desc + '</br> <a href="' + url + '" target="_blank" ><img src="./uploadedThumbnails/' + fileNameSmall + '\" height=\"120\"> </a><br/>' + tagLine;
          var infoTabs = [
            new GInfoWindowTab("1",tabHtml),
            new GInfoWindowTab("Tab #2", "This is tab #2 content")
          ];
          return marker;
    }   
 
    function createMarker(point, tabs) {
          var marker = new GMarker(point, icon);
         // var marker = new GMarker(point);
          GEvent.addListener(marker, "click", function() {
           marker.openInfoWindowTabsHtml(tabs)
           marker.setImage("./images/tiny_marker_white.png")
          });
          if(document.getElementById('HideCheckBox').checked == true){
             GEvent.addListener(marker, "infowindowbeforeclose", function() {
                 marker.hide();
             });  
          }        
          return marker;
    } 
 
    function loadMarkers(mapMarkers) {
       GDownloadUrl(mapMarkers, function(data) {
          xml = GXml.parse(data);     
          var markers = xml.documentElement.getElementsByTagName("marker");    
          var tabs = Array(); 
          for (var i = 0; i < markers.length; i++) {
               var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                           parseFloat(markers[i].getAttribute("lng")))
               var websiteTitle  =  markers[i].getAttribute("websiteTitle")
               var wid  =  markers[i].getAttribute("wid");
               var url  =  markers[i].getAttribute("url");
               var thumbnailTitle  =  markers[i].getAttribute("thumbnailTitle");
               var city  =  markers[i].getAttribute("city");
               var state  =  markers[i].getAttribute("state");
               var country  =  markers[i].getAttribute("country");
               var author  =  markers[i].getAttribute("author");
               var fileNameSmall = markers[i].getAttribute("fileNameSmall");
               var tagLine = markers[i].getAttribute("tagLine");
               var scanDate = markers[i].getAttribute("ScanDate");
               var tab = markers[i].getAttribute("tab");
               //var tabHtml = '<div width:200px> <b>' + websiteTitle + '</b> from ' + city + ' ' + state + ' (' + country + ')' + '</br> <a href="' + url + '" target="_blank" ><img src="./uploadedThumbnails/' + fileNameSmall + '\" style=\"FLOAT: left; MARGIN: 0px 10px 10px 0px; CURSOR: hand\" height=\"120\" > </a><br/>' + scanDate + '<br/>' + thumbnailTitle + ' ... <br/> posted by ' + author + ' <br/> <br/> <a href="ParticipantThumbnailGallary.aspx?wid=' + wid + '&page=1\" target=\"_blank\">gallery</a> </div>';
               var tabHtml = '<div width:200px> <b>' + websiteTitle + '</b> from ' + city + ' ' + state + ' (' + country + ')' + '</br> <a href="' + url + '" target="_blank" ><img src="./uploadedThumbnails/' + fileNameSmall + '\" style=\"FLOAT: left; MARGIN: 0px 10px 10px 0px; CURSOR: hand\" height=\"120\" > </a><br/>' + scanDate + '<br/>' + thumbnailTitle + ' ... <br/> posted by ' + author + ' <br/> <br/> <a href=\"javascript:PicLensLite.start({feedUrl:\'./CreateGalleryRssByWid.aspx?wid=' + wid + '&hrs=8760\'});\">cooliris gallery</a> </div>';

              tabs[parseInt(tab)] = new GInfoWindowTab(tab,tabHtml); 
              var endingTab = markers[i].getAttribute("endingTab");
                             
               if(endingTab == "yes"){
                  map.addOverlay(createMarker(point, tabs));
                  tabs = [];                  
               }
            }
       }
       );
    }  
 
 
window.onresize = handleResize;
window.onload = init;