var is_current_image_up = false;
var fade_duration = 1.0;
var current_image_number = 0;
var show_time;
var loop_time_ms = 4000;
//start
function start_slideshow(){
    
    //set first screen
    var images  = $('images_container').childElements();
    var src = images[0].src;
    var current_image = new Element( "div", {"id":"current_image"} );
    current_image.setStyle({"background":"url("+src+")"});
    $('slideshow').insert( current_image );
    
    //set next screen
    src = images[1].src;
    var next_image = new Element( "div", {"id":"next_image"} );
    next_image.setStyle({"background":"url("+src+")"});
    $('slideshow').insert( next_image );

    //start loop
    is_current_image_up = false;
    show_time = setInterval( "start_loop()", loop_time_ms );
}

function start_loop(){
    if ( is_current_image_up ) {
	fadedin = "current_image";
	fadedout = "next_image";
	is_current_image_up = false;
    }
    else { 
	fadedin = "next_image";
	fadedout = "current_image";
	is_current_image_up = true;
    }
    new Effect.Opacity(fadedin, { from: 1.0, to: 0.0, duration: fade_duration })
    new Effect.Opacity(fadedout, { from: 0.0, to: 1.0, duration: fade_duration } );

    //change image
    var images  = $('images_container').childElements();
    if ( current_image_number == images.length-1  ){
	current_image_number = 0;
    }
    else {
	current_image_number ++;
    }
    if (images[ current_image_number ])
    {
    	var src = images[ current_image_number ].src;
    }
    else
    {
    	var src = images[0].src;
    }
    $(fadedout).setStyle({"background":"url("+src+")"});
}



function on_close(event){
    //stop all animation
    clearInterval( show_time );
    //start collapse animation
    new Effect.SlideUp('slideshow', {duration: 1.0});
}