//Init
var bannerAutoRollInterval;
var bannerAutoRollTime = 7 * 1000;
var bannerUserSleepTime = 11 * 1000;
var currentBannerPage;
$(document).ready(onDocumentReady);

//EVENTS
function onDocumentReady() {
	//Banner Pages
	setTimeout(_loadBannerPages, 500);
				
	$("#mainMenu li:not(.selected) img")
		.mouseover(onMainMenuImageMouseOver)
		.mouseout(onMainMenuImageMouseOut);
	$(".placeholder")
		.focus(onPlaceholderInputFocus)
		.blur(onPlaceholderInputBlur)
		.change(onInputChange)
		.keyup(onInputChange)
		.each(onPlaceholderInputBlur);
}
function onMainMenuImageMouseOver(e) {
	var img = $(this);
	var imgName = img.attr("name");
	
	//Hover
	var imgSrc = img.attr("src");
	img.attr("src", imgSrc.replace(".png", "-over.png"));
	
	//Get Popover
	var popover = getMenuPopover(imgName);
	if (popover == null) {
		var imgAlt = img.attr("alt");
		popover = createMenuPopover(imgName, imgAlt);
	}
		
	//Animate popover
	var imgOffset = img.offset();
	var popoverW = popover.width();
	var popoverH = popover.height();
	popover.css("left", imgOffset.left + 11);
	popover.css("marginLeft", "-"+Math.round(popoverW / 2)+"px");
	popover.css("top", imgOffset.top - popoverH - 10);
	popover.animate({
		marginTop: "-5px",
		opacity: 1
	}, {
		duration: 100,
		queue: false
	});
}
function onMainMenuImageMouseOut(e) {
	var img = $(this);
	var imgName = img.attr("name");
	
	//Hover
	var imgSrc = img.attr("src");
	img.attr("src", imgSrc.replace("-over.png", ".png"));
	
	//Remove popover (animated)
	var popover = getMenuPopover(imgName);
	if (popover != null) {
		popover.animate({
			marginTop: "0px",
			opacity: 0
		}, {
		duration: 100,
		queue: false
	});
	}
}
function onPlaceholderInputFocus(e) {
	var input = $(this);
	var placeholder = input.attr("placeholder");
	if (input.val() == placeholder) {
		input.val("");
	}
	input.removeClass("placeholder");
}
function onPlaceholderInputBlur(e) {
	var input = $(this);
	var placeholder = input.attr("placeholder");
	if (input.val() == "" || input.val() == null || input.val() == placeholder) {
		input.val(placeholder);
		input.addClass("placeholder");
	}
}
function onInputChange(e) {
	var input = $(this);
	console.log("change");
}
function bannerPageClick(e) {
	stopBannerAutoRoll();
	
	var id = $(this).attr("id").replace("page", "");
	currentBannerPage = id;
	selectBannerPage(id);
	
	setTimeout(startBannerAutoRoll, bannerUserSleepTime - bannerAutoRollTime);
}

//FUNCTIONS
function getMenuPopover(name) {
	var result = $("#popover-"+name);
	if (result.length == 1)
		return result;
	else
		return null;
}
function createMenuPopover(name, content) {
	var result = $("<div class='popover' id='popover-"+name+"'></div>");
	result.css("opacity", 0);
	result.html(content);
	result.appendTo($("body"));
	return result;
}
function selectBannerPage(index) {
	var i = 0;
	$("ul#bannerPages > li").each(function() {
		if (i != index) {
			$(this).removeClass("selected");
		}
		else {
			$(this).addClass("selected");
		}
		i++;
	});
	
	var item = bannerArray[index];
	_setBannerContent(item);
}
function selectNextBannerPage() {
	currentBannerPage++;
	while (currentBannerPage >= bannerArray.length)
		currentBannerPage -= bannerArray.length;
	selectBannerPage(currentBannerPage);
}
function startBannerAutoRoll() {
	stopBannerAutoRoll();
	bannerAutoRollInterval = setInterval(selectNextBannerPage, bannerAutoRollTime);
}
function stopBannerAutoRoll() {
	clearInterval(bannerAutoRollInterval);
}

//Private
function _setBannerContent(item) {
	//Faire disparaitre le contenu actuel
	$("#bannerContent > h1")
		.animate({
			marginLeft: "-=100",
			opacity: 0
		}, {
			duration: 300,
			queue : false
		});
	$("#bannerImage > div")
		.animate({
			marginLeft: "+=100",
			opacity: 0
		}, {
			duration: 450,
			queue: false
		});
		
	setTimeout(function() {
		$("#bannerContent > p")
			.animate({
				marginLeft: "-=100",
				opacity: 0
			}, {
				duration: 300,
				queue : false
			});
	}, 150);
	
	setTimeout(function() {_addBannerContent(item); }, 450);
}
function _addBannerContent(item) {
	var bannerImage = $("#bannerImage");
	bannerImage.empty();
	var bannerContent = $("#bannerContent");
	bannerContent.empty();
	
	
	var img = $("<div/>");
	img.addClass("bannerImage");
	img.css({marginLeft : "-=100", opacity : 0});
	if ($.browser.msie)
		img.css("filter", "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+item.imageUrl+"');");
	else
		img.css("background", "url('"+item.imageUrl+"') no-repeat");
	img.appendTo(bannerImage);
	
	var h1 = $("<h1 />");
	h1.text(item.title);
	h1.css({marginLeft : "100px", opacity : 0});
	h1.appendTo(bannerContent);
	
	var p = $("<p />");
	p.text(item.text);
	p.css({marginLeft : "100px", opacity : 0});
	p.appendTo(bannerContent);
	
	h1.animate({
		marginLeft: "-=100",
		opacity: 1
	}, {
		duration: 300,
		queue : false
	});
	
	img.animate({
		marginLeft: "+=100",
		opacity: 1
	}, {
		duration: 450,
		queue : false
	});
	
	setTimeout(function() {
		p.animate({
			marginLeft: "-=100",
			opacity: 1
		}, {
			duration: 300,
			queue : false
		});
	}, 150);
}
function _loadBannerPages() {
	$.get("banner.xml", null, _loadBannerPages_Complete, "xml");
}
function _loadBannerPages_Complete(req, status) {
	//Masquer le chargement
	$("#bannerLoading")
		.animate({opacity : 0}, 300, function() { $(this).remove() });
	
	//Remplir l'array
	var xml = $(req);
	bannerArray = new Array();
	xml.find("page").each(function() {
		var title = $(this).find("title").text();
		var content = $(this).find("content").text();
		var imageUrl = $(this).attr("imageUrl");
		var o = {
			title: title,
			content: content,
			imageUrl: imageUrl
		};
		bannerArray.push(o);
	});
	
	//Créer les page dots
	var bannerPages = $("ul#bannerPages");
	bannerPages.css("opacity", 0);
	for (var i = 0; i < bannerArray.length; i++) {
		$("<li></li>")
			.attr("id", "page"+i)
			.click(bannerPageClick)
			.appendTo(bannerPages);
	}
	bannerPages.css("marginLeft", "-"+(19 * bannerArray.length)+"px");
	bannerPages.animate({opacity : 1}, 200);
	
	//Démarrer l'animation
	currentBannerPage = 0;
	selectBannerPage(currentBannerPage);
	bannerAutoRollInterval = setInterval(selectNextBannerPage, bannerAutoRollTime);
}
function _validateForm(form) {
	var validate = true;
	form.find("input[type='text'], input[type='password'], textarea").each(function() {
		if (!_validateInput($(this)))
			validate = false;
	});
	
	return validate;
}
function _validateInput(input) {
	var validate;
	var validationType = input.attr("validation");
	var val = _getRealValue(input);
	
	if (validationType == null) {
		validate = true;
	}
	else {
		if (validationType.indexOf("length") == 0) {
			//Length
			var len = parseInt(validationType.replace("length", ""));
			validate = val.length >= len;
		}
		else if (validationType == "email") {
			//Email
			var regex = new RegExp(/[a-z0-9]{2,}\@[a-z0-9]{2,}.[a-z]{2,}/i);
			validate = val.match(regex) ? true : false;
		}
	}
	
	if (validate) {
		input.addClass("isValid");
		input.removeClass("isInvalid");
	}
	else {
		input.removeClass("isValid");
		input.addClass("isInvalid");
	}
	return validate;
}
function _getRealValue(input) {
	var placeholder = input.attr("placeholder");
	return input.val() == placeholder ? "" : input.val();
}