// Defines arrays and side bar appearance
var locations = {};
var param_useSidebar = true;
var markersArray = [];
var markersHtml = [];
var markerGroups = { "panorama": [], "regular": []};



// Function used for side bar links into main google map
function markerClicked(markerNum) {
    markersArray[markerNum].openInfoWindowHtml(markersHtml[markerNum]);
}


function load() {
    var map = new GMap2(document.getElementById("map"));
    map.setCenter(new GLatLng(36.9897, -122.0592), 14);
    var customUI = map.getDefaultUI();
	customUI.zoom.scrollwheel = false;
	map.setUI(customUI);

    //parses XML page
    GDownloadUrl("markerdata.xml",
    function(data) {
        var xml = GXml.parse(data);
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute("name");
            var index = i;
            var longdesc = markers[i].getAttribute("longdesc");
            var shortdesc = markers[i].getAttribute("shortdesc");
            var type = markers[i].getAttribute("type");
            var pageurl = markers[i].getAttribute("pageurl");
			var latlng = new GLatLng(parseFloat(markers[i].getAttribute("lat")),parseFloat(markers[i].getAttribute("lng")));

			if (type == "panorama"){
			            var movieurl = markers[i].getAttribute("movieurl");
			            //creates store array with all the data from each point
			            var store = {
			                latlng: latlng,
			                index: index,
			                name: name,
			                type: type,
			                movieurl: movieurl,
			                pageurl: pageurl,
			                longdesc: longdesc,
			                shortdesc: shortdesc
				        };
						var latlngHash = (latlng.lat().toFixed(6) + "" + latlng.lng().toFixed(6));
						latlngHash = latlngHash.replace(".","").replace(".", "").replace("-","");
						if (locations[latlngHash] == null) {
						locations[latlngHash] = []
						}
						locations[latlngHash].push(store);
        	}

			else {
						var store = {
							latlng: latlng,
			                index: index,
			                name: name,
			                type: type,
			                pageurl: pageurl,
			                longdesc: longdesc,
			                shortdesc: shortdesc
						};
						var latlngHash = (latlng.lat().toFixed(6) + "" + latlng.lng().toFixed(6));
						latlngHash = latlngHash.replace(".","").replace(".", "").replace("-","");
						if (locations[latlngHash] == null) {
						locations[latlngHash] = []
						}
						locations[latlngHash].push(store);
			}
		} 

		
		for (var latlngHash in locations) {
		var stores = locations[latlngHash];
		if (stores.length > 1) {
		map.addOverlay(createClusteredMarker(stores));
		} else {
		map.addOverlay(createMarker(stores));
		}
		
		
		
         }    });  //end GDownloadUrl
} //end load()
//creates marker
function createMarker(stores) {
    var store = stores[0];
    if(store.type == "panorama"){
		var camMarker = new GIcon(G_DEFAULT_ICON);
		camMarker.image = "images/cam_marker.png";
		camMarker.iconSize = new GSize (24,16);
		camMarker.shadow = "images/cam_shadow.png";
		camMarker.shadowSize = new GSize (30,18);
		camMarker.iconAnchor = new GPoint(10,10);
		camMarker.infoWindowAnchor = new GPoint(20,10);
		camMarker.printImage = "images/cam_print.gif";
		camMarker.mozPrintImage = "images/cam_mozprint.gif";
		markerOptions = { icon:camMarker};
	    var video = '<object width="600" height="315" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">';
	    video += '<param name="src" value="' + store.movieurl + '">';
	    video += '<param name="controller" value="true">';
	    video += '<param name="autoplay" value="true">';
	    video += '<embed src="' + store.movieurl + '" scale="tofit" pluginspage="http://www.apple.com/quicktime/download/" width=600 height=315 autoplay=TRUE controller=TRUE loop=FALSE playeveryframe=TRUE border=0 bgcolor="#FFFFFF" cache=TRUE></embed>';
	    video += '</object>';
	    var marker = new GMarker(store.latlng, {icon: camMarker});
	    markerGroups[store.type].push(marker);
	    var html = '<b class="title">' + store.name + '</b><br><br><div>' + video + '<br></div><p></p><p></p>';
	}
	
	else{
	    /* var newIcon = MapIconMaker.createMarkerIcon({width: 44, height: 44, primaryColor: "#00ff00"}); */
	    var marker = new GMarker(stores[0].latlng);
	    markerGroups[store.type].push(marker);
	    var html = '<b class="title">' + store.name + '</b> <br/><div><p class="shortdesc">' + store.shortdesc + '</p></div><p></p><p></p></div>';
	    GEvent.addListener(marker, 'click',
	    function() {
	        marker.openInfoWindowHtml(html);
	    });

	}
    // Changes href attribute in side bar links
    if (param_useSidebar == true) {
        markersArray.push(marker);
        markersHtml.push(html);
				
				var listItemId = 'item' + store.index;
				var currentNum = markersArray.length - 1;
				var currentItem = document.getElementById(listItemId);
				var itemLink = currentItem.getElementsByTagName('a');
				itemLink[0].setAttribute("href", "javascript:markerClicked('" + currentNum + "')");

/* Replaced: wrote links into side bar
        var listItemId = 'item' + store.index;
        var myElement = document.createElement('li');
        myElement.setAttribute("id", listItemId);
        myElement.setAttribute("class", 'listItem');
        document.getElementById("locationlist").appendChild(myElement);
        var markerA = document.createElement("a");
        var currentNum = markersArray.length - 1;
        markerA.setAttribute("href", "javascript:markerClicked('" + currentNum + "')");
        markerA.innerHTML = store.name;
        document.getElementById(listItemId).appendChild(markerA);
*/

    }
    GEvent.addListener(marker, 'click',
    function() {
        marker.openInfoWindowHtml(html);
    });
    return marker;
}

function toggleMarkers(type){
	for(var i = 0; i < markerGroups[type].length; i++){
		var marker = markerGroups[type][i];
		if(marker.isHidden()){
			marker.show();
		}
		else {
			marker.hide();
		}
			
	}

}