/**
 * Images slider
 **/
(function() {

	/**
	 * Constants
	 **/
	// Interval in between each image
	var SLIDE_INTERVAL = 3000;

	// Interval to fade out / fade in
	var FADE_INTERVAL = 750;

	// Path to images
	var IMAGES_PATH = '/media/images/slider/';

	// Array of images to display
	var IMAGES_LIST = [
		'jquery.jpg',
		'html5.jpg',
		'mongodb.jpg',
		'mysql.jpg',
		'nodejs.jpg',
		'php.jpg'
	];

	// jQuery selector for container
	var CONTAINER = '#slider';

	// Class name for slide nodes
	var SLIDE_CLASSNAME = 'slide';

	/**
	 * Global vars
	 **/
	var slide, image, current_image, timer;

	/**
	 * Initialize slider
	 **/
	function init()
	{
		// Check if container is found
		if ( $(CONTAINER).length <= 0 ) {
			return false;
		}
		
		// We need at least one image in the array...
		if (IMAGES_LIST.length < 1) {
			return false;
		}
		
		// Pre-load images
		var temp_images = [];
		for (var i in IMAGES_LIST) {
			temp_images[i] = new Image();
			temp_images[i].src = IMAGES_PATH + IMAGES_LIST[i];
		}
		
		// Initialize variables
		current_slide = 1;
		current_image = 0;
		
		// Initialize slide
		slide = $('<p></p>');
		slide.addClass(SLIDE_CLASSNAME);
		slide.hide();
		slide.appendTo(CONTAINER);
		
		image = $('<img />');
		image.appendTo(slide);
		
		// Fade in first image
		setSlideImage();
		slide.fadeIn(FADE_INTERVAL, setTimer);
	}

	/**
	 * Change image slide
	 **/
	function changeImage()
	{
		// Update current image index
		current_image++;
		
		if (current_image >= IMAGES_LIST.length) {
			current_image = 0;
		}
		
		// Fade out slide
		slide.fadeOut(FADE_INTERVAL, function() {
			// Set new image and fade back in
			setSlideImage();
			slide.fadeIn(FADE_INTERVAL, setTimer);
		});
	}

	/**
	 * Start timer for next image change
	 **/
	function setTimer()
	{
		// Start timer for next image
		timer = setTimeout(changeImage, SLIDE_INTERVAL);
	}

	/**
	 * Set current image inside slide div
	 **/
	function setSlideImage()
	{
		image.attr('src', IMAGES_PATH + IMAGES_LIST[current_image]);
	}

	// Initialize on document load
	$(init);
	
})();

/**
 * Contact form
 **/
(function() {
	
	/**
	 * Initialization
	 **/
	function init()
	{
		var messages_container = $('#validation_messages');
		
		// Register validation
		$("#contact_form").validate({
			debug: true,
			submitHandler: submitForm,
			errorContainer: messages_container,
			errorLabelContainer: messages_container,
			wrapper: 'p',
			rules: {
				name: {
					required: true
				},
				email: {
					required: '#phone:blank',
					email: true
				},
				phone: {
					required: '#email:blank'
				},
				message: {
					required: true,
					minlength: 10
				}
			},
			messages: {
				name: {
					required: 'Veuillez entrer votre nom et prénom.'
				},
				email: {
					required: 'Veuillez entrer un courriel ou un numéro de téléphone.',
					email: 'Veuillez entrer un courriel valide.'
				},
				phone: {
					required: ''
				},
				message: {
					required: 'Veuillez entrer votre message.',
					minlength: 'Votre message est trop court.'
				}
			}
		});
		
		// Validate phone field on email field change
		$('#email').keyup(function() {
			$('#contact_form').validate().element('#phone');
		});
	}
	
	/**
	 * Submits form through AJAX
	 **/
	function submitForm(form)
	{
		// Show loading
		$('#form_messages').html('<p class="info">Sending...</p>');
		
		var data = $('#contact_form').serialize();
		
		disableForm();
		
		// Send through AJAX
		$.ajax({
			type:     'post',
			dataType: 'json',
			url:      '/contact/contact.php',
			data:     data,
			success:  submitSuccess,
			error:    submitError
		});
	}
	
	/**
	 * Form submitting successful
	 **/
	function submitSuccess(data)
	{
		if (typeof data.status !== 'undefined' && data.status == 1) {
			// Success message
			$('#form_messages').html('<p class="success">Merci, votre message a bien été envoyé. Nous communiquerons avec vous dans les plus brefs délais!</p>');
			
			emptyForm();
			
		}
		else {
			// Error message
			$('#form_messages').html('<p class="error">Le serveur n\'a pas réussi à envoyer le courriel. Veuillez réessayer plus tard ou nous contacter à l\'adresse suivante: <a href="mailto:contact@epicweb.ca">contact@epicweb.ca</a>.</p>');
			
			// TODO - show messages from server maybe
			
		}
		
		enableForm();
	}
	
	/**
	 * Form submitting error
	 **/
	function submitError()
	{
		// Error message
		$('#form_messages').html('<p class="error">La connexion avec le serveur a échouée. Veuillez réessayer plus tard ou nous contacter à l\'adresse suivante: <a href="mailto:contact@epicweb.ca">contact@epicweb.ca</a>.</p>');
			
		enableForm();
	}
	
	/**
	 * Enable form
	 **/
	function enableForm()
	{
		$('#contact_form').find('input').removeAttr('disabled');
		$('#contact_form').find('textarea').removeAttr('disabled');
	}
	
	/**
	 * Disable form
	 **/
	function disableForm()
	{
		$('#contact_form').find('input').attr('disabled', 'disabled');
		$('#contact_form').find('textarea').attr('disabled', 'disabled');
	}
	
	/**
	 * Empty form
	 **/
	function emptyForm()
	{
		$('#contact_form').find('input').val('');
		$('#contact_form').find('textarea').val('');
	}
	
	
	$(init);
	
})();