//======================================================
// BEGIN DOCUMENT ONLOAD EVENT
//======================================================
// As a rule, you should always put this at the top of the page, just to make it easy to find things. I
// always mark the beginning and end of the ready function to ensure I don't put something inside (or outside) of 
// that function block on accident. Also, define global variables either in a single section or near the 
// functions that use them. For larger projects with more global variables, I'll make a declarations section at 
// the very top, but for smaller stuff or one time use stuff, I put the globals near the functions that use 
// them for easy reference. I know, best practices for client-side javascript, who'd a thunk it? 8-p
$(document).ready(function($) {
	Sys.Application.add_init(application_init);

	//post-fix to EDG content styles using jQuery - bound to end request event
	EDGUpdate();
	
	// Color Box Slideshows
	if($("#TopTourLink").length) {
		$("a[rel='TopTour']").colorbox({slideshow:true,scalePhotos:false,InitialWidth:500,InitialHeight:500,current:'{current} of {total}&nbsp;&nbsp;<a class="ColorBoxLink" href="/TOUR.aspx">Full Tour >></a>',slideshowSpeed:10000,slideshowStop:'pause',slideshowStart:'resume'});
	}
	else {
		$("#cboxOverlay").hide();
	}

	$("#VideoTourLink").colorbox({width:667, height:457});

	$(".OrderNow").hover(function() {
		$(this).attr('src','/Portals/0/OrderNow_hover.png')}, function() { $(this).attr('src','/Portals/0/OrderNow2.png');
	});
	
	$(".TakeTheTour").hover(function() {
		$(this).attr('src','/Portals/0/TakeTheTour_hover.png')}, function() { $(this).attr('src','/Portals/0/TakeTheTour.png'); 
	});
	
	$(".featurepane_title").corner("tl tr 10px");
	$(".featurepane_content").corner("bl br 10px");
	$(".menuslide ul").corner("bl br 5px");

	$(".featurepane_title").hover(function() {
	 	$(this).css("background-color", "#fff");
		$(this).next(".featurepane_content").css("background-color", "#f2e8e0");
	 }, function() {
		$(this).css("background-color", "#f2e8e0");
		$(this).next(".featurepane_content").css("background-color", "#e7d3c2");
	 });

	$(".featurepane_content").hover(function() {
	 	$(this).css("background-color", "#f2e8e0");
		$(this).prev(".featurepane_title").css("background-color", "#fff");
	 }, function() {
		$(this).css("background-color", "#e7d3c2");
		$(this).prev(".featurepane_title").css("background-color", "#f2e8e0");
	 });
	
	if($("a[rel='ftour']").colorbox != undefined){
		$("a[rel='ftour']").colorbox({slideshow:true,scalePhotos:false,scrolling:false,current:'{current} of {total}',slideshowSpeed:10000,slideshowStop:'pause',slideshowStart:'resume'});
	}

	$("#featurepaneIntuitive").click(function() {
		$("#ftourIntuitiveStart").click();
	});
	$("#featurepaneFAACharts").click(function() {
		$("#ftourFAAChartsStart").click();
	});
	$("#featurepaneFlightPlanning").click(function() {
		$("#ftourFlightPlanningStart").click();
	});
	$("#featurepaneAirportData").click(function() {
		$("#ftourAirportDataStart").click();
	});
	$("#featurepaneSpatialAwareness").click(function() {
		$("#ftourSpatialAwarenessStart").click();
	});
	$("#featurepaneDataUpdates").click(function() {
		$("#ftourDataUpdatesStart").click();
	});

});

function application_init()
{
	var prm = Sys.WebForms.PageRequestManager.getInstance();
	prm.add_endRequest(prm_endRequest);
}

function prm_endRequest()
{
	EDGUpdate();
}

function EDGUpdate()
{
	//first, a little cleanup - some qtips get stuck in the ear...er...on the page
	jQuery(".qtip").remove(); 
	 
	//rounded corner on main background
	if(jQuery(".EDGcontentbgrd").length)
		jQuery(".EDGcontentbgrd").corner('10px');
		
	//integrating qtip with Easy DNN Gallery - this requires we bind to the endRequest event of the callbacks done by the EDG update panel
	if(jQuery(".EDGimage a, .EDGvideo a, .EDGaudio a").length){
		jQuery(".EDGimage a[title], .EDGvideo a[title], , .EDGaudio a[title]").each(function(){
			if(jQuery(this).attr("title").length){
				//remember the old title - this is used by the pretty photo
				jQuery(this).attr("oldtitle", jQuery(this).attr("title"));
				
				//better tool tips
				jQuery(this).qtip({
									show: 		{ effect: {type: 'slide', length: 200 } },
									hide: 		{ effect: {type: 'fade', length: 400 } },
									position: 	{ adjust: { screen: true }, corner: { target: 'topMiddle', tooltip: 'bottomMiddle' }  },
									style: 		{ name: 'cream', color: '#000000', border:  {width:5, radius: 5}, width: {min:180, max:300}, tip: true },
									tip:		{ color: '#000000' }
								});
			}
		});	

		
	}

	//there's a bug in the Easy DNN Gallery that doesn't properly append to the URL in the breadcrumb for nested galleries - this fixes
	if(jQuery(".nestedBreadCrumb a[href]:last").length){
		var url = jQuery(".nestedBreadCrumb a[href]:last").attr("href").toString();

		if(url.indexOf("?") > -1)
		{
			jQuery(".nestedBreadCrumb a:last").attr("href", "#");
		}
	}
  
    //if we have a back button, tip the button and the breadcrumb link to help with backwards nav
	if(jQuery(".btnGalleryBack").length) {
		//better tool tips
		jQuery(".btnGalleryBack, .nestedBreadCrumb a[href]:first").qtip({
							content:	'Click Here to Return to Tour Home',
							show: 		{ effect: {type: 'slide', length: 200 } },
							hide: 		{ effect: {type: 'fade', length: 200 } },
							position: 	{ adjust: { screen: true }, corner: { target: 'bottomMiddle', tooltip: 'topMiddle' }  },
							style: 		{ name: 'cream', color: '#000000', border:  {width:5, radius: 5}, width: {min:180, max:300}, tip: true },
							tip:		{ color: '#000000' }
		});
	}
	
	//move gallery descriptions into a tip
	if(jQuery(".DescriptionImage").length){
		jQuery(".DescriptionImage").each(function(){
			var galleryDesc = jQuery(this).html();
			jQuery(this).parent().siblings(".EDGmain").qtip({
							content:	galleryDesc,
							show: 		{ effect: {type: 'slide', length: 200 } },
							hide: 		{ effect: {type: 'fade', length: 200 } },
							position: 	{ adjust: { screen: true }, corner: { target: 'topMiddle', tooltip: 'bottomMiddle' }  },
							style: 		{ name: 'cream', color: '#000000', border:  {width:5, radius: 5}, width: {min:180, max:300}, tip: true },
							tip:		{ color: '#000000' }
			});
			jQuery(this).parent().hide();
		});
	}
}
