var theTimer, introVisible = true;

$(document).ready(function(){
		$('.gallery_demo_unstyled').addClass('gallery_demo'); // adds new class name to maintain degradability

		$('ul.gallery_demo').galleria({
			history   : false, // activates the history object for bookmarking, back-button etc.
			clickNext : true, // helper for making the image clickable
			insert    : '#main_image', // the containing selector for our main image
			onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes

				// fade in the image & caption
				image.css('display','none').fadeIn(1000);
				caption.css('display','none').fadeIn(1000);

				// fetch the thumbnail container
				var _li = thumb.parents('li');

				// fade out inactive thumbnail
				_li.siblings().children('img.selected').fadeTo(500,0.3);

				// fade in active thumbnail
				thumb.fadeTo('fast',1).addClass('selected');

				// add a title for the clickable image
				image.attr('title','Next image >>');
				
				image.click( function() {
					clearInterval(theTimer);
					theTimer = setInterval( "slideshow()", 6000);
				});				
			},
			onThumb : function(thumb) { // thumbnail effects goes here

				// fetch the thumbnail container
				var _li = thumb.parents('li');

				// if thumbnail is active, fade all the way.
				var _fadeTo = _li.is('.active') ? '1' : '0.3';

				// fade in the thumbnail when finnished loading
				thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);

				// hover effects
				thumb.hover(
					function() { thumb.fadeTo('fast',1); },
					function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active
				)

				thumb.click( function() {
					
					if(introVisible) {
						$("#intro-text").fadeOut( function() {
							$("#main_image").fadeIn( function() {
								theTimer = setInterval( "slideshow()", 6000);
							});
						});
						introVisible = false;
					}
					else {
						clearInterval(theTimer);						
						theTimer = setInterval( "slideshow()", 6000);
					}
				});
			}
		});
		
		$contactLink = $('<span id="contact-link-wrapper">E: <a id="email-link" href="mailto:lightingup@deanhurst.com" title="email lighting up">lightingup@deanhurst.com</a></span><a href="#" id="contact-link">Contact Us</a>').insertAfter("#contact-info");
		
		$contactLink.click( function() {
			$("#contact-form").slideToggle();		
		});
		
		$("#contact-us")
			.css("border-bottom", "1px dotted #eee")
			.hover(
				function () {
					$(this).css({
						"border-bottom": "1px solid #eee",
						"cursor": "pointer"
						});
					
				},
				function () {
					$(this).css({
						"border-bottom": "1px dotted #eee",
						"cursor": "default"
						})
				})
			.click( function() {
			$("#contact-link").click();
		});
		
		initForm();
	});

function slideshow() {
	$.galleria.next();
}

function initForm() {
	$("#contact-btn").click( function() {
		// validate
		var valid = true;
		var $name = $("#name");
		var $company = $("#company");
		var $tel = $("#tel");
		var $email = $("#email");
		var $msg = $("#msg");
	
		if($name.val() == "") {
			$name.css("border", "1px solid #ff0000");
			valid = false;
		}
		else {
			$name.css("border", "1px solid #222222");
		}
	     
		if($company.val() == "") {
			$company.css("border", "1px solid #ff0000");
			valid = false;
		}
		
		else {
			$company.css("border", "1px solid #222222");
		}
		
		if($tel.val() == "") {
			$tel.css("border", "1px solid #ff0000");
			valid = false;
		}
		else {
			$tel.css("border", "1px solid #222222");
		}
					
		if($email.val() == "") {
			$email.css("border", "1px solid #ff0000");
			valid = false;
		}		
		else {
			$email.css("border", "1px solid #222222");
		}
	
		if(!valid) { 
			$("#validation").text("Please complete all reqauired information");
			return false;
		}
		else {
			$("#validation").text("");
		}
	
		// get form content and send via ajax, then close panel and change heading to 
		// confirm that message sent
		$("#ajaxloader").show();

		$.post("/contact.php", $("#theForm").serialize(), function(data) {

			if(data && data.status == "OK") {
				$("#ajaxloader").fadeOut( function() {
					$("#contact-btn").css("width", "120px").val("Thank You!");
					$("#contact-form").delay(1200).slideToggle( function() {
						$("#theForm")[0].reset();					
						$("#contact-btn").val("Send").css("width", "80px");
					});					
				});
			}
			else {
				$("#contact-btn").val("Oops!");
			}

		}, "json");
			
		return false;
	
	});
}