//<![CDATA[
    
// ----------- GLOBAL Variables -----------------------------------
var geocoder;   // The Geocoder Variable
var map;  		// THE Gloabal Map Variable
var username;	// the Logged in username?
var loggedin = false;
var loggedInPoints; // can we get this?
var currentPoint; // the currently selected point?
var currentIteration = 0; // in case u make multiple points on map?
var currentIterationClick = 9999; // in case u make multiple points on map?
var currentZoom = 12;
var customMarkers = new Array();
var mapMarkers = new Array();
var holdCoords = false;

var baseIcon;  // used for icons.

var currentStory = -1;

function selectMap(){
	document.getElementById('maptab').setAttribute((document.all ? 'className' : 'class'),'selectedtab');
	document.getElementById('friendstab').setAttribute((document.all ? 'className' : 'class'),'unselectedtab');
	document.getElementById('metab').setAttribute((document.all ? 'className' : 'class'),'unselectedtab');
	
	document.getElementById('mapcontent').style.display = "block";
	document.getElementById('searchcontent').style.display = "block";
	document.getElementById('friendcontent').style.display = "none";
	document.getElementById('mecontent').style.display = "none";
}
function selectFriends(){
	document.getElementById('maptab').setAttribute((document.all ? 'className' : 'class'),'unselectedtab');
	
	document.getElementById('friendstab').setAttribute((document.all ? 'className' : 'class'),'selectedtab');
	document.getElementById('metab').setAttribute((document.all ? 'className' : 'class'),'unselectedtab');
	document.getElementById('searchcontent').style.display = "none";
	document.getElementById('mapcontent').style.display = "none";
	document.getElementById('friendcontent').style.display = "block";
	document.getElementById('mecontent').style.display = "none";

	getFriendsData();
}
function selectMe(){
	document.getElementById('maptab').setAttribute((document.all ? 'className' : 'class'),'unselectedtab');
	document.getElementById('friendstab').setAttribute((document.all ? 'className' : 'class'),'unselectedtab');
	document.getElementById('metab').setAttribute((document.all ? 'className' : 'class'),'selectedtab');
	
	document.getElementById('searchcontent').style.display = "none";
	document.getElementById('mapcontent').style.display = "none";
	document.getElementById('friendcontent').style.display = "none";
	document.getElementById('mecontent').style.display = "block";
	
	updateGrapheety();
}

function showMap(){
	document.getElementById('mapcontent').style.display = "block";
}

function loginEnter(input) {
    input.onkeydown = function(e) {
        e = e || window.event;
        if (e.keyCode == 13) {
            updateLoginState();
            input.blur();
            return false;
        }
    };
}


function clearMapMarkers(){	
	for (var i in mapMarkers){
		map.removeOverlay(mapMarkers[i]);
	}
	mapMarkers = new Array();
}

function clearCustomMarkers(){	
	for (var i in customMarkers){
		map.removeOverlay(customMarkers[i]);
	}
	customMarkers = new Array();
}


function initLoginMap(userid) {

	username = userid;
	loggedin = true;

	clearCustomMarkers();	
		
	clearMapMarkers();

	insertDataOnClick();
	
	if (currentStory > 0) {
		getCoordinatesOfStory(currentStory);
	}
}

// getPageSize()
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
//
function getPageSize(){

	var xScroll, yScroll;

	if (window.innerHeight && window.scrollMaxY) {
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight >

document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}

	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement &&

document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}

	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else {
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}


	arrayPageSize = new

Array(pageWidth,pageHeight,windowWidth,windowHeight)
	return arrayPageSize;
}


function addStoryToMapFromDatabase(lat,lon,storyTitle,storyDate,userIdFromMap,index,storyId,ratedTest, ratingNumber, votes){			
			var username = userIdFromMap;
			var title = storyTitle; 
			var date = storyDate; 

			var letter = String.fromCharCode("A".charCodeAt(0) + index);
 			var icon = new GIcon(baseIcon);
  			icon.image = "/Images3/markers/" + letter + ".png";
  	
			var myPoint = new GPoint(lon,lat);			
			var rating = "";
			for (var z=0; z < parseInt(ratingNumber); z++) {
				//alert("inside");
				rating = rating + "<img border=0 src='/Images3/star_on.gif'>";
			}
							
			if (!mapMarkers[storyId]){
				mapMarkers[storyId] = new GMarker(myPoint, {icon:icon, title: userIdFromMap + ": " + storyTitle}); // added icon
				map.addOverlay(mapMarkers[storyId]);
			}
			
	  		var myhtmlHeader 	= "<div style='padding:10px;padding-top:12px;'>" +
	  							  "<a href='javascript:void(0);' style='position:absolute;top:0px;right:0px;' onclick='closeCustomWindow(" + storyId + ");'><img border=0 src='/Images3/x_on.gif'></a>" +					  
	  							  "<div style='height:36px;color:white;'>" + 
	  							  "<span class='headerTitle' id='headerTitle" + storyId + "'>" + title + "</span> | <span class='headerDate'>"+ date + " </span>" +
	  							  " | <span class='headerRating' id='headerRating" + storyId + "'>" + rating + " " + votes + " votes</span>" +
	  							  "</div>";
								
			var mystoryTab 	= "<div>" + 
							  "<iframe id='storyFrame" + storyId + 
							  "' name='storyFrame" + storyId +
						   	  "' frameborder='0' style='width:520px;height:246px;' src='/grapheety/story.view.controller?storyid=" + storyId+ "'></iframe>" + 
						   	  "</div>" +
						   	  "<div style='margin-top:5px;'>" + 
						   	  "<input type=button style='position:absolute;left:10px;' onclick='shareStory(\"http://" + location.host + "/?story=" + storyId +"\",\"" + storyTitle +"\"," + storyId + ");' class='mybutton' value='Share'/>";
						   	  
			if (loggedin && username == document.getElementById("username").value){
				mystoryTab = mystoryTab + 
							 "<input type=button style='position:absolute;right:10px;' onclick='editStory(" + storyId + ");' id='storyEditButton" + storyId + "' class='mybutton' value='Edit'/>" +
							 "<input type=button style='position:absolute;right:10px;display:none;' onclick='saveStory(" + storyId + ");' id='storySaveButton" + storyId + "' class='mybutton' value='Save'/>" +
							 "";
			}
			
			mystoryTab = mystoryTab + "</div>";
			var comments = "<div id='customComment" + storyId + "' style='display:none;position:absolute;'>" +
						   "<div style='clear:left;margin-bottom:10px;'><iframe  frameborder=0 id='commentFrame" + storyId + "' " +
						   	 	"style='height:155px;width:520px;display:none;' " +
						   	 	"src='/grapheety/comments.view.controller?action=get&storyid=" + storyId + "'>" + 
						   "</iframe></div>";
			if (loggedin){			
				comments = comments + "<div id='voteArea" + storyId +"' style='margin-top:10px;margin-bottom:10px;'>Checking to see if you voted...</div>";
				comments = comments +		   "<div style='margin-top:10px;margin-bottom:10px;'>Comments:</div>";
				comments = comments +		   "<div style='margin-top:10px;margin-bottom:10px;overflow:visible;'>";
				comments = comments + 		   "<input type='text' name='text2CommentsInput" + storyId + "' value='' onclick='this.focus();' id='text2CommentsInput" + storyId + "' style='width:520px' class='textinput' size=30/>";
				comments = comments +		   "</div>";
				comments = comments +		   "<div style='margin-top:10px;margin-bottom:10px;'><div onclick='postComment(" + storyId + ",document.getElementById(\"text2CommentsInput" + storyId + "\").value);document.getElementById(\"text2CommentsInput" + storyId + "\").value = \"\";' class='mybutton longfakewhite'>Comment</div>";
				comments = comments +		   "</div>";			
			} else {
				comments = comments + 
						   "<div style='margin-top:10px;margin-bottom:10px;'>" + 
						   "You must Sign In to enter comments." + 
						   "</div>";	
			}
			
			comments = comments + "</div></div>";
						
			// if it's open, don't reopen it.
			if (currentStory == storyId && map.getInfoWindow().isHidden()) { 
				if (!customMarkers[storyId]){					
					clearCustomMarkers();
					customMarkers[storyId] = new ELabel(mapMarkers[storyId].getPoint(), myhtmlHeader + mystoryTab, "customwindow",new GSize(-270,-39));
					map.addOverlay(customMarkers[storyId]);
				}

				for (var i=0;i<jsonLegend.coords.length;i++){
					if (jsonLegend.coords[i].id==currentStory) { 
						jsonLegend.coords[i].selected = true; 
					}
				}
			}

			GEvent.addListener(mapMarkers[storyId], "click", function() {
			
				currentStory = storyId;
			  	if (!customMarkers[storyId]){			  	
			  		clearCustomMarkers();
			  		
			  		//customMarkers[storyId] = new ELabel(mapMarkers[storyId].getPoint(), myhtmlHeader + mystoryTab + comments, "customwindow",new GSize(-270,-39));
					customMarkers[storyId] = new ELabel(mapMarkers[storyId].getPoint(), myhtmlHeader + mystoryTab, "customwindow",new GSize(-270,-39));
					
					map.addOverlay(customMarkers[storyId]);
					
					map.panTo(map.fromDivPixelToLatLng(new GPoint(map.fromLatLngToDivPixel(mapMarkers[storyId].getPoint()).x,
																  map.fromLatLngToDivPixel(mapMarkers[storyId].getPoint()).y-200)));
			  		
			  	}	
				  	
			});
			GEvent.addListener(mapMarkers[storyId], "mouseover", function() {});	
			GEvent.addListener(mapMarkers[storyId], "mouseout", function() {});
			GEvent.addListener(mapMarkers[storyId], "infowindowclose", function() {
				if (currentStory!=storyId){
					document.getElementById("coordsRow" + storyId).className= "resultbox coordsRowReturn";
				}
				if (currentStory == storyId){
			  		currentStory = -1;
				}
			});
			
}

// ----------- SEARCH CODE ---------------------------------------
// addAddressToMap() is called when the geocoder returns an
// answer.  It adds a marker to the map with an open info window
function closeShareStory(storyId){
	document.getElementById("shareemails").style.display = "none";
	document.getElementById("sharepersonalmessage").style.display = "none";
	document.getElementById("shareemailstatus").style.display = "none";
		document.getElementById('hideIt').style.display = "none";
		document.getElementById('shareStory').style.display = "none";
		document.getElementById("storyFrame" + storyId ).style.display = "block";
}	
function closeCustomWindow(storyId){
		clearCustomMarkers();
		currentStory = -1;
}

function linkCreateUser(){
	
	location.href='/CreateUser.html';
}
function shareStory(url,title, storyId){
	var html = "<a href='javascript:void(0);' style='position:absolute;top:1px;right:1px;' onclick='closeShareStory(" + storyId + ");'><img border=0 src='/Images3/x_on.gif'></a>";
	
	html = html + "<div style='color:#FFFFFF;font-weight:bold;padding:5px'>" + title + "</div>";
	
	html = html + "<div class='sharetext' style='padding:5px'>You want to share:<br>";
	html = html + "<a style='color:#FFFFFF;' href=" + url + ">" + url + "</a></div>";

	
	// reddit, digg, etc. links
	html = html + "<div style='padding:5px'>";
	html = html + "<span>";
	html = html + "	<a href=\"http://del.icio.us/post?url=" + url + "&amp;title=" + title + "\" title=\"del.icio.us:" + title + "\">";
	html = html + "		<img src=\"/Images3/delicious.png\" border=\"0\" alt=\"del.icio.us:" + title + "\" /></a>";
	html = html + "	";


	html = html + "	<a href=\"http://digg.com/submit?phase=2&amp;url=" + url + "&amp;title=" + title + "\" title=\"digg:" + title + "\">";
	html = html + "		<img src=\"/Images3/digg.png\"  border=\"0\" alt=\"digg:" + title + "\" /></a>";
	html = html + "	";

	html = html + "		<a href=\"http://wists.com/r.php?c=&amp;r=" + url + "&amp;title=" + title + "\" title=\"wists:" + title + "\">";
	html = html + "	<img src=\"/Images3/wists.png\"  border=\"0\" alt=\"wists:" + title + "\" /></a>";
	html = html + "";

	html = html + "	<a href=\"http://reddit.com/submit?url=" + url + "&amp;title=" + title + "\" title=\"reddit:" + title + "\">";
	html = html + "		<img src=\"/Images3/reddit.png\"  border=\"0\" alt=\"reddit:" + title + "\" /></a>";
	html = html + "	";

	html = html + "	<a href=\"http://www.gifttagging.com/gift/add?url=" + url + "&amp;title=" + title + "\" title=\"gifttagging:" + title + "\">";
	html = html + "		<img src=\"/Images3/gifttagging.png\"  border=\"0\"  alt=\"gifttagging:" + title + "\" /></a>";
	html = html + "	";
	html = html + "</span>";

	html = html + "</div>";
	// end reddit digg links
	
	html = html + "<div class='sharetext' style='padding:5px'>Import e-mail addresses: <br><span class='sharetext' style='font-size:9;'>Powered by Plaxo</span></div><div class='sharetext' style='padding:5px'><input type='button' onclick=\"showPlaxoABChooser('shareemails', '/Plaxo/plaxo_cb.html'); return false\" class='mybutton' value='Import'> " + 
				  "</div>";
	
	html = html + "<div class='sharetext' style='padding:5px'>Add other e-mail addresses (comma seperated): <br><textarea  class='textinput gTextArea' id='shareemails' cols=35 rows=10></textarea></div>";
	
	html = html + "<div class='sharetext' style='padding:5px'>Include a message (optional):<br><textarea class='textinput gTextArea' id='sharepersonalmessage' cols=35 rows=10>Check this out!</textarea></div>";

		
	html = html + "<div class='sharetext' style='padding:5px'><input type='button' onclick='shareStorySend();' class='mybutton' value='Share'></div>";
	
	html = html + "<div class='sharetext' id='shareemailstatus' style='color:#FFFFFF;padding:5px'></div>";
	
	document.getElementById("storyFrame" + storyId).style.display = "none";
	document.getElementById('shareStory').innerHTML = html;
	document.getElementById('shareStory').style.display = "block";
	
	document.getElementById('hideIt').style.display = "block";
	document.getElementById('hideIt').style.height = getPageSize()[1]; // full page
	document.getElementById('hideIt').style.width = getPageSize()[0];
	document.getElementById("shareemails").style.display = "block";
	document.getElementById("sharepersonalmessage").style.display = "block";
	document.getElementById("shareemailstatus").style.display = "block";
}

function myMouseOver(object){
	var mySrc = object.src; // mybutton
	
}

function myMouseOut(image){
	
}
function openBlog(){
	var html = "<div class='sharetext' style='padding:5px'>Update Preferences</div> ";
 	html = html + "<div class='sharetext' style='padding:5px;'>  New Password:</div>";
 	html = html + "<div class='sharetext' style='padding:5px;'>  	<input  class='textinput createUserBox' type='password' name='newpassword' id='newpassword' /></div>";
 	html = html + "<div class='sharetext' style='padding:5px;'>  Verify New Password:</div>";
  	html = html + "<div class='sharetext' style='padding:5px;'> 		<input  class='textinput createUserBox' type='password' name='password2' id='password2' /></div>";
	html = html + "<div class='sharetext' style='padding:5px;'> E-mail updates:</div>";
	html = html + "<div class='sharetext' style='padding:5px;'>   		<input type='checkbox' name='emailUpdates' id='emailUpdates' value='emailUpdates' checked/><label class='sharetext' for='emailUpdates'>Get E-mail Updates</label><br></div>";
	html = html + "<div class='sharetext' style='padding:5px'><a href='javascript:void(0);' onclick='sendPreferences();'><img border='0' src='/Images3/save.gif'></a></div>";
	
	document.getElementById('blog').style.display = "block";
	document.getElementById('hideIt').style.display = "block";	
	document.getElementById('hideIt').style.height = getPageSize()[1];	
	document.getElementById('hideIt').style.width = getPageSize()[0];
}

function closeBlog(){
	document.getElementById('hideIt').style.display = "none";
	document.getElementById('blog').style.display = "none";
}

function openPreferences(){
	getPreferences(); // ajax call for preferences
	//document.getElementById('displaymystoriesdiv').style.overflow = "hidden";
	document.getElementById('preferences').style.display = "block";
	document.getElementById('preferencesStatus').innerHTML = "";
	document.getElementById('hideIt').style.display = "block";	
	document.getElementById('hideIt').style.height = getPageSize()[1];
	document.getElementById('hideIt').style.width = getPageSize()[0];
}

function openProfile(){
	getProfile(); // ajax call for preferences
	document.getElementById('displaymystoriesdiv').style.overflow = "hidden";
	document.getElementById('profile').style.display = "block";
	//document.getElementById('profileStatus').innerHTML = "";
	document.getElementById('hideIt').style.display = "block";	
	document.getElementById('hideIt').style.height = getPageSize()[1];
	document.getElementById('hideIt').style.width = getPageSize()[0];
}

function jumpToCity(response) {
if (!response || response.Status.code != 200) {
		alert("Sorry, we were unable to find that address");
	} else {
		place = response.Placemark[0];
		point = new GLatLng(place.Point.coordinates[1],
		                    place.Point.coordinates[0]);
		map.setCenter(point,14);	
	}
}
// this is for a geocoded address. This is called by showLocation()
function addStoryToMap(response) {	      
	if (!response || response.Status.code != 200) {
		alert("Sorry, we were unable to geocode that address");
	} else {
		place = response.Placemark[0];
		point = new GLatLng(place.Point.coordinates[1],
		                    place.Point.coordinates[0]);
		closeCustomWindow(currentStory);   
		currentStory = -1; 
		// just set center here and put a marker down
		map.setCenter(point,15);
		if (loggedin) { 
			addNewStory(false, point);			
		}
	}
}
		
// showLocation() is called when you click on the Search button
// in the form.  It geocodes the address entered into the form
// and adds a marker to the map at that location.
function showLocation() {
	var myStory = document.getElementById('searchBar').value;
	currentStory = -1;
        clearCustomMarkers();	
	geocoder.getLocations(myStory, addStoryToMap);
}

function showLocationByStoryId(storyId){
	getCoordinatesOfStory(storyId);	
}

function enlarge(imageId,height,width,postusername,storyid) {
	//make a large picture
	//alert("large pic of: " + storyId + " count: " + count);
	document.getElementById('bigPicture').style.marginLeft = "-" + ((parseInt(width))/2) + "px";
	document.getElementById('bigPicture').innerHTML="<div style='position:absolute;top:0px;right:-40px'><a href='javascript:void(0);' onFocus='if(this.blur) this.blur();' onclick='minimizeBigPicture(" + storyid + ")'><img border=0 src='/Images3/x_on_white.gif'></a></div><div><img height=" + height + " width=" + width + " src='/grapheety/image.view.controller?imageid=" + imageId + "&size=large'><div><span style='position:absolute;right:20px;'>By :: " + postusername +"</span></div></div>";
	
	//document.getElementById('hideIt').className = "greyOut";
	document.getElementById('hideIt').style.display = "block";
	document.getElementById('bigPicture').style.display="block";
	document.getElementById('hideIt').style.height = getPageSize()[1]; // full page
	document.getElementById('hideIt').style.width = getPageSize()[0];
	document.getElementById("storyFrame" + storyid ).style.display = "none";
	
}

function minimizeBigPicture(storyid){
	document.getElementById('bigPicture').style.display="none";
	document.getElementById('hideIt').style.display = "none";
	document.getElementById('hideIt').style.height = "100%";
	document.getElementById("storyFrame" + storyid ).style.display = "block";
}

function closePreferences(){
	document.getElementById('displaymystoriesdiv').style.overflow = "auto";
	document.getElementById('preferences').style.display="none";
	document.getElementById('hideIt').style.display = "none";
	document.getElementById('hideIt').style.height = "100%";
}

function closeProfile(){
	document.getElementById('displaymystoriesdiv').style.overflow = "auto";
	document.getElementById('profile').style.display="none";
	document.getElementById('hideIt').style.display = "none";
	document.getElementById('hideIt').style.height = "100%";
}

function closeChangePassword(){
	document.getElementById('changepassword').style.display="none";
	document.getElementById('hideIt').style.display = "none";
	document.getElementById('hideIt').style.height = "100%";
}

function openChangePassword(){
	document.getElementById('changepassword').style.display="block";
	document.getElementById('hideIt').style.display = "block";
	document.getElementById('hideIt').style.height = getPageSize()[1];
	document.getElementById('hideIt').style.width = getPageSize()[0];
}

function showLocationStory(thisStory) {
	geocoder.getLocations(thisStory, addStoryToMap);
}
	
function showRandomStories(coords,i){

	currentStory = coords[i];
	getCoordinatesOfStory(coords[i]);
	
	if (i < coords.length - 1){
		setTimeout("showRandomStories(randomCoords," + (i + 1) + ");",10000);
	}
}
	
// used by insertdata on click and another...
function addNewStory(marker, point){
		if (!marker && customMarkers.length !=0 && customMarkers[currentStory] != null) {
			// if point is not within marker, clear the markers
			if (map.fromLatLngToDivPixel(point).x < map.fromLatLngToDivPixel(customMarkers[currentStory].getPoint()).x - 270
				|| map.fromLatLngToDivPixel(point).x > map.fromLatLngToDivPixel(customMarkers[currentStory].getPoint()).x + 270
				|| map.fromLatLngToDivPixel(point).y > map.fromLatLngToDivPixel(customMarkers[currentStory].getPoint()).y - 27
				|| map.fromLatLngToDivPixel(point).y < map.fromLatLngToDivPixel(customMarkers[currentStory].getPoint()).y - 402) {
				//if (window.location.hostname == "dev.grapheety.com") {
				currentStory = -1;
				clearCustomMarkers();	
				 
			}
		}	
		if (!marker && customMarkers.length == 0) { // make sure you didn't click on a marker.
			//alert("adding to event, map, iteration: " + currentIterationClick);
			currentIterationClick++;
			// put user information in here
			var htmlHeaderNew 	= "<div style='background:#FFFFFF;width:540px;height:270px;padding:0px;padding-right:10px;overflow:hidden;'>" +
								     	
								  					
								      	  "<div style='margin-top:10px;margin-bottom:10px;font-weight:bold;'>By :: " +  username + "</div> " + 
								      	  "<div>" + 
								   		 	  "<iframe style='float:right;width:246px;height:227px;border-color:#000000;border-style:solid;border-width:0px;' width=246px height=227px ID='iframeuploadmap" + currentIterationClick + 
								  					"' NAME='iframeuploadmap" + currentIterationClick + "' FRAMEBORDER=0 SCROLLING=NO src='/imagepost/storyupload.html'></iframe>" +
								  				
								  					
								  	  	  "<input type='text' length='22' style='width:275px;' class='textinput' name='gname" + 
								  					currentIterationClick + 
								  					"' id='gname" + 
								  					currentIterationClick + 
								  					"' value='A Distinguished Title'>" +
								  		   
								  		  
								  				
								  				"<textarea rows='3' cols='32' id='gstory" + currentIterationClick + "'  style='width:275px;height:143px;margin-top:10px;margin-bottom:10px;' class='textinput' >" +
								 			 		 	"Tell everyone a good story..." + 
								 			 	"</textarea>" + "" +
								 		
								 			 	"<div style='margin-bottom:10px;' id='storyTabDiv" + currentIterationClick + "'>" +
								 			 	
								 			 	 "<form style='margin:0px;' name='gform" + currentIterationClick + 
								  					"' id='gform" + currentIterationClick + "'>" +
								  					
								  					"<input type=radio name='gstatus' id='gstatus' value='1' checked>Public" + 
					              					"<input type=radio name='gstatus' id='gstatus' value='0'>Private " + 
					              				"</form>" + 
					              				"</div>" + "" +
					              				"<div  id='storyTabDivSubmit" +  currentIterationClick + "' style='margin-bottom:10px;'>" + 
					              					"<input type='button' onclick='submitStory("+  currentIterationClick + ")' class='mybutton' value='Tag It!'>" + 
				
					              				"</div>" +
					              			"</div>" + 
					              			"<div id='storyTabDivSuccess" + currentIterationClick + "' style='visibility:hidden;position:absolute;'>Submitted Story</div>" + 
					              			
								  		
								  			"</div>" + // keep iframe even
								  			
								  "</div>"; // outer div
			
			
			// Our info window content for a new item
			var infoTabsNew = [
		  		new GInfoWindowTab("Story", htmlHeaderNew)
		  		//new GInfoWindowTab("Picture", htmlHeaderNew + pictureTabNew)
			];	
		
			currentPoint=point;
			//alert("inserting at: " + currentPoint.lat());
			
			var icon = new GIcon(baseIcon);
  			icon.image = "/Images3/markers/blank.png";

			var newMarker = new GMarker(point, {icon:icon, title: "New Story"});					//Create a new marker
			map.addOverlay(newMarker);							//Add marker to the map
			
			
			newMarker.openInfoWindowTabsHtml(infoTabsNew); 		//Create infotab (gavin test)
			
			
			//alert("open info window 4");
			GEvent.addListener(newMarker, "click", function() {	// listen if you click on Marker, to open its info
			  	newMarker.openInfoWindowTabsHtml(infoTabsNew);
			  	
			}); 
			GEvent.addListener(newMarker, "infowindowclose", function() {	// listen if you click on Marker, to open its info
			  	refreshMap();
			}); 
		}
	
}
		
var hybridOnce = true;
function showLocationCoords(lat,lon,storyId, style) {

	// show map
	document.getElementById('mapcontent').style.display = "block";
	currentStory = storyId;
	var height = 10;
	try {
		height = map.getBounds().getNorthEast().lat() - map.getBounds().getSouthWest().lat();
	} catch (e) {
		height = .0849929857698;  // based on pre-chosen zoom level.
	}

	var offset = 0; //(height/2)*8/10;

	if (style == "set"){
		//map.setCenter(new GLatLng(lat + (offset/10),lon))
		holdCoords = true;
		map.setCenter(new GLatLng(lat + offset,lon),currentZoom);
		
		holdCoords = false;
		map.panBy(new GSize(0,190));
		
		if (hybridOnce) {
			//map.setMapType( G_HYBRID_TYPE );
			hybridOnce = false;
		}
		
	} else {
		map.panTo(map.fromDivPixelToLatLng(new GPoint(map.fromLatLngToDivPixel(new GLatLng(lat,lon)).x,
													  map.fromLatLngToDivPixel(new GLatLng(lat,lon)).y-200)));			  	
	}
}	

// findLocation() is used to enter the sample es into the form.
function findLocation(findStory) {
	document.getElementById('searchBar').value = findStory; // q is the name of the search field
	showLocation();
}

var onetimelogincheck = 0;

function refreshMap(){
	clearCustomMarkers();
	clearMapMarkers();
	map.clearOverlays(); // for the one infowindow
	MyApplication.prototype.onMapClick();
}

function insertDataOnClick() {
	GEvent.addListener(map, "click", function(marker, point) {

		addNewStory(marker, point);
	});
}
function editStory(storyId){
	//alert("edit"); 
	document.getElementById("storyFrame" + storyId).src= "/grapheety/story.edit.controller?storyid=" + storyId + "&username=" + document.getElementById("username").value;
	document.getElementById("storyEditButton" + storyId).style.display = "none";
	document.getElementById("storySaveButton" + storyId).style.display = "block";
}

function move(){
	alert("move ended");
	//GEvent.addListener(map,"moveend",move());
}

// ----------------------- TEST FROM GOOGLE -----------------------------------
function MyApplication() {
  	this.map = map;
  	GEvent.bind(this.map, "moveend", this, this.onMapClick);
}

MyApplication.prototype.onMapClick = function() {
	
	if (holdCoords){ return; }
	clearMapMarkers();
	var southWestLat = map.getBounds().getSouthWest().lat();
	var southWestLng = map.getBounds().getSouthWest().lng();
	var northEastLat = map.getBounds().getNorthEast().lat();
	var northEastLng = map.getBounds().getNorthEast().lng();

  	getGrapheetyInCoords(southWestLat,southWestLng,northEastLat,northEastLng,coordsSetIndex);
}

function initMapSequence(){
	
	getRandomStories(); // gets like 5 es and displays them 1 by 1 ?

}
// ------------------------- TEST FROM GOOGLE ---------------------------

// load() is the primary function when the body is done loading this initializes everything.	
function load() {

	selectMap(); // select home tab on panel
    if (GBrowserIsCompatible()) {
    	
		// Create the map
		map = new GMap2(document.getElementById("map"));
		
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.addControl(new GScaleControl());
		map.addControl(new GOverviewMapControl());

		var application = new MyApplication();
		
		//map.setMapType(G_HYBRID_MAP);
		// create the geocoder
		geocoder = new GClientGeocoder();
				
		// Center the map
		// Create a base icon for all of our markers that specifies the
		
		// shadow, icon dimensions, etc.
		baseIcon = new GIcon();
		baseIcon.shadow = "/Images3/markers/Shadow.png";
		baseIcon.iconSize = new GSize(54, 54);
		baseIcon.shadowSize = new GSize(54, 54);
		baseIcon.iconAnchor = new GPoint(23, 46);
		baseIcon.infoWindowAnchor = new GPoint(20, 10);
		
		var query=this.location.search.substring(1);
		
    	if (query.length > 0){
    	
	        var params=query.split("&");
	        var found = false;
	        
	        for (var i=0 ; i<params.length ; i++){
	            var pos = params[i].indexOf("=");
	            var name = params[i].substring(0, pos);
	            var value = params[i].substring(pos + 1);
	            
	            //alert("<dt>" + i + ":" + name + "<\/dt>" + "<dd>" + value + "<\/dd>");
	            if (name == "story") {
	            	showLocationByStoryId(parseInt(value));  // go to the Id
	            	found = true;
	            } else {
	            	//alert("bad get string.");
	            }
	            if (name == "zoom") {
	            	found = true;
	            	currentZoom = parseInt(value);
	            }
        	}
        	
        	if (!found) { 
        	
        		// coming from facebook. Set width to 600 and start map
        		document.getElementById('outside').style.width='620px';
        		initMapSequence(); 
        		
        		}
        		
    	} else {
    	
    		// view  a random location?
    		document.getElementById('outside').style.width='800px';
    		
    		initMapSequence();
    		
    		
    	}
		
		GEvent.addListener(map, "zoomend", function() {	//Add listener so when u click the window pops up
			currentZoom = map.getZoom();
			if (currentStory > 0){
		  		getCoordinatesOfStory(currentStory);
			}
			
		});
			
	if (onetimelogincheck == 0){
		onetimelogincheck++;
	}
	
	alreadyIn(); // check to see if you are already in...
		
      } // if browser works
      else {
      	alert("Your browser is not compatible with Google Maps.");
      }
} // end load
//]]>