$(function(){

	//// Setup the TopSlide
	$("div#topslide").hide();
	$("div#topslide").css({height: '350px'});
		//$("div#topslide").after("<div id='topslidecontrols'><ul><li class='top_button'><a href='#'>About</a></li></ul></div>")
	
	$(".top_button").click(function(){
		$("div#topslide").slideToggle();
		
		if($(this).hasClass('current')) {
			$("a",this).empty().append("About");
			$(this).removeClass('current');
		} else {
			$("a",this).empty().append("HIDE");
			$(this).addClass('current');
		}
		Cufon.refresh();
	});	




    //// Swap Input Value on Focus
	swapValues = [];
	$(".swap_value").each(function(i){
		swapValues[i] = $(this).val();
		$(this).focus(function(){
			if ($(this).val() == swapValues[i]) {
				$(this).val("");
			}
		}).blur(function(){
			if ($.trim($(this).val()) == "") {
				$(this).val(swapValues[i]);
			}
		});
	});
   
   
	
	//// Establish Sucker Fish Jquery Menu
	$("ul.sf-menu").supersubs({ 
		minWidth:    15,   // minimum width of sub-menus in em units 
		maxWidth:    19,   // maximum width of sub-menus in em units 
		extraWidth:  1     // extra width can ensure lines don't sometimes turn over 
						   // due to slight rounding differences and font-family 
	}).superfish();  // call supersubs first, then superfish, so that subs are 
					 // not display:none when measuring. Call before initialising 
					 // containing tabs for same reason.	
	
	

	//// Hover Effect on Thumblist (Children Thumbslist)
	//// See get_postbytags() - functions.php
	$("#content .postbytagchild").hoverIntent(
			// On hover
			function() { 
				$("img",this).removeAttr('title');
				$(".ptag_content",this).animate({ height: "240px" }, 300);
			},
			// Off Hover
			function() { 
				$(".ptag_content",this).animate({ height: "40px" }, 350); 
			}
	);	
	
	

	
	//// DYNAMIC TABS, uses JQueryUI Library
	$(".tabs").tabs({ fx: { height: 'toggle', opacity: 'toggle' } });


	
	////	
	$('#children_thumbslist').filterable({
		tagSelector: '#portfolio-filter a',
		selectedTagClass: 'currentfilter',
		useTags: true,
	});

		
		
	

	

	// Following Jquery works with custom wordpress functions 
	// page_children_thumbs(),page_children_content()
	// 
	// Used to build custome Gallery Template 
	// See Parent Theme file :: page_gallery.php
	//
	//	
	// Intial Page Load Effect, Hide then fade in
	//$('#children_thumbs').hide().fadeIn('slow');;
	$('#page_gallery_template #childrenmenu').hide().slideToggle();
	$('#page_gallery_template #parent_content').hide().slideToggle();
	$('#page_gallery_template #slidetoggle a').hide();
	$('#page_gallery_template .children_content_item').hide();
	//$('#page_gallery_template ul#children_thumbslist li SPAN').hide();
	//
	//
	// Hover Effect on Thumblist (Children Thumbslist)
	$("#page_gallery_template ul#children_thumbslist li").hoverIntent(
			function() { 
				//$(this).animate({ backgroundColor: "#f0f0f0" }, 200);
				$("img",this).removeAttr('title');
				$("SPAN",this).fadeOut("fast"); 
			},
			function() { 
				//$(this).animate({ backgroundColor: "#272727" }, 200); 
				$("SPAN",this).fadeIn("fast"); 
			}
	);
	//
	//
	// Execute State Changes when Slide Toggle is Clicked, Up Button
	$('#page_gallery_template #slidetoggle a').click(function() {
		$('#primary .children_content_item').hide();
		$('ul#children_thumbslist').slideToggle();
		$('#slidetoggle a').hide();
		$('#parent_content').slideToggle();
		// Show the Filter Controls
		$("#children_thumbs_controls").show();
	});
	//
	//
	// Intiate Jquery Cycle when the a children's thumblist link is clicked 
	$('#page_gallery_template ul#children_thumbslist li a').click(function() {
		$("body").css("overflow", "hidden");
		//$('ul#children_thumbslist li SPAN').hide();
		
		// Hide the Filter Controls
		$("#children_thumbs_controls").hide();
		

		// Execute State Changes when Thumbnail was clicked
		$('#parent_content').slideToggle();
		$('.media_controls').hide();
		$('#parent_content .children_content_item').slideUp();

		// Things to do when we click on a non_current link
		// Which indicates that we are clicking on a different Thumbnail
		//if(!$(this).parent().hasClass('current')) {
			//Figure out the class for the Thumbnail that was clicked
			$(this).css('outline','none');


			// Remove li current class, since we will change lasted targeted click	
			$('ul#children_thumbslist li').each(function() {
					$(this).fadeIn('slow').removeClass('current').animate({ backgroundColor: "#272727" }, 250);
			});				


			// Grab the targeted
			var targetclass = $(this).parent().attr('rel');


			// Let's hide all the content items...Each project
			$('#primary .children_content_item').each(function() {	
				$(this).slideUp();
			});

			// And then bring up our targeted content item...the selected project
			$('#primary .'+targetclass).slideDown("slow");


			// Highlight Current Selection for Childern Thumblist
			$(this).parent().fadeIn('slow').addClass('current').animate({ backgroundColor: "#d0d0d0" }, 250);		


			// Active Jcycle for current set of images
			////// JCycle Plulgin Stuff
			// Hide all the controls
			$('.'+targetclass+' .media_controls').hide();
			$('.pause').click(function() { $('.'+targetclass+' .media_assets').cycle('pause'); return false; });
			$('.play').click(function() { $('.'+targetclass+' .media_assets').cycle('resume'); return false; });

			// Check for hover over media elemetns
			$('.media_grouping').hoverIntent(
				function() { $('.media_controls').fadeIn(); },
				function() { $('.media_controls').fadeOut(); }
			);

			// Initiate JCycle
			$('.'+targetclass+' .media_assets').cycle({
				fx:     'fade',
				speed:   400,
				next:   '.next',
				prev:   '.prev',
				timeout: 700,
				nowrap: 0,
				after: adjustHeight  		
			});

			// Make sure it starts off paused
			$('.'+targetclass+' .media_assets').cycle('pause');
		//}


			// Hide Pause/Play
			$('.'+targetclass+' .pause').hide();
			$('.'+targetclass+' .play').click(function(){
				$('.'+targetclass+' .media_assets').cycle('resume'); 
				$('.'+targetclass+' .media_controls').fadeOut(); 
				$(this).hide();
				$('.'+targetclass+' .pause').show(); 			
			});		
			$('.'+targetclass+' .pause').click(function(){  
				$('.'+targetclass+' .media_assets').cycle('pause'); 
				$('.'+targetclass+' .media_controls').fadeOut(); 
				$(this).hide();
				$('.'+targetclass+' .play').show();			
			});



		// FInish executing State Changes when Thumbnail was clicked
		$(this).parent().parent().slideToggle('slow');
		$('#slidetoggle a').show();
		//$('#slidetoggle a span').show();


		$("body").css("overflow", "auto");

		return false;
	});
	/////////////////////////////////////////////////////////////////////////////////






	// JCycle Plugin, used with grab_post_media_content() in functions.php
	// Creates the autogenerated SlideShows
	$('#index_template .children_content, #single_template .children_content, #page_template_default .children_content').each(function(i) {
		//$(this).append(i.toString());

		var targetclass = $(this).children().attr('id');
		//$(this).append(targetclass);

		$('#'+targetclass+' .media_grouping').hoverIntent(
			function() { $('#'+targetclass+' .media_controls').fadeIn(); },
			function() { $('#'+targetclass+' .media_controls').fadeOut(); }  
		);



		////// JCycle Plulgin Stuff
		// Hide all the controls
		$('#'+targetclass+' .media_controls').hide();
		$('#'+targetclass+' .pause').click(function() { $('.'+targetclass+' .media_assets').cycle('pause'); return false; });
		$('#'+targetclass+' .play').click(function() { $('.'+targetclass+' .media_assets').cycle('resume'); return false; });

		// Check for hover over media elemetns


		// Initiate JCycle
		$('#'+targetclass+' .media_assets').cycle({
			fx:     'fade', 
			speed:   2400,
			next:   '#'+targetclass+' .next',
			prev:   '#'+targetclass+' .prev',
			timeout: 700,
			nowrap: 0,
			containerResize: 0,
			after: adjustHeight,
			pager:  '#'+targetclass+' .thumbnav',

			// callback fn that creates a thumbnail to use as pager anchor 
			//var img = $(slide).find("img").eq(0).attr("src");
			pagerAnchorBuilder: function(idx, slide) { 
				// return selector string for existing anchor 
				return '#'+targetclass+' .thumbnav li:eq(' + idx + ') a'; 
			}			

		});

			// Hide Pause/Play
			$('#'+targetclass+' .pause').hide();
			$('#'+targetclass+' .play').click(function(){
				$('#'+targetclass+' .media_assets').cycle('resume'); 
				$('#'+targetclass+' .media_controls').fadeOut(); 
				$(this).hide();
				$('#'+targetclass+' .pause').show(); 			
			});		
			$('#'+targetclass+' .pause').click(function(){  
				$('#'+targetclass+' .media_assets').cycle('pause'); 
				$('#'+targetclass+' .media_controls').fadeOut(); 
				$(this).hide();
				$('#'+targetclass+' .play').show();			
			});

		// Make sure it starts off paused
		$('#'+targetclass+' .media_assets').cycle('pause');		
	});


	
	// Jquery serialScroll Plugin Used with Wordpress Custom Function
	// See function sidescroller_bytags() inside function.php
	$('.slidescroller').each(function(i) {

		var targetid = $(this).attr('id');

		$('#'+targetid+' .scrollcontent').serialScroll({
			items:'div.postbytagchild',
			prev:'#'+targetid+' .scrollboxnav a.previtem',
			next:'#'+targetid+' .scrollboxnav a.nextitem',
			offset:0, //when scrolling to photo, stop 230 before reaching it (from the left)
			start:0, //as we are centering it, start at the 2nd
			duration:8000,
			force:true,
			stop:true,
			//lock:false,
			interval:1,
			cycle:true, //don't pull back once you reach the end
			easing:'easeOutQuart', //use this easing equation for a funny effect
			jump: false //click on the images to scroll to them
		});

	});

		

});



// Works with JCycle, Detects Container item height and adjust entire Container
// accordingly
function adjustHeight(curr, next, opts, fwd) {
	var index = opts.currSlide;
	$('#prev')[index == 0 ? 'hide' : 'show']();
	$('#next')[index == opts.slideCount - 1 ? 'hide' : 'show']();
	//get the height of the current slide
	var $ht = $(this).height();
	//set the container's height to that of the current slide
	$(this).parent().animate({ height: $ht }, 250);

}



// Works with JCycle, Detects Container item height and adjust entire Container
// accordingly
jQuery.fn.fadeToggle = function(speed, easing, callback) {
	   return this.animate({opacity: 'toggle'}, speed, easing, callback);
	}; 


