$(function(){

	$("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();
	});	




	/*
	$(".mslide_button").click(function(){
		$("div#mastheadslide").animate({height: "450px"}).animate({height: "350px"}, "fast")
		.css({
			'padding-top' : '1em',
			'border-width' : '2px'
		});		
		$(".mslide_button").toggle();

	});	

   $("#hide_mslide").click(function(){
		$("div#mastheadslide").animate({
			height: "0px",
			paddingTop : "0em"
		}, "fast")
		.css({
			'border-width' : '0px'
		});
   });	   
   */






    // for The Search Bar
	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]);
			}
		});
	});
   
   
	
	
	$("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.	
	
	
	
	
	
	// Drop Menu
	$("#dropmenu > li > a + ul").before("<span class=\"menuexpand\">+</span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)
	$("#dropmenu span.menuexpand").click(function() { //When trigger is clicked...

		//Following events are applied to the subnav itself (moving subnav up and down)
		$(this).parent().find("ul:first").slideDown('fast').show(); //Drop down the subnav on click

		$(this).parent().hover(function() {
		}, function(){
			$(this).parent().find("ul").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up
		});

		//Following events are applied to the trigger (Hover events for the trigger)
		}).hover(function() {
			$(this).addClass("subhover"); //On hover over, add class "subhover"
		}, function(){	//On Hover Out
			$(this).removeClass("subhover"); //On hover out, remove class "subhover"
	});		
	


   
	$("#dropmenu ul > li ul").css({display: "none"}); // Opera Fix
	$("#dropmenu li ul li").hover(function(){
		$(this).find('ul:first').css({visibility: "visible",display: "none"}).fadeIn("fast");
	},function(){
		$(this).find('ul:first').css({visibility: "hidden"});
	});
   
	
	//feature image hover
	// Hover Effect on Thumblist (Children Thumbslist)
	$("#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' } });




	//QTIP
	/*
	$('ul#dropmenu > li a[title]').not("ul#dropmenu li ul li a[title]'").qtip({ 
		style: { name: 'dark', tip: true},
		position: {
		  corner: {
			 target: 'bottomMiddle',
			 tooltip: 'topMiddle'
		  }
		},
		hide: { 
			effect: 'fade',
			length: '500'
		}	   
	});	
	*/
		
		
		
		
	$('#children_thumbslist').filterable({
		tagSelector: '#portfolio-filter a',
		selectedTagClass: 'currentfilter',
		useTags: true,
	});

		
		
		
		
		
		
	// JCycle Plugin, used with grab_post_media_content() in functions.php
	$('#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,
			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');		
	});
	
	
	




	

	// Following Jquery works with custom wordpress functions 
	// page_children_thumbs(),page_children_content()
	//
	//
	//	
	// 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;
	});
	/////////////////////////////////////////////////////////////////////////////////




	// Filter Portfolio Jquery
	/*
	$('ul#filter a').click(function() {
		$(this).css('outline','none');
		$('ul#filter .current').removeClass('current');
		$(this).parent().addClass('current');

		var filterVal = $(this).text().toLowerCase().replace(' ','-');

		if(filterVal == 'all') {
			$('ul#children_thumbslist li.hidden').fadeIn('slow').removeClass('hidden');
		} else {

			$('ul#children_thumbslist li').each(function() {
				if(!$(this).hasClass(filterVal)) {
					$(this).fadeOut('normal').addClass('hidden');
				} else {
					$(this).fadeIn('slow').removeClass('hidden');
				}
			});
		}

		return false;
	});
	*/
	

	// Jquery serialScroll Plugin Used 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:1200,
			force:true,
			stop:true,
			lock:false,
			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);

}




jQuery.fn.fadeToggle = function(speed, easing, callback) {
	   return this.animate({opacity: 'toggle'}, speed, easing, callback);
	}; 







Cufon.refresh('#extra');