/// <reference path="jquery-1.3.2-vsdoc.js"/>



// ----------------------------------------------------------------------
// Utils
// ----------------------------------------------------------------------
function getViewPortWidth()
{
	var viewPortWidth;	
	var randomScrollBarWidth = 20;

	// Most browsers
	if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0)
	{
		viewPortWidth = document.documentElement.clientWidth;
		//viewPortHeight = document.documentElement.clientHeight;
	}
	// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
	else if (typeof window.innerWidth != 'undefined')
	{
		viewPortWidth = window.innerWidth - randomScrollBarWidth;
		//viewPortHeight = window.innerHeight;
	}
	// older versions of IE
	else
	{
		viewPortWidth = document.getElementsByTagName('body')[0].clientWidth;
		//viewPortHeight = document.getElementsByTagName('body')[0].clientHeight;
	}

	return viewPortWidth;
}



// ----------------------------------------------------------------------
// Videos
// ----------------------------------------------------------------------
var coupsDeCoeur = 1;
var episodesComplets = 2;
var exclusivitesWeb = 3;
var plusVues = 4;
var plusAppreciees = 5;
var jeunesse = 6;
var rentree = 7;


function GetVideosTabs_SucceededHandler(result, context, methodName)
{
	if (result !== null)
	{
		$("#ongletsVideo").html(result);
	}
}

function GetVideosView_SucceededHandler(result, context, methodName)
{
	if (result !== null)
	{
		$("#vidSelBox").html(result);
	}
}

function showLoader()
{
	// http://www.ajaxload.info/

	var image = "<div class=\"vidSelBoxHeader\"><\/div><p class=\"vidSelBoxLoader\"><img src=\"images/interface/skins/bleu/accueil/video/loader.gif\" alt=\"\" width=\"31\" height=\"31\"><\/p>";
	$("#vidSelBox").html(image);
}

function error_Handler(result)
{
	//alert(result);
}

function setVideos( ongletId )
{
	//if (ongletId == plusVues)
	//{
	//	showLoader();
	//}

	WebService.GetVideosTabs(ongletId, GetVideosTabs_SucceededHandler, error_Handler);
	WebService.GetVideosView(ongletId, GetVideosView_SucceededHandler, error_Handler);

	return false;
}



// ----------------------------------------------------------------------
// Pagination
// ----------------------------------------------------------------------
function GetVideosItemsByPageNumber_SucceededHandler(result, context, methodName)
{
	if (result !== null)
	{
		$("#vidSelBox").html(result);
	}
}


function setVideoItemsByPageNumber(ongletId, pageNumber)
{
	WebService.GetVideosItemsByPageNumber(ongletId, pageNumber, GetVideosItemsByPageNumber_SucceededHandler, error_Handler);
	return false;
}



// ----------------------------------------------------------------------
// Filtres
// ----------------------------------------------------------------------
function GetVideosItemsByFiltre_SucceededHandler(result, context, methodName)
{
	if (result !== null)
	{
		$("#vidSelBox").html(result);
	}
}

function setVideoItemsByFiltre(ongletId, filtre)
{
	WebService.GetVideosItemsByFiltre(ongletId, filtre, GetVideosItemsByFiltre_SucceededHandler, error_Handler);
	return false;
}



// ----------------------------------------------------------------------
// Abonnement
// ----------------------------------------------------------------------
function showCyberlettreMessage()
{
	$("#cyberlettreMessage").css("display", "block");
}

function hideCyberlettreMessage()
{
	$("#cyberlettreMessage").css("display", "none");
}

function SetAbonnementCyberlettre_SucceededHandler(results, context, methodName)
{
	if (results !== null)
	{
		$("#cyberlettreMessage").html(results);

		showCyberlettreMessage();
		//setTimeout(hideCyberlettreMessage, 15000);
	}
}

function setAbonnement()
{
	var courriel = $("#courrielCyberlettre").val();

	WebService.SetAbonnementCyberlettre(courriel, SetAbonnementCyberlettre_SucceededHandler);

	return false;
}

function cleanInput()
{
	var courriel = $("#courrielCyberlettre").val();

	if (courriel === "Indiquez votre adresse de courriel")
	{
		$("#courrielCyberlettre").val("");
	}
}




// ----------------------------------------------------------------------
// Tooltip
// ----------------------------------------------------------------------
var showTooltip = false;
var tooltipPointer = "left";

function fadeInTooltipBoxHandler()
{
	if (!showTooltip)
	{
		hideTooltipBox();
	}
}


function setPlayDisplay(playParent, displayValue)
{
	// TODO: This is probably not a very solid way of accessing the HTML element
	// that we need (the play icon). Find a better way (probably by using
	// jQuery).
	var playImage = playParent.getElementsByTagName("IMG")[1];
	if (playImage == null || playImage.className != "listThumbPlay")
	{
		return;
	}
	playImage.style.display = displayValue;
}


function showTooltipBox(e, currentTarget, idVideo)
{
	var fromEl = e.relatedTarget || e.fromElement;
	if (typeof fromEl == "undefined")
	{
		return;
	}
	// If the mouse comes from the HTML element that is currently handling the
	// event (the event's current target) or from one of its descendants, we
	// don't need to go on because the required actions have already been
	// executed. However, if the mouse comes from a null object (which normally
	// happens on the page load), we must proceed because the required actions
	// haven't been executed yet.
	// TODO: Make sure that the mouse isn't coming from any descendant of the
	// event's current target and not just from one of its children.
	if (fromEl != null && (fromEl == currentTarget || fromEl.parentNode == currentTarget))
	{
		return;
	}

	setPlayDisplay(currentTarget, "block");


	// Description Box
	showDescriptionBox(idVideo, currentTarget);
}

function showDescriptionBox(idVideo, currentTarget)
{
	setDescriptionBoxText(idVideo);
	setDescriptionBoxPosition(currentTarget);
}

function hideDescriptionBox()
{
	showTooltip = false;
	$("#descriptionBox").css("display", "none");
}

function setDescriptionBoxText(idVideo)
{
	var description = $("#description_" + idVideo).html();

	if (description != null && description != "")
	{
		showTooltip = true;
		$("#descriptionContent").html(description);
		$("#descriptionBox").css("display", "block");
	}
}

function setDescriptionBoxPosition(currentTarget)
{
	var imgElementPosition = getElementPosition(currentTarget);

	var viewportWidth = getViewPortWidth();
	var descriptionBoxWidth = 320;
	var descriptionBoxPointerWidth = 16;
	var imageWidth = 160;
	var imageBorderWidth = 3;


	if (imgElementPosition.x > viewportWidth - (descriptionBoxWidth + descriptionBoxPointerWidth + imageBorderWidth + imageWidth + imageBorderWidth))
	{
		// Tooltip box at the left of the mouse cursor
		if (tooltipPointer == "left")
		{
			tooltipPointer = "right";
			$("#descriptionBoxPointer").removeClass("pointerLeft");
			$("#descriptionBoxPointer").addClass("pointerRight");
		}

		$("#descriptionBox").css("top", (imgElementPosition.y) + "px");
		$("#descriptionBox").css("left", (imgElementPosition.x - descriptionBoxWidth - descriptionBoxPointerWidth) + "px");
	}
	else
	{
		// Tooltip box at the right of the mouse cursor
		if (tooltipPointer == "right")
		{
			tooltipPointer = "left";
			$("#descriptionBoxPointer").removeClass("pointerRight");
			$("#descriptionBoxPointer").addClass("pointerLeft");
		}

		$("#descriptionBox").css("top", (imgElementPosition.y) + "px");
		$("#descriptionBox").css("left", (imgElementPosition.x + imageWidth + imageBorderWidth + imageBorderWidth + descriptionBoxPointerWidth) + "px");
	}
}


function hideTooltipBox(e, currentTarget)
{
	var toEl = e.relatedTarget || e.toElement;
	if (typeof toEl == "undefined")
	{
		return;
	}
	// If the mouse is going to the HTML element that is currently handling the
	// event (the event's current target) or to one of its descendants, we don't
	// need to go on because the required actions will be executed later.
	// However, if the mouse is going to a null object (which normally happens
	// on the page unload), we must proceed because the required actions haven't
	// been executed yet.
	// TODO: Make sure that the mouse isn't going to any descendant of the
	// event's current target and not just to one of its children.
	if (toEl != null && (toEl == currentTarget || toEl.parentNode == currentTarget))
	{
		return;
	}
	setPlayDisplay(currentTarget, "none");


	// Description
	hideDescriptionBox();
}


function setTooltipBoxLocation(e)
{
//	var viewportwidth = getViewPortWidth() - 10;

//	var posx = 0, posy = 0;
//	if (e == null)
//	{
//		e = window.event;
//	}
//	if (e.pageX || e.pageY)
//	{
//		posx = e.pageX;
//		posy = e.pageY;
//	}
//	else if (e.clientX || e.clientY)
//	{
//		if (document.documentElement.scrollTop)
//		{
//			posx = e.clientX + document.documentElement.scrollLeft;
//			posy = e.clientY + document.documentElement.scrollTop;
//		}
//		else
//		{
//			posx = e.clientX + document.body.scrollLeft;
//			posy = e.clientY + document.body.scrollTop;
//		}
//	}

//	if (posx > viewportwidth - 370)
//	{
//		// Tooltip box at the left of the mouse
//		if (tooltipPointer == "left")
//		{
//			tooltipPointer = "right";
//			$("#descriptionBoxPointer").removeClass("pointerLeft");
//			$("#descriptionBoxPointer").addClass("pointerRight");
//		}

//		$("#descriptionBox").css("top", (posy - 16) + "px");
//		$("#descriptionBox").css("left", (posx - 352) + "px");
//	}
//	else
//	{
//		// Tooltip box at the right of the mouse
//		if (tooltipPointer == "right")
//		{
//			tooltipPointer = "left";
//			$("#descriptionBoxPointer").removeClass("pointerRight");
//			$("#descriptionBoxPointer").addClass("pointerLeft");
//		}

//		$("#descriptionBox").css("top", (posy - 16) + "px");
//		$("#descriptionBox").css("left", (posx + 32) + "px");
//	}
}

function getElementPosition(obj)
{
	var left = !!obj.offsetLeft ? obj.offsetLeft : 0;
	var top = !!obj.offsetTop ? obj.offsetTop : 0;

	while (obj = obj.offsetParent)
	{
		left += !!obj.offsetLeft ? obj.offsetLeft : 0;
		top += !!obj.offsetTop ? obj.offsetTop : 0;
	}

	return { x: left, y: top };
}