var imgs = null;
var curImg = 0;
var channelhop = 15000;

$(function(){
	
	$.ajax({
		url: "/ajaxcontent.php",
		type: "GET",
		data: ( {cls : 'Portfolio' , method: 'getExamples' } ),
		dataType: "json",
		success: 	function(response){
						imgs = response;
						$.preLoadImages(imgs,'imgurl');

						$('#tvscreen').tmpl( ).prependTo('#primary-content');
						
						$('#noise').hide();
						
						$('#channel-up').click(function(){
							changeChannel(1);
						});
						
						$('#channel-down').click(function(){
							changeChannel(0);
						});
						
						$('#show-item img').css({'position':'relative'});
						
						setTimeout('changeChannel()',2000);
					}
	});
	
});

function changeChannel ( dir )
{
	channelhop = clearInterval(channelhop);
	channelhop = setInterval('changeChannel()',15000);
	toggleNoise();
	
	if (dir == -1)
	{
		curImg--;
	}
	else
	{
		curImg++;
	}
	if ( curImg < 0 )
	{
		curImg	=	imgs.length - 1;
	}
	
	if ( curImg >= imgs.length )
	{
		curImg	=	0;
	}

	$('#show-item img')
		.attr('src', imgs[curImg].imgurl)
		.stop(true,false);
	$('#channel').html( (curImg+1) );
	setTimeout( 'toggleNoise()' , 150 );
	animateScreen();
	
}

function showChannel( id )
{
	
}

function toggleNoise(  )
{
	$('#noise').toggle();
}

function animateScreen()
{
	var mask = $('#show-item');
	var xdiff = imgs[curImg].width - mask.width();
	var ydiff = imgs[curImg].height - mask.height();

	var ellipse_params = {
		center: [ -xdiff/2 , -ydiff/2 ],  
		radius: ydiff/2,
		axis: xdiff/ydiff ,
		start: 359,
		end: 0
	};
	var tme = (xdiff+ydiff) * 30;
	var args = { path : new $.path.ellipse( ellipse_params ) };
	startScreen($('#show-item img'),args,tme);
	
}

function startScreen(el,args,time)
{
	el.animate(args,time,'linear',function(){
		startScreen(el,args,time);
	});
}