var $imgcon=null;
var images=null;
var tempimage=null;
var $image=new Array(2);
var iCurrentImage=-1;
var iCurrentVisible=1;
var bw;
var bh;
var iXStart=new Array(2);
var iYStart=new Array(2);
var iXStop=new Array(2);
var iYStop=new Array(2);
var dtStart=new Array(2);
var iImageDelay=7500;


$(document).ready(function()
{
	//Container vorhanden?
	$imgcon=$('div[id^=imgcontainer]');
	if($imgcon[0]==null) return;
	//ID extrahieren
	var iID=parseInt($imgcon.attr('id').substr(12));
	if((isNaN(iID))||(iID<1)) return;
	//Rahmengr��e
	bw=parseInt($('#tlimage').css('width'));
	bh=parseInt($('#tlimage').css('height'));
	//Container vorbereiten
	$imgcon.empty();
	$imgcon.css({'position':'relative', 'overflow':'hidden'});
	$image[0]=$(document.createElement('img')).appendTo($imgcon).hide().css({'position':'absolute'});
	$image[1]=$(document.createElement('img')).appendTo($imgcon).hide().css({'position':'absolute'});	
	//Bilderliste laden
	$.getJSON('/service/getmediabyid.aspx', {'id':iID, 'rnd':1, 'max':0, 'folder':0, 'nochache': Math.random(), 'fields':'f'}, imagesLoaded);	
});

function makeImagePath(s)
{
	s='/umbraco/imagegen.ashx?image=/media/'+s+'.jpg&width='+(bw*2)+'&height='+(bh*2)+'&constrain=true&compression=75';
	return s;
}

function imagesLoaded(data)
{
	//Liste sichern
	images=data;	
	//Bilder vorladen
	$.each(images, function(elem){var i=new Image; i.src=makeImagePath(elem.f);});
	//Erstes Bild zeigen
	if(images.length>0) showNextImage();
	//Bildrollen aktivieren
	for(var i=0; i<2; i++)
	{
		dtStart[i]=new Date();
		iXStart[i]=0; iXStop[i]=0;
		iYStart[i]=0; iYStop[i]=0;
	}
	setInterval(scrollImage, 25);
}

function showNextImage()
{
	//N�chste bild
	iCurrentImage++;
	if(iCurrentImage>=images.length) iCurrentImage=0;
	//Bild laden
	tempimage=new Image();
	tempimage.src=makeImagePath(images[iCurrentImage].f);
	//Toggle
	iCurrentVisible=1-iCurrentVisible;
	//Einblenden start
	fadeImages();
}

function fadeImages()
{
	//Geladen
	if(!tempimage.complete) {setTimeout(fadeImages, 25); return;}
	//Umblenden
	$image[iCurrentVisible][0].src=tempimage.src;
	$image[iCurrentVisible].fadeIn(iImageDelay/2, function(){setTimeout(showNextImage, iImageDelay);});
	$image[1-iCurrentVisible].fadeOut(iImageDelay/3);
	//Bildgröße
	var iw=parseInt(tempimage.width);
	var ih=parseInt(tempimage.height);
	var f=bw/iw;
	var f2=bh/ih;
	if(f>f2) f=f2;
	iw*=f; 
	ih*=f;
	$image[iCurrentVisible].attr('width', parseInt(iw)*2).attr('height', parseInt(ih)*2);
	//Startposition
	iX=Math.random();
	iY=Math.random();
	if(Math.random()>0.5) iY=Math.round(iY); else iX=Math.random(iX);
	iXStart[iCurrentVisible]=-parseInt(tempimage.width)/2*iX;
	iXStop[iCurrentVisible]=-parseInt(tempimage.width)/2*(1-iX);
	iYStart[iCurrentVisible]=-parseInt(tempimage.height)/2*iY;
	iYStop[iCurrentVisible]=-parseInt(tempimage.height)/2*(1-iY);
	$image[iCurrentVisible].css({'left':iXStart[iCurrentVisible]+'px', 'top':iYStart[iCurrentVisible]+'px'});	
	dtStart[iCurrentVisible]=new Date();
}



function scrollImage()
{
	for(var i=0; i<2; i++)
	{
		var	dtNow=new Date();
		var r=(dtNow.getTime()-dtStart[i].getTime())/(iImageDelay*2);		
		if(r>1) r=1;
		var iX=Math.round(iXStart[i]+((iXStop[i]-iXStart[i])*r));
		//var iY=Math.round(iYStart[i]+((iYStop[i]-iYStart[i])*r));
		$image[i].css({'left':iX+'px', 'top':iY+'px'});	
	}
}