$(document).ready(function()
{	


/*
	SEARCHBAR
*/
	$("#searchForm").submit(function()
	{
		var url = 'http://gdata.youtube.com/feeds/api/videos?q=' + 
		$('#searchText').val() + 
		'&alt=json-in-script&callback=showMyVideos&max-results=7&format=5';
		
		$.getScript(url);
		return false;
	}); 



/*
	TABS
*/
	// create tabs and handle them
	$("#tabNav").tabs();


/*
	CONTROLBAR
*/
	// if video is playing than start interval for moving the time bar
	$(".handler1").everyTime(1000,function(i)
	{
		var playing = $(".playPausebutton1").attr("alt");
		if (playing == "Pause")
		{
			$(".handler1").css("left", getHandlerPosition("player1"));
		}
	});
	$(".handler2").everyTime(1000,function(i)
	{
		var playing = $(".playPausebutton2").attr("alt");
		if (playing == "Pause")
		{
			$(".handler2").css("left", getHandlerPosition("player2"));
		}
	});
	// Makes time bar moveable and also allows to seek forward
	$(".slider1").slider(			   
	{
		handle :".handler1",
		slide: function(e, ui)					// while object is dragged, do this:
		{
			var handlerPos1 = $(".handler1").position().left;
			setTime("player1", handlerPos1);
		}			   
	});
	$(".slider2").slider(			   
	{
		handle :".handler2",
		slide: function(e, ui)					// while object is dragged, do this:
		{
			var handlerPos2 = $(".handler2").position().left;
			setTime("player2", handlerPos2);
		}			   
	});	

	// Watch the Play / Pause Buttons
	$(".playPausebutton1").click(function()
	{  
		playPause("player1");
	});	
	
	$(".playPausebutton2").click(function()
	{  
		playPause("player2");
	});


/*
	CROSSFADER
*/
	$("#crossfader").slider(
	{
		handle :"#crossfaderHandler",
		slide: function(e, ui)				// while object is slided, do this:
		{
			var reglerPos = $("#crossfaderHandler").position().left;
			setVolume(reglerPos);				// calls volumeControl to adjust the volume of the videos
		},
	});


/*
	UTILITY BUTTONS
*/
	$("#volumeButton").click(function()
	{  
		var volume = $("#volumeButton").attr("alt"); // Alt value will be: Mute or Unmute
		if (volume == "Unmute")
		{
			unMuteVideos("mute");
			$(this).attr({ src: "img/volumeOff.png", alt: "Mute" });
		}
		else
		{
			unMuteVideos("unmute");
			$(this).attr({ src: "img/volumeOn.png", alt: "Unmute" });
		}
	});


});