play = true;
interim = 5000; // time between slides in milliseconds 

function loadshow() {
	var i = 0;
	$$('.section').each(function(node) {
		if (i==0) node.setStyle({ display : 'block' });
		else node.setStyle({ display : 'none' });
	i++
	});	
}

var slideshow = function() {
	
	if (play) { 
	
		timer = setTimeout(function() {
			if (play) {
				
				$$('.section').each( function(node) {
					
					if (node.getStyle('display') == 'block') {
						
						var nextNode = typeof(node.next('div'))=='undefined' ?  node.up('div').down('div') : node.next('div');
						  
						//new Effect.Parallel([
							//new Effect.Fade(node.id, { sync: true }),
							//new Effect.Appear(nextNode.id, { sync: true })
						//], { duration: 0.5 });
										
						node.fade({ duration: 0.5, afterFinish: function() {
							nextNode.appear({ duration: 0.5 });	
						} });
					}
				});
				
				$$('.controls a.active').each( function(node) {
					
					node.removeClassName('active');
					
					if ( typeof(node.next('a'))=='undefined' ) { 
						node.up('div').down('a').addClassName('active');
						var title = node.up('div').down('a').getAttribute('title');
					}
					else {
						node.next('a').addClassName('active');
						var title = node.next('a').getAttribute('title');	
					}
					
					//var arr = title.split('/');
					//var i = arr[arr.length-1].replace('#section','');
					//title.replace('#section','');
					var i =  (parseInt(title.replace('#section',''))-1);
					
				});
							
				slideshow();
			}
		}, interim);
	}
}

var goTo = function(i) {
	$$('.section').each( function(node) {
		node.setStyle({ display: 'none' });
	});
	$$('.section')[i].setStyle({ display: 'block' });
}

document.observe('dom:loaded', function() {
	
	loadshow();
	slideshow();	
		
	$$('.controls a').each( function(node) {
		
		//node.onclick = function() { return false; }
		
		node.onmouseover = function() {
						
			node.adjacent('a.active').each( function(otherNode) { 
				otherNode.removeClassName('active'); 
			});
					
			node.addClassName('active');
					
			var title = node.getAttribute('title');
			//var arr = title.split('/');
			//var i = arr[arr.length-1].replace('#section','');
			
			//var i = title.replace('#section',''); 
			var i =  (parseInt(title.replace('#section',''))-1);
			
			goTo(i);
			
			play = false;
			clearTimeout(timer);
		}
		
		node.onmouseout = function() {
			play = true;
			clearTimeout(timer);
			slideshow();
		}
	});
										
});