var slider_timer_obj_arr = new Array();
var slider_timer = null;

function kill_slider_timer()
{
    //alert( timer );
    if( slider_timer )
    {
        clearInterval( slider_timer );
        slider_timer = null;
    }
}

function add_slider_timer( intervalid )
{
    if( slider_timer )
    {
        clearInterval( slider_timer );
    }
    slider_timer = intervalid;
}



function c_slide_show( div_name, image_list, width, height, background_color, zindex, fade_speed, interval_period, pause_period, match_image_size, stop_on_mouse_over, image_ready_callback )
{
    this.image_list = image_list;
    this.match_image_size = match_image_size;
    this.image_list_index = 0;
    this.mouse_is_over = false;
    this.width = width;
    this.height = height;
    this.canvas0_tween = null;
    this.canvas1_tween = null;
    this.interval_period = interval_period;
    this.fade_speed = fade_speed;
    this.interval = null;
    this.current_canvas = 0;
    this.current_fade_position = 90;
    this.fade_complete = false;
    this.is_pause_after_go_to = false;
    this.pause_after_go_to_period = pause_period;
    this.image_ready_callback = image_ready_callback;
    this.name = 'i am the fucking slide show';
    this.container_div = dog( div_name );
    this.container_div.style.zIndex = zindex;
    // !!! copy the this otherwise 'this' will not work !!!
    this.stop_on_mouse_over = stop_on_mouse_over;
    var t_obj = this;
    this.container_div.onmouseover = function( ){ t_obj.mouse_is_over = true; };
    this.container_div.onmouseout = function( ){  t_obj.mouse_is_over = false;};
    
    this.canvas0 = dog( div_name + "_child0" );    
    this.canvas0.style.position = 'absolute';
    this.canvas0.style.width = width + 'px';
    this.canvas0.style.height = height + 'px';
    this.canvas0.style.top = '0px';
    this.canvas0.style.left = '0px';
    this.canvas0.align = 'center';
    this.canvas0.style.zIndex = zindex + 2;
    this.canvas0_tween = new Fx.Tween( div_name + "_child0" );
    this.canvas0.set( 'opacity', 1 ); 
    
    this.canvas1 = dog( div_name + "_child1" );    
    this.canvas1.style.position = 'absolute';
    this.canvas1.style.width = width + 'px';
    this.canvas1.style.height = height + 'px';
    this.canvas1.style.top = '0px';
    this.canvas1.style.left = '0px';
    this.canvas1.align = 'center';
    this.canvas1.style.zIndex = zindex + 1;
    this.canvas1_tween = new Fx.Tween( div_name + "_child1" );
    this.canvas1.set( 'opacity', 0 );    
    this.set_images = function( image_arr )
    {
        this.image_list = image_arr;
    }
    this.set_image_ready_callback = function( callback )
    {
        this.image_ready_callback = callback;
    }
    this.kill = function( )
    {
        kill_slider_timer();
/*        if( this.interval != null )
        {
            clearInterval( this.interval );
            this.interval = null;
            //alert( 'interval cleared' );
        }                          
*/
    }
    this.interval_tic = function( element )
    {
        kill_slider_timer();
        if( ( element.mouse_is_over && this.stop_on_mouse_over ) && element.current_fade_position == 100 && !element.is_pause_after_go_to )
        {
            var interval = setInterval( function(){ element.interval_tic( element ); }, 100 );  // nothing happens wait
            add_slider_timer( interval );
            return;
        } 
        if( element.current_fade_position <= 0 )
        {
            if( element.is_pause_after_go_to )
            {
                element.is_pause_after_go_to = false;
                var interval = setInterval( function(){ element.interval_tic( element ); }, element.pause_after_go_to_period );  // nothing happens wait
                add_slider_timer( interval );
                return;
            } 
            if( element.mouse_is_over && this.stop_on_mouse_over )
            {
                var interval = setInterval( function(){ element.interval_tic( element ); }, 100 );  // nothing happens wait
                add_slider_timer( interval );
                return;
            } 
            // ready go to break
            if( element.image_ready_callback != null )
            {
                element.image_ready_callback( element.image_list_index );
            }
            element.current_fade_position = 100;
            element.image_list_index++;
            if( element.image_list_index >= element.image_list.length )
            {
                element.image_list_index = 0;
            }
            var str = '<img ';
            str += ' src="';
            str += element.image_list[element.image_list_index];
            str += '"';
            if( element.match_image_size )
            {
                str += ' width="';
                str += element.width;
                str += '"';
                str += ' height="';
                str += element.height;
                str += '"';
            }
            str += ' border="0"';
            str += ' >';
            if( element.current_canvas == 0 )
            {
                element.current_canvas = 1;
                element.canvas0.set( 'opacity',  1 );
                element.canvas1.set( 'opacity', 0 );
                element.canvas1.innerHTML = str;
             } 
            else
            {
                element.current_canvas = 0;
                element.canvas0.set( 'opacity',  0 );
                element.canvas1.set( 'opacity', 1 );
                element.canvas0.innerHTML = str;
            } 
            
            var interval = setInterval( function(){ element.interval_tic( element ); }, element.interval_period );  
            add_slider_timer( interval );
        }
        else
        {
            element.current_fade_position -= 2;
            var positive = element.current_fade_position / 100; 
            if( element.current_canvas == 0 )
            {
                element.canvas0.set( 'opacity',  1 - positive );
                element.canvas1.set( 'opacity',   positive );
            }
            else
            {
                element.canvas0.set( 'opacity', positive );
                element.canvas1.set( 'opacity', 1 - positive );
            }
            var interval = setInterval( function(){ element.interval_tic( element ); }, element.fade_speed );  
            add_slider_timer( interval );
        }
    }
    this.next_image = function( )
    {
        
        kill_slider_timer();
        if( this.image_list_index < this.image_list.length - 1 )
        {
            this.image_list_index++;
        }
        else
        {
            this.image_list_index = 0;
        }
        var str = '<img ';
        str += ' src="';
        str += this.image_list[this.image_list_index];
        str += '"';
        if( this.match_image_size )
        {
            str += ' width="';
            str += this.width;
            str += '"';
            str += ' height="';
            str += this.height;
            str += '"';
        }
        str += ' border="0"';
        str += ' >';
        if( this.current_canvas == 1 )
        {
            this.canvas1.innerHTML = str;
        } 
        else
        {
            this.canvas0.innerHTML = str;
        }
        if( this.image_ready_callback != null )
        {
            this.image_ready_callback( this.image_list_index );
        }
        
        this.pause_after_go_to_period;
        this.is_pause_after_go_to = true;
        var t_obj = this;
        var interval = setInterval( function(){ t_obj.interval_tic( t_obj ); }, 100 ); 
        add_slider_timer( interval );
    }
    this.container_div.onclick = function( ){ t_obj.next_image(); };
    this.go_to = function( index )
    {
        
        kill_slider_timer();
        if( index == this.image_list_index )
        {
            if( this.current_canvas == 1 )
            {
                this.canvas0.set( 'opacity',  0 );
                this.canvas1.set( 'opacity',   1 );
            } 
            else
            {
                this.canvas0.set( 'opacity',  1 );
                this.canvas1.set( 'opacity',   0 );
            }
            var interval =  setInterval( function(){ t_obj.interval_tic( t_obj ); }, this.pause_after_go_to_period );  
            add_slider_timer( interval );
        }
        if( index < this.image_list.length )
        {
            this.image_list_index = index;
            var str = '<img ';
            str += ' src="';
            str += this.image_list[this.image_list_index];
            str += '"';
            if( this.match_image_size )
            {
                str += ' width="';
                str += this.width;
                str += '"';
                str += ' height="';
                str += this.height;
                str += '"';
            }
            str += ' border="0"';
            str += ' >';
            if( this.current_canvas == 1 )
            {
                this.canvas1.innerHTML = str;
            } 
            else
            {
                this.canvas0.innerHTML = str;
            }
            this.is_pause_after_go_to = true;
        } 
        if( this.image_ready_callback != null )
        {
            this.image_ready_callback( this.image_list_index );
        }
        var t_obj = this;
        var interval = setInterval( function(){ t_obj.interval_tic( t_obj ); }, 100 );  
        add_slider_timer( interval );
    }
    this.start = function()
    {
        kill_slider_timer();
        var str = '<img ';
        str += ' src="';
        str += this.image_list[this.image_list_index];
        str += '"';
        if( this.match_image_size )
        {
            str += ' width="';
            str += this.width;
            str += '"';
            str += ' height="';
            str += this.height;
            str += '"';
        }
        str += ' border="0"';
        str += ' >';
        this.canvas0.innerHTML = str;

        var str = '<img ';
        str += ' src="';
        if( this.image_list_index >= this.image_list.length )
        {
            str += this.image_list[0];
        }
        else
        {
            str += this.image_list[this.image_list_index + 1];
        }
        str += '"';
        if( this.match_image_size )
        {
            str += ' width="';
            str += this.width;
            str += '"';
            str += ' height="';
            str += this.height;
            str += '"';
        }
        str += ' border="0"';
        str += ' >';
        this.canvas1.innerHTML = str;
        var t_obj = this;
        this.current_fade_position = 0;
        var interval = setInterval( function(){ t_obj.interval_tic( t_obj ); }, this.interval_period );  
        add_slider_timer( interval );
    }
    //this.start();
}
