/**
 * JS for tinePlayer
 */
$(document).ready(function() {
	
	var goodBrowser = checkTheBrowser($.browser);
	
	// sound slider
	$("#soundSlider").slider({
		max : 100,
		min : 0,
		value: 100,
		slide: function (event, ui) {setVolume(event, ui, goodBrowser);}
	});	
	
	// progress slider
	$("#progressSlider").slider({
		max : 100,
		min : 0,
		value: 0,
		slide: function (event, ui) {setTimepoint(event, ui, goodBrowser);}
	});	
	
	// highlighted the first element
	$('.videoElement:first').addClass('activeVideoElement');
	
	// HTML5 - Player
	if(goodBrowser === true) {
		var video = $('#video')[0];
		var timer;
		video.addEventListener('play', function() {
			timer = setInterval(function() {
				var sValue = Math.floor(video.currentTime/video.duration*100);
				var p =  sValue + '%';
				$('#abgespielt').css('width', p);
				$("#progressSlider").slider({value : sValue});
			},500);
		}, false);
		video.addEventListener('pause', function() {
			clearInterval(timer);
		}, false);
	} 
	// Youtube - Player
	else {
		var params = { allowScriptAccess: "always", bgcolor: "#cccccc" };
		var atts = { id: "myytplayer" };
		swfobject.embedSWF("http://www.youtube.com/apiplayer?enablejsapi=1&playerapiid=ytplayer", "videoDiv", "439", "247", "8", null, null, params, atts);		
	}
	
	// play
	$('#playIcon, #video').click(function() { start(goodBrowser, true) });
	
	// stopped
	$('#stopIcon').click(function() { stop(goodBrowser) });
	
	// change video elements
	if($.browser.chrome) {
		$('.playlistSwitcher img').bind('click', $.defer(300, delayed) );
	} else {
		$('.playlistSwitcher img').click(function() {
			changePlaylist($(this).index(), goodBrowser);
		});
	}
	
	// click on thumbnail start the selected video
	$('.videoElement').click(function() {		
		var cleanId = $(this).attr('id').split('vE_');		
		$('.videoElement').removeClass('activeVideoElement');		
	 	$('#vE_' + cleanId[1]).addClass('activeVideoElement');
	 	start(goodBrowser, false);		
	});
	
	$('#soundLess').click(function() {
		soundless(goodBrowser);
	});	
	
	// use own scrollbar
	$('.rightPlayer').jScrollPane({	
		showArrows : 1,
		scrollbarWidth : 19,
		scrollbarMargin : 0
	});			
	
});