var ref_loop = 0;
	var ref_items = 5;
	
	window.addEvent('domready', function (){
		var el = $('referentiecontainer');
	
		var myEffect = new Fx.Tween(el);
		$('volgende').addEvent('click', function(e) {
			e.stop();
			ref_loop++;
			if(ref_loop >= ref_items)
				ref_loop = 0;
			margin = (-720		 * ref_loop) + 'px';
			myEffect.start('margin-left', margin);
			pageTracker._trackPageview('/showcase/next');
		});
		
		$('vorige').addEvent('click', function(e) {
			e.stop();
			ref_loop = ref_loop - 1;
			if(ref_loop < 0)
				ref_loop = ref_items - 1;
			margin = (-720 * ref_loop) + 'px';
			myEffect.start('margin-left', margin);
			pageTracker._trackPageview('/showcase/prev');
		});
		
	});

	function opacity(id, opacStart, opacEnd, millisec) {
	    //speed for each frame
	    var speed = Math.round(millisec / 100);
	    var timer = 0;
	
	    //determine the direction for the blending, if start and end are the same nothing happens
	    if(opacStart > opacEnd) {
	        for(i = opacStart; i >= opacEnd; i--) {
	            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
	            timer++;
	        }
	    } else if(opacStart < opacEnd) {
	        for(i = opacStart; i <= opacEnd; i++)
	            {
	            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
	            timer++;
	        }
	    }
	}
	
	window.onload = function() {
		setTimeout('animation(2)',4000);
	}
	
	//change the opacity for different browsers
	function changeOpac(opacity, id) {
	    var object = document.getElementById(id).style;
	    object.opacity = (opacity / 100);
	    object.MozOpacity = (opacity / 100);
	    object.KhtmlOpacity = (opacity / 100);
	    object.filter = "alpha(opacity=" + opacity + ")";
	} 	
	
	var titles = new Array();
	titles[1] = "Touchscreens op de werkvloer";
	titles[2] = "Webinterfaces";
	titles[3] = "CAD Modellen importeren";
	titles[4] = "Ervaren team";
	titles[5] = "Electronica voor serie machines";

	var stories = new Array();
	stories[1] = "Industri&euml;le touchscreens kunnen uw productiviteit vergroten. Bespaar tijd en ergernis doormiddel van intu&iuml;tieve en gebruikersvriendelijke gebruikersinterfaces.";
	stories[2] = "U hoeft niet langer op locatie te zijn om uw apparatuur aan te sturen. Via webinterfaces kunt u vanuit een computer, PDA of GSM uw machine instellen.";
	stories[3] = "Het gebruik van rechtstreekse koppelingen met databases of CAD systemen voorkomt fouten en bespaart arbeid. Wij ontwikkelen deze koppelingen op maat voor u.";
	stories[4] = "Sinds 2002 heeft Wivion met een jong en enthousiast team en aantal uitdagende projecten onder handen genomen. Bel ons voor meer informatie over onze ervaringen en competenties.";
	stories[5] = "Om de kostprijs te drukken van serie machines kan het bij grotere aantallen interessant zijn om eigen electronica te ontwikkelen. Voor u ontwikkelen en/of selecteren wij de juiste electronica modules.";
	
	var current = 1;
	var animNext;
	var anim = 0;
	
	function animation(to){
		if(to != current){
			clearTimeout(animNext);
			if (anim == 0){
				anim = 1;
				eTo = document.getElementById('background-'+to);
				eFrom = document.getElementById('background-'+current);
				eFrom.style.zIndex = 3;
				eFrom.style.visibility = 'visible';
				eTo.style.zIndex = 2;
				eTo.style.visibility = 'visible';
				
				opacity('background-'+current, 100, 0, 2000);
				
				setTimeout("opacity('animTextContent', 100, 0, 900)",0);
				setTimeout("document.getElementById('animTextContent').innerHTML = '"+stories[to]+"'", 850);
				setTimeout("document.getElementById('dia-"+current+"').style.marginTop = '0px'", 850);
				setTimeout("document.getElementById('dia-"+to+"').style.marginTop = '-12px'", 850);
				setTimeout("opacity('animTextContent', 0, 100, 1000)",1000);
				
				setTimeout("opacity('animTextTitle', 100, 0, 900)",0);
				setTimeout("document.getElementById('animTextTitle').innerHTML = '"+titles[to]+"'", 850);
				setTimeout("opacity('animTextTitle', 0, 100, 1000)",1000);
				setTimeout("anim = 0",2100);
				
				setTimeout('eFrom.style.zIndex = 1;eTo.style.zIndex = 3; changeOpac(100, \'background-'+current+'\')', 2200);
				
				current = to;
				to++;
				if(to > 5)
					to = 1;
				animNext = setTimeout('animation('+to+')', 15000);
				pageTracker._trackPageview('/AnimatieEvent');
			}
		}
	}