window.addEvent('domready',function(){
    if($('ospredje')){
        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);
        });
    }
		
		
});