window.addEvent('domready', function() {
	
	/* ----------Config Vars----------- */
	var transitionTime = 1300; 			//transition time (1 second = 1000)
	var myForm = $('contact_form');			//the actual form element
	var loaderImg = $('statusimg');		//animated gif loader box
	var submitBtn = $('my_submit'); 		//submit button
	var statusDiv = $('statustext');			//status txt container
	var statusTxt = statusDiv.getElement('p');	
	/* -------- end config vars -------- */
	
	
	//initialize 
	loaderImg.setStyle('opacity',"0");
	loaderImg.set('tween', {duration: 500, transition: Fx.Transitions.Cubic.easeOut});
	statusDiv.set('slide', {duration: 'short', transition: 'cubic:out'});
	statusDiv.slide('hide');
	
	myForm.set('send', {
		     //url: 'dmsubmit.php', 
		     method: 'post',
		     
		     onRequest: function(){
				loaderImg.tween('opacity',1);
				statusDiv.slide('in');
				statusTxt.set('html', "Sending...");
			},
			onSuccess: function(responseText, responseXML){
				
				statusTxt.set('html', responseText);
				loaderImg.tween('opacity',0);
				if(responseText == "Message sent.") {
					myForm.reset();
				}
			},
			onFailure: function(){
				
				loaderImg.tween('opacity',0);
				statusTxt.set('html', "Error sending mail, please try again later...");
			}
	});
	
	//function to fade in an element
	var showBox = function(el){ 
		
		var fade_in = new Fx.Morph(el, {
			     duration: transitionTime, 
			     transition: Fx.Transitions.Cubic.easeOut, 
			     link: 'ignore'
		});
		
		fade_in.start({
		'opacity': 1
		});
		
	};
	//--------------- end showBox ---------------------
	
	
	submitBtn.addEvent( 'click', function(event){
		// Stops the submission of the form.
		event.stop();
	
		// Sends the form to the action path,
		myForm.send();
	} );
	
	
	var myInputs = $$('input', 'textarea');
	
	var myHilighter = new SL_Hilight({
	inputs: myInputs, 
	activeClass: 'active_field',
	initialFocus: true
	});

	
});