// Functions
var fadeElelementIn = function(divid){
	    divid.set('tween', {duration: '0'});
	    divid.tween('opacity', '1');
}

var fadeImgIn = function(divid){
	    divid.set('tween', {duration: '1000'});
	    divid.tween('opacity', '1');
}

var fadeElelementOut = function(divid){
	    divid.set('tween', {duration: '1500'});
	    divid.tween('opacity', '0');
}



    
// OnLoad
window.addEvent('domready', function() {
    
    // Recursion on Headers
    if ($('headers')) {
        
        var headers = $('headers').getElements('div');
	var objects;
	var i = 0;
	var j = 0;
	var activeheader;
	var tofade;
	var singleobject;
	var singleobject2;
        var a = 0;
	
	// Scope functions
	
	var fadeInRecursion = function() {
        
            new Fx.Tween(singleobject, {
                duration: '500',
                property: 'opacity',
                link: 'chain'
            }).start(1);
        
            i++;
	                

            // Call itself
            if (i < objects.length) {
		singleobject = objects[i];
                fadeInRecursion.delay(150, singleobject, i);
            }

	    if (i == objects.length) {
		i = 0;
		activeheader = objects;
	    }
        }
	
	var fadeOutRecursion = function() {
        
            new Fx.Tween(singleobject2, {
                duration: '100',
                property: 'opacity',
                link: 'chain'
            }).start(0);
        
            j--;

            // Call itself
            if (j >= 0) {
		singleobject2 = activeheader[j];
                fadeOutRecursion.delay(30, singleobject2, j);
            }

        }
	
	// Objects
	
	
	
	// Events
	
	// Load header_content_2
	$('atem1').addEvent('click', function(e) {
		 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]); 
		 
		// Set new to fade in
		objects = $('header_content_01').getElements('li');
		singleobject = objects[0];
                a = 1;
		fadeElelementIn(headers[a]);
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_02')); 

        });
	
        $('atem2').addEvent('click', function(e) {
		 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]); 
		 
		// Set new to fade in
		objects = $('header_content_02').getElements('li');
		singleobject = objects[0];
                a = 2;
		fadeElelementIn(headers[2]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_03'));

        });
        
        $('atem3').addEvent('click', function(e) {
		 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]); 
		 
		// Set new to fade in
		objects = $('header_content_03').getElements('li');
		singleobject = objects[0];
                a = 3;
		fadeElelementIn(headers[a]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_04'));

        });
                   
        $('atem4').addEvent('click', function(e) {
		 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]); 
		 
		// Set new to fade in
		objects = $('header_content_04').getElements('li');
		singleobject = objects[0];
                a = 4;
		fadeElelementIn(headers[a]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_05'));

        });
             
        $('atem5').addEvent('click', function(e) {
		 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]); 
		 
		// Set new to fade in
		objects = $('header_content_05').getElements('li');
		singleobject = objects[0];
                a = 5;
		fadeElelementIn(headers[a]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_06'));

        });       
        
        // Returns - saako koodia tiivistettyä
        
	$('atem1000').addEvent('click', function(e) {
	 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]);
                fadeElelementOut($('header_img_02'));  // Note! Must be set to zero opacity

		// Set new to fade in
		objects = $('header_content_00').getElements('li');
		singleobject = objects[0];
                a = 0;
		fadeElelementIn(headers[0]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_01'));

        });
	
	$('atem1001').addEvent('click', function(e) {
	 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]);
                fadeElelementOut($('header_img_03'));

		// Set new to fade in
		objects = $('header_content_00').getElements('li');
		singleobject = objects[0];
                a = 0;
		fadeElelementIn(headers[0]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_01'));

        });
        
        $('atem1002').addEvent('click', function(e) {
	 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]);
                fadeElelementOut($('header_img_04'));

		// Set new to fade in
		objects = $('header_content_00').getElements('li');
		singleobject = objects[0];
                a = 0;
		fadeElelementIn(headers[0]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_01'));

        });
        
        $('atem1003').addEvent('click', function(e) {
	 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]);
                fadeElelementOut($('header_img_05'));

		// Set new to fade in
		objects = $('header_content_00').getElements('li');
		singleobject = objects[0];
                a = 0;
		fadeElelementIn(headers[0]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_01'));

        });
        
        $('atem1004').addEvent('click', function(e) {
	 
		// Fade out
		j = activeheader.length - 1;
		singleobject2 = activeheader[j];
		fadeOutRecursion(singleobject2);
		fadeElelementOut(headers[a]);
                fadeElelementOut($('header_img_06'));

		// Set new to fade in
		objects = $('header_content_00').getElements('li');
		singleobject = objects[0];
                a = 0;
		fadeElelementIn(headers[0]); 
		fadeInRecursion(singleobject);
                fadeImgIn($('header_img_01'));

        });
        // Main Code
	
	// Block all, but 0 opacity
        
            $('header_img_01').setStyles({
                 display: 'block',
                 opacity: 0
            });     
            
            $('header_img_02').setStyles({
                 display: 'block',
                 opacity: 0
            });
           
            $('header_img_03').setStyles({
                 display: 'block',
                 opacity: 0
            });
              
            $('header_img_04').setStyles({
                 display: 'block',
                 opacity: 0
            });
              
            $('header_img_05').setStyles({
                 display: 'block',
                 opacity: 0
            });
              
            $('header_img_06').setStyles({
                 display: 'block',
                 opacity: 0
            });
            
	headers.each(function(item) {
             
	    var header;
            header = item.get('id');
             $(header).setStyles({
                 display: 'block',
                 opacity: 0
             });    
	       
	    var headerLI = item.getElements('li');
	    headerLI.each(function(item) {
            
		// headeri = item.get('id');
		item.setStyles({
		    display: 'block',
		    opacity: 0
		}); 
	    });
	 
	});
    
    // Begin site
    activeheader = $('header_content_00').getElements('li');
    objects = $('header_content_00').getElements('li');
    singleobject = objects[0];
    fadeElelementIn(headers[0]);
    fadeInRecursion(singleobject);
    fadeImgIn($('header_img_01')); 
    a = 0;
    
     

    }
});