

/*---------------
	BELOW IS THE COMMUNICATION MODEL FOR THE PARK DETAIL.
	DEVELOPED BY: CODIN PANGELL, FL2 2009
---------------*/

//Global Variables
var _captionList='';

$(document).ready(function(){
	
	$('#main-cta').css('display','none');
	setTimeout('loadCTA()',3000);
	
	//set the get involved information
	getinvolved();
	
	if(window.location.href.toString().indexOf('?campaign=holiday') != -1)
	{
		$('#wrapper').css({'top':'0px'});
		$('#screensaver-btn').css({'backgroundPosition':'0px -35px'});
		$('#get-involved-panel').hide();
		$('#screensaver-panel').show();
		
		panel = 2;
		panelOpen = true;
		
		//setup gallery
		pullGallery('ordernum');
	} else {
		pullGallery();	
	}
});


/*----------------------------------
	Get Involved
----------------------------------*/

function getinvolved(){
	
	$.getJSON("json_interface.aspx?action=getinvolved", function(json) {
		var _html='';
		
		_html+='<div class="get-involved-col">';
				_html+='<h1>'+urldecode(json.involved[0].mainTitle)+'</h1>'
				_html+='<p>'+urldecode(json.involved[0].mainBody)+'<br /><br /><a href="'+urldecode(json.involved[0].volunteerLink)+'" target="_blank"><img src="data/images/adopt-btn.gif" style="border:none;" /></a></p>';
        _html+='</div>';
		_html+='<div class="get-involved-col" id="completed-form">';
        	_html+='<h1>'+urldecode(json.involved[0].stayInformedTitle)+'</h1>';
            _html+='<p>'+urldecode(json.involved[0].stayInformedBody).split('[lbr]').join('<br />')+'</p>';
            _html+='<form name="newsletter-form" id="newsletter-form">';
            _html+='<fieldset>';
            	_html+='<input type="text" id="newsletter-name" name="newsletter-name" value="First Name"  onfocus="if(this.value == \'First Name\') this.value = \'\';" onblur="if(this.value == \'\') this.value = \'First Name\';" style="width:95px;" class="get-involved-text" />&nbsp;';
				_html+='<input type="text" id="last-name" name="last-name" value="Last Name"  onfocus="if(this.value == \'Last Name\') this.value = \'\';" onblur="if(this.value == \'\') this.value = \'Last Name\';" style="width:95px;" class="get-involved-text" />';
                _html+='<input type="text" id="newsletter-email" name="newsletter-email" value="Email" class="get-involved-text" onfocus="if(this.value == \'Email\') this.value = \'\';" onblur="if(this.value == \'\') this.value = \'Email\';" style="width:205px;" />';
				_html+='<input type="text" id="newsletter-zip" name="newsletter-zip" value="Zip Code" class="get-involved-text" onfocus="if(this.value == \'Zip Code\') this.value = \'\';" onblur="if(this.value == \'\') this.value = \'Zip Code\';" style="width:205px;margin-bottom:15px;" /><br />';
				_html+='<input type="button" id="get-involved-submit" value="SUBMIT" onclick="javascript:checkInformed();"/>';
            _html+='</fieldset>';
            _html+='</form>';
			_html+='<br /><p>'+urldecode(json.involved[0].donateBody).split('[lbr]').join('<br />')+'</p>';
        _html+='</div>';
    	_html+='<div class="get-involved-col" id="share-with-friends" style="display:none;">';
        	_html+='<h1>'+json.involved[0].volunterTitle+'</h1>';
            _html+='<p>'+urldecode(json.involved[0].volunteerBody).split('[lbr]').join('<br />')+'<br /><br /><img src="data/uploads/'+json.involved[0].shareThumbnail+'" class="download-thumb" /><a href="data/uploads/'+json.involved[0].shareDownload+'" target="_blank"><img src="data/images/download.gif" /></a></p>';
				
			_html+='<p>Share with your friends</p>';
            _html+='<p><a href="http://www.facebook.com/sharer.php?u='+window.location.toString()+'&title='+json.involved[0].shareFaceBookTitle+'" target="_blank"><img src="data/images/facebook-share.gif" /></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://www.twitthis.com/twit?url='+window.location.toString()+'&title='+json.involved[0].shareTwitterTitle+'" target="_blank"><img src="data/images/twitter-share.gif" /></a></p>';

		_html+='</div>';

		$('#get-involved').html(_html);
	});
	
}
function checkInformed(){
	if ($('#newsletter-name').val()=='First Name'){
		alert("Enter your first name");
		return;
	}
	
	if ($('#last-name').val()=='Last Name'){
		alert("Enter your last name");
		return;
	}
	
	if ($('#newsletter-email').val()=='Email'){
		alert("Enter your email address");
		return;
	}
	if (is_valid_email($('#newsletter-email').val())!=false){
		$.ajax({ type: "POST",
			url: "json_interface.aspx?action=form&username="+$('#newsletter-name').val()+"&last="+$('#last-name').val()+"&email="+$('#newsletter-email').val()+"&zip="+$('#newsletter-zip').val(),
			dataType: "json"
		})
		$('#newsletter-form').css('display','none');
		$('#completed-form').append('<h1 style="color:#8EAEDA">Thank you for your commitment to the National Parks.</h1>');
		$('#share-with-friends').css('display','block');
		
		
		return;
	}else{
		alert("Please enter a valid email address");
	}
	
}

function is_valid_email(email){
	return /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(email);
}


/*----------------------------------
	Load Gallery
----------------------------------*/
function pullGallery(order){

	$('#tag-container').html(''); //clear spots if any exist for previous park.
	
	//reset the position of the container for the images and the spots.
	$('#transition-container').css('left','0px');
	$('#tag-container').css('left','0px');
	
	$.getJSON("json_interface.aspx?action=homeimagegallery&order=" + order, function(json) {
		galleryObj = json;
		var set = 0;
		
		$.each(galleryObj.gallery,function(i,item){

			$('#transition-container').append('<img src="data/uploads/'+item.homepageImage+'" width="20%" height="100%" alt="park" />')
			
			//save captions for image paging
			if (item.parkName!=undefined && item.parkName!=''){
				if (item.stateName!=undefined && item.stateName!=''){
					_captionList+=(item.parkName+', '+item.stateName)+'|';
				}else{
					_captionList+=item.parkName+'|';
				}
			}
			
			//set the spots
			var top = 0;
			
			$.getJSON("json_interface.aspx?action=spots&id="+item.associatedImage, function(json) {
			
				set=(i*20);
				$.each(json.spots,function(y,spotItem){	
					//figure out the total amount possible to display
					
					var offsets = {left:0,right:0}
					
					if (y<=4){
						
						var html = '';
						top += 17;
						var left = Math.floor(Math.random() * 13) + (2 + set); // 2 - 15%, 22 - 35%, 42 - 55%, 62 - 75%, 82 - 95%
						
						
						
						if (y>0 && y<4) {
						
						  if (left<50 && left>42) {
						    
						    left = 42;
						    
						    //left -= offsets.left
						    
						    offsets.left++
						    
						  
						    
						  }
				
						  if (left>=50 && left<55) {
						  
						    left = 55;
						    
						    //left += offsets.right
						    
						    offsets.right++
						    
						  
						    
						  }
						  
						
						}
						  
						
						var _tmp = '';
						if (item.imageInfo.indexOf("^")>0){
							_tmp=item.imageInfo.split("^")[3]; //get index of image in gallery
						}
						html += '<div class="tag" id="tag-' + i+'_'+y + '" style="top:' + top + '%; left:' + left + '%;" onclick="clickSpot('+item.associatedImage+','+y+','+_tmp+',\''+item.imageInfo+'\')">';
						
						// CHECK html += left;
						
						
						
						
						var _cutPhrase1='';
						if (spotItem.personName.length>15){
							_cutPhrase1 = spotItem.personName.substr(0,15)+'...';
						}else{
							_cutPhrase1 = spotItem.personName;
						}
						
						html += '<span class="tag-user-name">'+urldecode(_cutPhrase1)+' '+urldecode(spotItem.personLastName).substr(0,1)+', '+spotItem.personState+'</span>';
						var _cutPhrase='';
						if (spotItem.quote.length>18){
							_cutPhrase = urldecode(spotItem.quote.substr(0,18))+'...';
						}else{
							_cutPhrase = urldecode(spotItem.quote);
						}
						html += '<span class="tag-short-quote">&quot;'+urldecode(_cutPhrase)+'&quot;</span>';
						html += '</div>';
						$(html).appendTo($('#tag-container'));
					}
				});
				
	
			});
		});
		
		
		//for the homepage we want to start the images in a center image so that left and right paging buttons are present.
		var _mid=Math.ceil(galleryObj.gallery.length/2)
		initGallery(galleryObj.gallery.length,_mid,0,_captionList); //nps.js -- pass number of images for a normal Load
		setCaption(_mid-1)
		
	});
		
}
function loadCTA(){
	$('#main-cta').toggle(1000);
}
function setCaption(i){
	$('#park-info-wrapper').html(_captionList.split("|")[i]);
}
function clickSpot(imageid,spotItemIndex,ImageIndex,ImageInfo){
	if (ImageInfo.indexOf("^")>0){
		var _info=ImageInfo.split("^")
		document.location="detail.aspx#/" + _info[0] + "/" + _info[1] + "/" + _info[2] + "/spot/" + imageid + "/" + spotItemIndex + "/" + ImageIndex + "/"
	}
}
/*----------------------------------
	Google Page Tracking
----------------------------------*/

function googleTracker(url)
{
	//alert("PageTracker: "+url);
	//pageTracker._trackPageview(url);
}
