$(document).first().ready(function(){
    var images = new Array();


    function collectImages(){
        images = $(".image-list li").children().toArray();

    }
    function loadNextImage(last){
        var img = images.shift();
        //console.info("loading image: "+img.src);
        $(img).css("position","absolute").css("left","-40px");//.css("top","-50%");
	//alert("remove picture in "+$(last).attr("class"));
        last.children().remove();
	//alert("adding image <"+$(img).attr("src")+"> to <"+$(last).attr("class")+">");
        last.prepend(img);
	//alert("added, now moving current image to the last position");
        images.push(img);
    }
    function singleSlide(){
        var runned = false;
        var childs = $(".outer-frame").children();
        
        childs.animate(
	    {"left":"+=445px"},
	    1000,
	    function(){
		if(!runned){
		    runned=true;
		    //alert("detaching last div");
		    var lastpic=$(".outer-frame").children().last().detach();
		    //alert("move it to the left");
		    lastpic.animate({"left":"-660px"},0);
		    //alert("load next picture in "+$(lastpic).attr("class"));
		    loadNextImage(lastpic);
		    //alert("attaching Image to outer-frame");
		    $(".outer-frame").prepend(lastpic);
		    //console.log(images);
		    //console.log(childs);
		}
		//console.info("pos: "+$(this).position().left);
		//
		//				console.log(images);

	    }
	    
	);
//	console.log(images);
	$(".outer-frame").children().first().next().children().first().animate({"left":"0px"},3000);
    }
    collectImages();
    $.fn.reverse = [].reverse;
    $(".outer-frame > div").reverse().each(
        function(e){
            loadNextImage($(this));
            //console.info("pos: "+$(this).position().left);
        });
    //$('.outer-frame').click(singleSlide);
    var timer = setInterval( singleSlide, 5000);
});