window.addEvent('domready', function() {
});

function buildSmallGallery(){
	var galItems = $$('#galItems a');
	var gallery = $('smallGallery');
	var curImg = 0;


	var navCont = new Element('div', {
		'class': 'smallGallery_nav'
	});

	var navWindow = new Element('div', {'class':'nav_window'});
	var nav = new Element('div');
	var navFx = new Fx.Morph(nav);
	nav.inject(navWindow);
	navWindow.inject(navCont);
	navCont.inject(gallery);
	var captionP = new Element('p',{'class': 'caption'});
	captionP.inject(gallery);
	
	var prev = new Element('a', {
		'href': '#',
		'class': 'prev',
		'events':{
			'click': function(){showImage(curImg-1); return false;}
		}
	});
	var next = new Element('a', {
		'href': '#',
		'class': 'next',
		'events':{
			'click': function(){showImage(curImg+1); return false;}
		}
	});
	prev.inject(navCont, 'top');
	next.inject(navCont);
	var navLinks = [];

	galItems.each(function(el, i){
		//reorder the elements & set opacity to 0
		var z = (galItems.length -1) - i;
		if(i==0){
			el.setStyles({'z-index': z, 'opacity': 1});
			var captionText = el.get('title');
			captionP.set('text', captionText);
		}
		else el.setStyles({'z-index': z, 'opacity': 0});

		//create the nav
		if(i==0){
			var button = new Element('a', {
				'href': '#',
				'html': i+1,
				'class': 'active',
				'events': {
					'click': function(){
						showImage(i); 
						$clear(timer);
						timer = autoSlideShow.periodical(5000);
						return false;
					}
				}
			});
		}else{
			var button = new Element('a', {
				'href': '#',
				'html': i+1,
				'events': {
					'click': function(){
						showImage(i);
						$clear(timer);
						timer = autoSlideShow.periodical(5000);
						return false;
					}
				}
			});
		}
		//inject the nav 
		navLinks.include(button);
		button.inject(nav);
	});

	var clear = new Element('br', {'class':'clear'});
	clear.inject(nav);
	clear.inject(navCont);
	var totNavPages = Math.ceil(navLinks.length/6 - 1);

	function showImage(i){
		if(i < 0 || i > galItems.length-1) return;

		galItems[curImg].morph({
			'opacity': 0
		});
		galItems[i].morph({
			'opacity': 1
		});
		
		var captionText = galItems[i].get('title');
		captionP.set('text', captionText);
		
		navLinks[curImg].removeClass('active');
		navLinks[i].addClass('active');		
		slideNav(i);

		curImg = i;

		return false;
	}


	function slideNav(i){
		var center;
		if(i < 3){
			center = 3;
		}else if((navLinks.length-1)-i < 3){
			center = navLinks.length-4;
		}else{
			center = i;
		}
		
		var dest = (center - 3)*-23;
		var curMargin = nav.getStyle('margin-left').toInt();
		navFx.start({
			'margin-left': dest
		});
	}
	
	function autoSlideShow(){
		if(curImg == galItems.length-1){
			showImage(0);
		}else{
			showImage(curImg+1);
		}	
	}
	
	var timer = autoSlideShow.periodical(5000);
	
}