window.addEvent('domready', function() {
	//slider variables for making things easier below
	var itemsHolder = document.id('imgsshow');
	var myItems = $$(itemsHolder.getElements('.bigimg'));

	//controls for slider
	var theControls = document.id('imgscntrl');
	var numNavHolder = document.id(theControls.getElement('ul'));
	// var thePlayBtn = document.id(itemsHolder.getElement('.play_btn'));
	var thePreloader = document.id('preloader');
	var theNextBtn = document.id('next_btn');
	var thePrevBtn = document.id('prev_btn');
	
	//preload images and hide
	var theImages = new Array(); 
	myItems.each(function(el, i){ 
		var tempImg = document.id(el.getElement('img')); 
		var tempSrc = tempImg.getProperty('src'); 
		theImages.push(tempSrc); 
		el.set('opacity', 0); 
	}); 
	
	//fade preloader into view
	thePreloader.set('tween', {duration: 500, transition: 'cubic:out'}).tween('opacity', 1);
	
	//load the images
	var myImages = new Asset.images(theImages, { 
		onComplete: function(){
			if(itemsHolder.getElement('.gmpos')) {
				myItems.push(itemsHolder.getElement('.gmpos')); }
			//create instance of the slider, and start it up   
			var mySlider = new SL_Slider({
				slideTimer: 6000,
				orientation: 'horizontal',
				fade: true,
				transitionTime: 1500,
				isPaused: true,
				container: itemsHolder,
				items: myItems,
				numNavActive: true,
				numNavHolder: numNavHolder,
				nextBtn: theNextBtn,
				prevBtn: thePrevBtn
			});
			mySlider.start();
			//unhide slides          
			myItems.each(function(el){ 
				el.set('opacity', 1); 
			}); 
			//hide preloader
			thePreloader.tween('opacity', 0);
		}
	});
	
});