
function box_navigation() {
	if($$('.box-navigation').length < 1) return;
	$$('.box-navigation').each(function (el) {
		var pos = 0;
		var arrows = el.getElement('.nav_arrows');
		var cl = el.getElement('.nav_left');
		var cr = el.getElement('.nav_right');
		var elements = el.getElements('.element');
			
		if(elements.length < 2) {
			new Fx.Morph(arrows, { duration: 100 }).start({ 'opacity': 0.01 })
				.chain(function() { cl.setStyle('display', 'none'); });
			return false;
		}
		
		var current = elements[0];
		
		function update() {
			
			if(pos == 0) {
				new Fx.Morph(cl, { duration: 100 }).start({ 'opacity': 0.01 })
					.chain(function() { cl.setStyle('visibility', 'hidden'); });
			}
			
			if(pos > elements.length-2) {
				new Fx.Morph(cr, { duration: 100 }).start({ 'opacity': 0.01 })
					.chain(function() { cr.setStyle('visibility', 'hidden'); });
			}
			
			if(pos > 0) {
				if(cl.getStyle('visibility') == 'hidden') {
					cl.setStyle('visibility', 'visible');
					new Fx.Morph(cl, { duration: 100 }).start({ 'opacity': 1 });
				}
			}
			
			if(pos < elements.length-1) {
				if(cr.getStyle('visibility') == 'hidden') {
					cr.setStyle('visibility', 'visible');
					new Fx.Morph(cr, { duration: 100 }).start({ 'opacity': 1 });
				}
			}
		}
		
		update();

		cl.addEvent('click', function() {
			if(pos == 0) return false;

			new Fx.Morph(current, {duration: 300}).start({
				'opacity': 0.01
			}).chain(function() {
				current.setStyle('display', 'none');
				elements[--pos].setStyle('opacity', 0.01);
				elements[pos].setStyle('display', 'block');
				new Fx.Morph(elements[pos], {duration: 300}).start({
					'opacity': 1
				})
				
				current = elements[pos];
				
				update();
			});
			
			return false;
		});
		
		cr.addEvent('click', function() {
			if(elements[pos+1] == null) return false;

			new Fx.Morph(current, {duration: 300}).start({
				'opacity': 0.01
			}).chain(function() {
				current.setStyle('display', 'none');
				elements[++pos].setStyle('opacity', 0.01);
				elements[pos].setStyle('display', 'block');
				new Fx.Morph(elements[pos], {duration: 300}).start({
					'opacity': 1
				})
				
				current = elements[pos];
				
				update();
			});
			
			return false;
		})
	});
}

$(document).addEvent('domready', function() {
	box_navigation();
});

