// play and pause buttons
function playButton(state) {
    if (state == 'play') {
        document.getElementById('pausebutton').style.display = 'inline';
        document.getElementById('playbutton').style.display = 'none';
    }
    else {
        document.getElementById('pausebutton').style.display = 'none';
        document.getElementById('playbutton').style.display = 'inline';
    }
}

// reset  buttons
function resetButton(state) {
    if (state == 'show') {
        document.getElementById('resetbutton').style.display = 'inline';
    }
    else {
        document.getElementById('resetbutton').style.display = 'none';
    }
}

// Moves to a point and opens the marker's html
function MoveToAndOpen(point, marker, html, zoom) {

    //zoom = 15 - zoom;
    //map.setCenter(point, zoom);
    map.panTo(point);
    marker.openInfoWindowHtml(html);
}

// draws the polylines associated with the timeline on the map
function showTimeline() {

    if(wholeTimeline) {
        map.removeOverlay(wholeTimeline);
        wholeTimeline = false;
    }
    wholeTimeline = new GPolyline(timePoints, "#ff0000", 10);
    map.addOverlay(wholeTimeline);
    timelineDirty = true;
    resetButton('show');	
}

// starts playing the timeline animation from where you last left off (default: 0)
function animateTimeline() {
		
    timelineDirty = true;
    resetButton('show');
    timelinePlaying = true;
    playButton('play');
    
    if(wholeTimeline) {
        map.removeOverlay(wholeTimeline);	
        wholeTimeline = false;
    }
		
    map.disableDragging();
    //map.recenterOrPanToLatLng(timePoints[animate]);
    map.panTo(timePoints[animate]);
		
    newimage = timeToImages[animate];
			
    marker = smugImages[newimage]['marker'];
    marker.openInfoWindowHtml(smugImages[newimage]['html']);
		
    timelineListener = GEvent.addListener(map, "moveend", function() {
        listening = true;
    
        if(animate < timePoints.length) {
            clearTimeout(moveTimer);
            moveTimer = setTimeout("drawLineAndMove()", 3000);
        }
    
        listening = false;
    });
			 
    moveTimer = setTimeout("drawLineAndMove()", 3000);
}
	
// we saw a few cases where the "moveend" listener wasn't firing, maybe when photos reside in the same spot?  catch them, if so, and kick the animation ahead
function doubleCheckListener() {
    if(listening != true && timelinePlaying == true) {
        drawLineAndMove();	
    }
}
	
// remove polylines and listeners, renable dragging, etc.
function cleanupTimeline() {
	
    for(i=0; i < polylines.length; i++) {
        //alert('removing polylines ' + i);
        map.removeOverlay(polylines[i]);
    }
    
    polylines = new Array();
		
    map.enableDragging();
		
    if(wholeTimeline) {
        map.removeOverlay(wholeTimeline);		
        wholeTimeline = false;
    }
		
    if(timelineListener) {
        GEvent.removeListener(timelineListener);
        timelineListener = false;
    }
		
    animate = 0;
		
    timelineDirty = false;
    resetButton('hide');
    timelinePlaying = false;
    playButton('pause');
}
	
// stop animating, but don't reset, so they can hit play again
function pauseTimeline() {
	
    clearTimeout(moveTimer);
			
    if(timelineListener) {
        GEvent.removeListener(timelineListener);
        timelineListener = false;
    }
    map.enableDragging();

    timelinePlaying = false;
    playButton('pause');	
}

// draws a polyline from one point to the next, then moves to the next, panning if possible
function drawLineAndMove() {
    clearTimeout(moveTimer);
    
    if(timePoints[animate+1]) {
        oldpoint = timePoints[animate];
        newpoint = timePoints[animate+1];
        polylines[animate+1] = new GPolyline([oldpoint, newpoint], "#ff0000", 10);
        map.addOverlay(polylines[animate+1]);
			
        map.panTo(newpoint);
			
        newimage = timeToImages[animate+1];
			
        marker = smugImages[newimage]['marker'];
        marker.openInfoWindowHtml(smugImages[newimage]['html']);
			
        moveTimer = setTimeout("doubleCheckListener()", 10000);
        animate++;
    }
    else {
        cleanupTimeline();	
        animateTimeline();
    }
}

// has the address been used?  if so, disable the lat/long.
function addressCheck() {

    if(document.getElementById('SearchAddress').value != "") {
        document.getElementById('SearchLatitude').disabled = true;
        document.getElementById('SearchLongitude').disabled = true;
    }
    else {
        document.getElementById('SearchLatitude').disabled = false;
        document.getElementById('SearchLongitude').disabled = false;
    }
}

// when the window resizes, do our best to resize the map
function resizeMap() {

    if (window.innerWidth) {
        bodyWidth = window.innerWidth;
        bodyHeight = window.innerHeight;
    }
    else {
        if (document.documentElement.clientWidth) {
			bodyWidth = document.documentElement.clientWidth;
			bodyHeight = document.documentElement.clientHeight;
        }
		else {
			bodyWidth = document.body.clientWidth;
			bodyHeight = document.body.clientHeight;
		}
    }

    if(smugImages.length != 0)
        getThumbs(leftOff);
		
    	
}

function checkDataInputRemove() {
    var feedType = document.getElementById('feedType');
    
    if (feedType != null) {
        switch(feedType.value) {
            case 'geoSearch':
                checkInput("<< type search words >>", "Data", "");
                break;
            case 'geoUser':
                checkInput("<< type SmugMug nickname >>", "Data", "");
                break;
            case 'geoCommunity':
                checkInput("<< type SmugMug community >>", "Data", "");
                break;
            case 'geoAlbum':
                checkInput("<< type SmugMug gallery # >>", "Data", "");
                break;
            case 'geoKeyword':
                checkInput("<< type SmugMug keyword >>", "Data", "");
                break
        }
    }
}
	
function checkDataInputAdd() {
    var feedType = document.getElementById('feedType');
    
    if (feedType != null) {
        switch(feedType.value) {
            case 'geoSearch':
                checkInput("", "Data", "<< type search words >>");
                break;
            case 'geoUser':
                checkInput("", "Data", "<< type SmugMug nickname >>");
                break;
            case 'geoCommunity':
                checkInput("", "Data", "<< type SmugMug community >>");
                break;
            case 'geoAlbum':
                checkInput("", "Data", "<< type SmugMug gallery # >>");
                break;
            case 'geoKeyword':
                checkInput("", "Data", "<< type SmugMug keyword >>");
                break
        }
    }	
}
	
	
// since the data varies depending on the feed search, adjust accordingly
function feedTypeChange(clearField) {
	clearField = (clearField == undefined) ? true : clearField;
    var feedType = document.getElementById('feedType');
	   
    if (feedType != null) {
        switch (feedType.value) {
            case "geoAll":
                var feedSearchName = 'n/a:';
                document.getElementById('Data').disabled = true;
                document.getElementById('Data').style.display = "none";
                document.getElementById('nearField').style.display = "inline";
                break;
            case "geoSearch":
                var feedSearchName = 'searchWords:';
                document.getElementById('Data').disabled = false;
                document.getElementById('Data').style.display = "inline";
                document.getElementById('nearField').style.display = "inline";
                if (clearField) {
                    document.getElementById('nearField').value = "<< address >>";
                    document.getElementById('Data').value = "<< type search words >>";
                }
                break;
            case "geoUser":
                var feedSearchName = 'nickname:';
                document.getElementById('Data').disabled = false;
                document.getElementById('Data').style.display = "inline";
                document.getElementById('nearField').style.display = "none";
                if (clearField) {
                    document.getElementById('nearField').value = "";
                    document.getElementById('Data').value = "<< type SmugMug nickname >>";
                }
                break;
            case "geoCommunity":
                var feedSearchName = 'community:';
                document.getElementById('Data').disabled = false;
                document.getElementById('Data').style.display = "inline";
                document.getElementById('nearField').style.display = "none";
                if (clearField) {
                    document.getElementById('nearField').value = "<< address >>";
                    document.getElementById('Data').value = "<< type SmugMug community >>";
                }
                break;
            case "geoAlbum":
                var feedSearchName = 'gallery #:';
                document.getElementById('Data').disabled = false;
                document.getElementById('Data').style.display = "inline";
                document.getElementById('nearField').style.display = "none";
                if (clearField) {
                    document.getElementById('nearField').value = "";
                    document.getElementById('Data').value = "<< type SmugMug gallery # >>";
                }
                break;
            case "geoKeyword":
                var feedSearchName = 'keyword:';
                document.getElementById('Data').disabled = false;
                document.getElementById('Data').style.display = "inline";
                document.getElementById('nearField').style.display = "inline";
                if (clearField) {
                    document.getElementById('nearField').value = "<< address >>";
                    document.getElementById('Data').value = "<< type SmugMug keyword >>";
                }
                break;
        }
    }
}
   
// lets us have a dynamic set of thumbnails on the side which grow/shrink depending on browser sizes
function getThumbs(goHere) { 
    startHere = goHere;
    leftOff = startHere;

    // hack?  ask Jimmy
    thumbOffset = (document.getElementById('thumbstrip').offsetTop < 1) ? 186 : document.getElementById('thumbstrip').offsetTop;
    			
    usableHeight = bodyHeight - thumbOffset - document.getElementById('bottomrow').offsetHeight-50;			
    showTotal = Math.floor(usableHeight/110);
    sendOut = '<table border="0" cellspacing="0" cellpadding="0"><tr><td colspan="2"><table border="0" cellpadding="0" cellspacing="0" width="100%" style="margin-bottom: 5px;"><tr><td align="left">';
       		
    if (startHere <= 0) {
        startHere = 0;
        sendOut += '&nbsp;';
    }
    else {
        sendOut +=  '<a href="javascript:getThumbs('+(startHere-showTotal)+');">&lt; previous<\/a>&nbsp;';
    }  
    		
    sendOut += '<\/td><td align="right">';
    sendOut += (startHere+showTotal >= smugImages.length) ? '&nbsp;' : '&nbsp;<a href="javascript:getThumbs('+(startHere+showTotal)+');">next &gt;<\/a>';
    
    /*
    		if (startHere+showTotal >= smugImages.length) { 
    			sendOut += '&nbsp;';
    		}
    		else {
    			sendOut +=  '&nbsp;<a href="javascript:getThumbs('+(startHere+showTotal)+');">next &gt;<\/a>';
    		}
    */
    
    sendOut += '<\/td><\/tr><\/table><\/td><\/tr>';
    
    for (i = 0; i< showTotal; i++) {
        if (startHere < smugImages.length) {
            sendOut += '<tr style="height: 110px"><td style="height: 110px">'+(startHere+1)+'.<\/td><td><a href="javascript:MoveToAndOpen(smugImages['+startHere+'][\'point\'], smugImages['+startHere+'][\'marker\'], smugImages['+startHere+'][\'html\'], 1);"><img src="'+smugImages[startHere]["photo"]+'" border="0" hspace="0" vspace="0" alt="" class="imgBorder" style="margin: 0px 0px 10px 10px;" \/><\/a><\/td><\/tr>'; 	
            startHere++;
        } 
    }
    sendOut += "<\/table>";
    document.getElementById("thumbstrip").innerHTML = sendOut;
} 
    	
    	

// Creates a marker whose info window displays the photo's html
function createMarker(point, html, icon) {
		
    var marker = new GMarker(point, icon);

    // Show this marker's html in the info window when it is clicked
    GEvent.addListener(marker, "click", function() {
			
        infoWindow = map.getInfoWindow();
			
        if(marker.getPoint() != infoWindow.getPoint()) {
            map.closeInfoWindow();
        }
			
        if(infoWindow.isHidden()) {
            marker.openInfoWindowHtml(html);		
        }
        else {
            if(marker.getPoint() == infoWindow.getPoint()) {
                map.closeInfoWindow();
            }
        }
    });

    return marker;
} 	
	
	
// ajax functions
function handleJS(response) {
	eval(response);
}
function ajax_encode_array(dataToEncode) {
	var post_data = '';
	for (var key in dataToEncode) {
		post_data += '&' + encodeURIComponent(key) + '=' + encodeURIComponent(dataToEncode[key]);
	}
	if(post_data.length == 0) { return ''; }
	return post_data.substring(1);
}
function ajax_query(callbackFunction, url, postArray, asText) {
	function ajax_bind_callback() {
		if(req.readyState == 4) {
			if(req.status == 200) {
				if(ajax_callback) {
					//alert(ajax_callback);
					if(asText) {
						ajax_callback(req.responseText);
					}
					else {
						ajax_callback(req.responseXML);
					}
				}
				else {
					alert('no callback defined');
				}
			}
			else {
				alert('there was a problem retrieving the xml data:\n' + req.status + ':\t' + req.statusText + '\n' + req.responseText);
			}
		}
	}
	function ajax_create_xmlhttp() {
		var req = false;
		// branch for native XMLHttpRequest object
		if(window.XMLHttpRequest) {
			try {
				req = new XMLHttpRequest();
			} catch(e) {
				req = false;
			}
		// branch for IE/Windows ActiveX version
		} else if(window.ActiveXObject) {
			try {
				req = new ActiveXObject("Msxml2.XMLHTTP");
			} catch(e) {
				try {
					req = new ActiveXObject("Microsoft.XMLHTTP");
				} catch(e) {
					req = false;
				}
			}
		}
		if(req) {
			req.onreadystatechange = ajax_bind_callback;
		}
		return req;
	}
	var ajax_callback = null;
	var req = null;
	ajax_callback = callbackFunction;
	var req = ajax_create_xmlhttp();
	if (!req) { 
		return false; 
	}
	if(postArray) {
		req.open("POST",url,true);
		req.setRequestHeader('Content-type', 'application/x-www-form-urlencoded; charset=UTF-8');
		req.send(ajax_encode_array(postArray));
	}
	else {
		req.open('GET',url,true);
		req.send(null);
	}
}


function getImagesFromFeed(feedURL) {
	//toggleDIV('ajaxWorking','','block');
	postArray = new Array();
	postArray['tool'] = 'getImages';
	postArray['feedURL'] = feedURL;
	ajax_query(handleJS, webServer+'/RPC/maps.smug', postArray, true);
}

function initNewData(minLat, minLong, maxLat, maxLong) {

	feedTypeChange(false);
	// add all the overlays
    resizeMap();
	//getThumbs(leftOff);
			
    if (document.getElementById("photoCount") != null)
        document.getElementById("photoCount").innerHTML = smugImages.length;
			
    if(hideThumbs == false) {
        unhideThumbs();
    }
    
    startZoom = 17;
    
    if (minLat != undefined && minLong != undefined && maxLat != undefined && maxLong != undefined) {
        var bounds = new GLatLngBounds(new GLatLng(minLat, minLong), new GLatLng(maxLat, maxLong));
    }

    newZoom = (specificZoom != -1) ? specificZoom : ((bounds != undefined) ? map.getBoundsZoomLevel(bounds) : 17);
    latLng = (specificLat != undefined) ? new GLatLng(specificLat, specificLong) : ((bounds != undefined) ? bounds.getCenter() : new GLatLng(startLat, startLong));

    map.setCenter(latLng, newZoom, G_HYBRID_MAP);
			
    for(i = 0; i < smugImages.length; i++) { 
			
        // stupid hack, IE sometimes was showing doubles for some reason.
				
        if(smugImagesDone[i] != "true") {
            if(smugImages[i]['latitude'] == specificLat && smugImages[i]['longitude'] == specificLong) {
                map.addOverlay(smugImages[i]['marker']);
                smugImages[i]['marker'].openInfoWindowHtml(smugImages[i]['html']);
            }
            else {
                timerLength = i * 100;
                setTimeout("map.addOverlay(smugImages[" + i + "]['marker'])", timerLength);
                //GLog.write("Lat: " + smugImages[i]['latitude'] + " Long: " + smugImages[i]['longitude']);
            }
            smugImagesDone[i] = "true";
        }

    }

    //map.removeControl(overviewControl);
    //map.addControl(overviewControl, overviewPosition);
}		

function unhideThumbs() {
	//alert("unhiding thumbs!");
	var ajaxLoadPhotos = document.getElementById("ajaxLoadPhotos");
	var thumbArea = document.getElementById("thumbArea");
	
    if (ajaxLoadPhotos != null)
        ajaxLoadPhotos.style.display = "none";
        
    if (thumbArea != null)
        thumbArea.style.display = "block";
}
		

// check input boxes for values and sub if needed
function checkInput(checkFor,checkHere,useThis) {
    if(document.getElementById(checkHere).value == checkFor) {    
        document.getElementById(checkHere).value = useThis;
    }
}

function changeLocation(lat, long) {
    document.getElementById("Latitude").value = lat;
    document.getElementById("Longitude").value = long;
    
    map.clearOverlays();
    
    var point = new GLatLng(lat, long);
    var marker = createMarker(point, imageInfo, icons['green']);
    map.addOverlay(marker);
    map.setCenter(point, map.getZoom(), map.getCurrentMapType());
}