/*
rubydogmovies.com jQuery source V1.0
written by Dave Kiss
http://www.davekiss.com

     _                                       _     ____                _       
  __| | ___   ___ _   _ _ __ ___   ___ _ __ | |_  |  _ \ ___  __ _  __| |_   _ 
 / _` |/ _ \ / __| | | | '_ ` _ \ / _ \ '_ \| __| | |_) / _ \/ _` |/ _` | | | |
| (_| | (_) | (__| |_| | | | | | |  __/ | | | |_ _|  _ <  __/ (_| | (_| | |_| |
 \__,_|\___/ \___|\__,_|_| |_| |_|\___|_| |_|\__(_)_| \_\___|\__,_|\__,_|\__, |
                                                                         |___/ 
*/


$(document).ready(function(){

	//Clear form fields once on click
	$('input[type=text],input[type=password]').one("focus", function() {
		$(this).val("");
	});

	// Create the video selector, using the JQueryTools' "Scrollable" class
	$(".scrollable").scrollable({ 
    	size: 5,
     	hoverClass: "hoverItem"
	});
	
	//grab the scrollable API for the movielist filter Callback function
	var api = $(".scrollable").scrollable();
	
	//Set Youtube ID for the initial video to display by grabbing the id attribute from the 
	//first video thumbnail image and append it to the container
	var initialVid = $(".item").children('img').attr("id");
	$("#youtubePlayer").append('<object id="youtube" type="application/x-shockwave-flash" style="width:488px; height:300px;" data="http://www.youtube.com/v/' + initialVid + '&hl=en_US&fs=1&hd=1"><param name="movie" value="http://www.youtube.com/v/' + initialVid + '&hl=en_US&fs=1&hd=1" /><param wmode="transparent"></param></object>');
	
	//Add onclick function for each video item - load a new video when clicked and add style to "active" video
	
	$(".item").click(function() {		
		var yt_vid = $(this).children('img').attr("id");

		$("#youtubePlayer").fadeOut(300, function() {
			$("#youtubePlayer").html('<object id="youtube" type="application/x-shockwave-flash" style="width:488px; height:300px;" data="http://www.youtube.com/v/' + yt_vid + '&hl=en_US&fs=1&hd=1"><param name="movie" value="http://www.youtube.com/v/' + yt_vid + '&hl=en_US&fs=1&hd=1" /><param wmode="transparent"></param></object>');
			
			$('#youtubePlayer').fadeIn(1000);
		});
	});





/*
 _____ _           _           __  __            _      
|  ___(_)_ __   __| |   __ _  |  \/  | _____   _(_) ___ 
| |_  | | '_ \ / _` |  / _` | | |\/| |/ _ \ \ / / |/ _ \
|  _| | | | | | (_| | | (_| | | |  | | (_) \ V /| |  __/
|_|   |_|_| |_|\__,_|  \__,_| |_|  |_|\___/ \_/ |_|\___|

*/
                                                        
	// Define function to filter videos based on query
	function filter(item, query) {  
		query =   $.trim(query); 				//trim white space
		query = query.replace(/ /gi, '|'); 		//add OR for regex query
		
		$(".item").each(function() {
			($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).hide().removeClass('visible') : $(this).show().addClass('visible');
		});  
	}
	
	// Attach Filter field to Video List
	
	//default each row to visible  
	$('.item').addClass('visible');
	
	$('#findMovie').keyup(function(event) {
	
		//if esc is pressed or nothing is entered
		//if esc is pressed we want to clear the value of search box  
		if (event.keyCode == 27 || $(this).val() == '') {
			$(this).val('');  
			//we want each video to be visible because if nothing is entered then all videos are matched.  
			$('.item').removeClass('visible').show().addClass('visible');  
		}  

		//if there is text, lets filter. but first, we'll move the scrollable div to the beginning of the list
		else {
			api.begin(200);
			filter('.item', $(this).val());
		} 
	});
	
});
