window.addEvent('domready', function() {
	
	//1.2.3 compatibility fix for $
	window.$ = document.id;
	
	
	//variables for making things more simple below
	var myStage = $('stage_inner');
	var myItems = myStage.getElements('.slide');	
	var thePreloader = $('preloader');
	
	//hide initial pics during loading
	myStage.set('opacity', 0);
	
	var theSources = new Array();
	myItems.each(function(el, i){
		var tempLink = $(el.getElement('img'));
		var tempSrc = tempLink.getProperty('src');
		theSources.push(tempSrc);
	});
	
	
	var contentCoords = myStage.getCoordinates();
	var contentX = contentCoords.left;
	var contentY = contentCoords.top;
	var contW = contentCoords.width;
	var contH = contentCoords.height;
	
	var preCoords = thePreloader.getCoordinates();
	var preW = preCoords.width;
	var preH = preCoords.height;
	
	//preloader bar stuff
	thePreloader.set('tween', {duration: 1000, transition: 'cubic:out'}).tween('opacity', 1);
	
	//var preX = contentX + ((contW - 200) / 2);
	//var preY = contentY + ((contH - 10) / 2);
	//preX = (contW - preW) / 2;
	//preY = (contH - preH) / 2;
	
	preX = (contW - 200) / 2;
	preY = (contH - 10) / 2;
	
	
	thePreloader.setStyles({
		'top': preY,
		'left': preX
	});
	
	
	var numImgs = (theSources.length);
	var percentBump = (100/numImgs).toInt();
	
	
	//thanks to David Walsh for the loader bar class
	var pb = new dwProgressBar({
		container: thePreloader,
		startPercentage: 0,
		speed:500,
		boxID: 'box',
		percentageID: 'perc',
		step:percentBump,
		allowMore: 0,
		displayID: 'text',
		displayText: true,
		onComplete: function() {  
		 	//alert('Done!');			
			//mySlider.start();
		}
	});
	
	
	//starts loading images here
	var myImages = new Asset.images(theSources, {
		onProgress: function(counter){
			pb.step();
		},

		onComplete: function(){
			
			//unhide images box
			myStage.set('opacity', 1);
			thePreloader.set('tween', {duration: 700, transition: 'cubic:in'}).tween('opacity', 0);
			
			var homeSlider = new SL_Slider({
				/*
				slideTimer: 9000,
				picDelay: 500,
				transitionType: 'cubic:out',
				fadeTime: 1000,
				items: myItems,
				stageBox: myStage
				*/				
				slideTimer: 8000,  			    //Time between slides (1 second = 1000), a.k.a. the interval duration
				orientation: 'none',      		//vertical, horizontal, or none: None will create a fading in/out transition.
				fade: true,                     //if true will fade the outgoing slide - only used if orientation is != None
				isPaused: true,				//flag for paused state
				transitionTime: 1000, 		    //Transition time (1 second = 1000)
				transitionType: 'cubic:out',	//Transition type
				container: myStage,				//container element
				items:  myItems, 				//Array of elements for sliding
				itemNum: 0,						//Current item number
				numNavActive: false,			//Whether or not the number navigation will be used
				numNavHolder: null,			    //Element that holds the number navigation
				playBtn: null,					//Play (and pause) button element
				prevBtn: $('prev'),				//Previous button element
				nextBtn: $('next')				//Next button element
			});
			homeSlider.start();
			
		}
		
	});
	//end images load
	
	new SmoothScroll({ duration:1600, transition: Fx.Transitions.Cubic.easeInOut  }, window);
					 
});