window.addEvent('domready',function(){

    var periodic;        
    var begin=function(){
       periodic=(function(){
        	var active=$$('.active')[0].getProperty('rel');
    		var next= parseInt(active)+1;
    		if(next>$$('.introimage').length)
    			next=1;
    
    		$('goleft').addClass('dn');
    		$('goright').addClass('dn');				
    			
    		fade(active,next);
        }).periodical(5000);
    }
    
    function fade(current,next){
    	var myEffect = new Fx.Morph($('img_'+current), {
    		duration: 'long',
    		transition: Fx.Transitions.Sine.easeOut,
    		onComplete: function(){
    								$('img_'+current).removeClass('active');
    								$('img_'+next).addClass('active');
    								$('goleft').removeClass('dn');
    								$('goright').removeClass('dn');
                                    $clear(periodic);
                                    begin();
    							}
    	});
    	 
    	myEffect.start({
    		'opacity': [1, 0]
    	});
    	
    	var myEffect1 = new Fx.Morph($('img_'+next), {
    		duration: 'long',
    		transition: Fx.Transitions.Sine.easeOut
    	});
    	 
    	myEffect1.start({
    		'opacity': [0, 1]
    	});
    	
    	
    }
    
    $$('.introimage').each(function(el){
    	if(!el.hasClass('active'))
    		el.setStyle('opacity',0);
    });
    
    begin();  //START
    
    $('goleft').addEvent('click',function(el){
        el.stop();
        $clear(periodic);
    	var active=$$('.active')[0].getProperty('rel');
    	var next= parseInt(active)-1;
    	if(next<=0)
    		next=$$('.introimage').length;
    		
    	$('goleft').addClass('dn');
    	$('goright').addClass('dn');
    	
    	fade(active,next);
    });
    
    $('goright').addEvent('click',function(el){
        el.stop();
        $clear(periodic);
    	var active=$$('.active')[0].getProperty('rel');
    	var next= parseInt(active)+1;
    	if(next>$$('.introimage').length)
    		next=1;
    
    	$('goleft').addClass('dn');
    	$('goright').addClass('dn');				
    		
    	fade(active,next);
    });
		
		
});
