$(function(){
	if(!Modernizr.input.placeholder) {
		$('input').setup_placeholders();
	}

	$('form.order').validate();
	$('form.question').validate();
	$('select#country').prevent_no_tax_submission();
	$('#archives-nav').setup_archives_navigation();
	
	$('.screenshots ul').setup_file_attachments();
});

$.fn.setup_placeholders = function() {
	$(this).each(function() {
		var placeholder = $(this).attr('placeholder');
		if(placeholder) {
			if(!$(this).val() || $(this).val() == placeholder) {
				$(this).val(placeholder);
				$(this).addClass('placeholder');
			}
			$(this).focus(function(){
				if($(this).val() == placeholder) {
					$(this).val('');
					$(this).removeClass('placeholder');
				}
			});
			$(this).blur(function(){
				if(!$(this).val()) {
					$(this).val(placeholder);
					$(this).addClass('placeholder');
				}
			});
			$(this).parents('form').submit(function(){
				$('input').each(function(){
					if($(this).val() == placeholder)
						$(this).val('');
				});
			});
		}
	});
}

$.fn.validate = function(){
	form = $(this);
	
	form.find('input[type=file]').live('change', function(){
		//console.log($(this).val());
		//$(this).val('');
	});

	form.submit(function(e){
		form.find('.error').removeClass('error').find('span.error-message').remove();
		
		var password = $('#customer_password');
		var confirm_password = $('#customer_password_confirm');
		if(password.length > 0 && confirm_password.length > 0) {
			if(password.val() == '' || confirm_password.val() == '') {
				e.preventDefault();
				$('#passwords').append('<p class="error">You must fill in both password fields.</p>');
			} else if(password.val() != confirm_password.val()) {
				$('#passwords').append('<p class="error">Passwords must match.</p>');
			}
		}

		form.find('.required').each(function(){
			if($(this).val() == '') {
				e.preventDefault();
				var label = $(this).parents('label').find('span').first().text();
				$(this).parents('p').first().addClass('error').find('label').append('<span class="error-message">'+label+' is a required field.</span>');
			}
		});
		
		var email_regex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
		
		form.find('input[type=email]').each(function(){
			if(!$(this).val().match(email_regex)) {
				e.preventDefault();
				var label = $(this).parents('label').find('span').first().text();
				$(this).parents('p').first().addClass('error').find('label').append('<span class="error-message">Please enter a valid email address.</span>');
			}
		});
		
		var file_regex = /^.+\.(jpg|jpeg|png|gif|bmp|tif|tiff|pdf)/;
		
		form.find('input[type=file]').each(function(){
			if($(this).val()) {
				if(!$(this).val().match(file_regex)) {
					e.preventDefault();
					var label = $(this).parents('label').find('span').first().text();
					$(this).parents('li').first().addClass('error').find('label').append('<span class="error-message">Please upload a valid image file.</span>');
				} else {
					console.log($(this).val());
				}
			}
		});

		if(form.find('p.error-notice').length < 1 && form.find('.error').length >= 1) {
			form.prepend('<p class="error-notice">Please correct the errors below.</p>');
			form.find('p.error-notice').attr('tabIndex', -1).focus();
		} else if(form.find('.error').length > 1) {
			form.find('p.error-notice').attr('tabIndex', -1).focus();
		}
	});
}

$.fn.setup_archives_navigation = function(){
	var $menu = $(this);
	
	$menu.hover(
		function(){
			$menu.find('ul').first().show();
		},
		function(){
			$menu.find('ul').first().hide();
		}
	);
	
	$menu.find('a').focus(function() {
		var $menuParent = $menu.children('ul').first();
		$menuParent.addClass('menu-visible');
	});

	$menu.find('a').last().blur(function() {
			var $menuParent = $menu.children('ul').first();
			$menuParent.removeClass('menu-visible');
	});

	// Bind arrow keys for navigation
	$menu.find('a').keydown(function(e){
		if(e.keyCode == 38) {
			e.preventDefault();
			if($(this).parent('li').find('ul').length > 0) {
				$(this).parent('li').find('ul').find('a').last().focus();
			}
		} else if (e.keyCode == 40) {
			e.preventDefault();
			if($(this).parent('li').find('ul').length > 0) {
				$(this).parent('li').find('ul').find('a').first().focus();
			}
		}
	});
	
	$menu.find('ul').find('a').keydown(function(e){
		if(e.keyCode == 38) {
			e.preventDefault();
			// This is the first item
			if($(this).parent('li').prev('li').length == 0) {
				$(this).parents('ul').parents('li').find('a').first().focus();
			} else {
				$(this).parent('li').prev('li').find('a').first().focus();
			}
		} else if(e.keyCode == 40) {
			e.preventDefault();
			if($(this).parent('li').next('li').length == 0) {
				$(this).parents('ul').parents('li').find('a').first().focus();
			} else {
				$(this).parent('li').next('li').find('a').first().focus();
			}
		}
	});

	$(document).click(function(){ $('.menu-visible').removeClass('menu-visible'); });
}

$.fn.prevent_no_tax_submission = function(){
	$(this).keydown(function(e){
		if(e.keyCode == 13) {
			return false;
		}
	});
}

$.fn.setup_file_attachments = function(){
	var list = $(this);
	list.find('li:gt(0)').remove();
	// Create the "add" button
	var add_file = $('<a />', {
		html: '<span>Add another screenshot</span>',
		className: 'add',
		click: function(e) {
			e.preventDefault();
			var file = list.find('li').first().clone();
			var length = list.find('li').length + 1;
			file.find('label').attr('for','file-'+length);
			file.find('span').first().text('File '+length);
			file.find('span.error-message').remove();
			file.find('input[type=file]').attr('id','file-'+length);
			file.append('<a href="#file-'+length+'"><img src="/resources/images/delete.png" alt="Delete File" /></a>');
			list.append(file);
			if(length == 5)
				$('.add').hide();
		}
	});
	list.after(add_file);
	list.find('a').live('click', function(e){
		e.preventDefault();
		$(this).parent().remove();
		var length = list.find('li').length;
		if(length < 5)
			$('.add').show();
		var files = list.find('li');
		files.each(function(i, file){
			var index = i + 1;
			$(this).find('label').attr('for','file-'+index);
			$(this).find('span').first().text('File '+index);
			$(this).find('input[type=file]').attr('id','file-'+index);
			$(this).find('a').attr('href','#file-'+index);
		});
	});
}