/*	---------------------------------------
	Filename: Page.js
	Date: 12 Aout 2011
	Auteur: Benoit Leblanc
	
	Description: 	
		Fonctions d'affichage partagées par les toutes pages du site Web SimplyCité
		Gestion de l'affichage des contenu photos/contenu principaux des pages
	
	ChangeLog:
	12 Août 2011	Benoit Leblanc		Version initiale
	--------------------------------------- */

// ********[ GLOBALS ]******************
var Page_CurrentSousSection = ''; // La sous-section selectionnee
var Page_TimerForceSidebarToAppear = null; // Timer pour forcer l'apparition de la SideBar

// Function: ShowContent
// Description: Cacher la photo si presente, positionner le contenu selon la categorie choisie et
//			re-dimensionner la hauteur de la SideBar
// Parameters: pContentName - ID du contenu a afficher
// Returns: n/a
function ShowContent($pContentName)
{
	// Sanity Check
	if ($('.Content').find('#' + $pContentName.replace(' ', '_')) == null)
		return;
	
	
	// Afficher le contenu (sous la photo)
	if ($('.ContentContainer').css("display") == 'none')
	{
		$('.ContentContainer').show();
	}
	
	// Cacher le curseur precedent et reinitialiser classe Item sur click
	$('#cursor' + Page_CurrentSousSection).animate({left: "250px", filter: ''}, "fast");
	$('#item' + Page_CurrentSousSection).attr('class', 'Item');
	
	// Conserver le nom de la nouvelle section affichee
	Page_CurrentSousSection = $pContentName;
	
	// Afficher le nouveau curseur
	$('#cursor' + Page_CurrentSousSection).css("left", "200px");
	document.getElementById('cursor' + Page_CurrentSousSection).style.display = 'block';
	$('#cursor' + Page_CurrentSousSection).animate({left: "210px", filter: ''}, "normal");
	$('#item' + Page_CurrentSousSection).attr('class', 'ItemSelected');
	
	// Calcul du positionnement du contenu
	$lContentGoToPositionY = $('.Content').find('#' + $pContentName.replace(' ', '_')).position().top;
	$lContentHeight = -45 + $('.Content').find('#' + $pContentName.replace(' ', '_')).height();
	
	// La hauteur minimale de contenu d'une page de contenu est 512 px
	if ($lContentHeight <= 512) 
		$lContentHeight = 512;
	else
		$lContentHeight += 45;

	
	// La photo est affichee : positionne le contenu (sans animation) et faire un cross-fade entre
	// photo et contenu
	if ($('.Photo').css('display') == 'block')
	{
		// hide photo and show content at right position
		
		// set content at right position (no animation)
		$('.Content').css('top', "-" + $lContentGoToPositionY + "px");
		
	
		// Fade out photo
		$('.Photo').animate({opacity: '0'}, 'normal', function(){
			$(this).css('display', 'none');
			});		
	}
	else
	{
		// Le contenu est deja affiche (pas de photo a cacher) -- postionner le contenu a la nouvelle
		// position
		$('.Content').animate({top: "-" + $lContentGoToPositionY + "px", filter:''}, "normal");
	}
	
	// Animate resize of sidebar and such
	$('.Main').animate({height:  294 + $lContentHeight + "px", filter:''}, "normal");
	
	$('.ContentContainer').animate({height:  $lContentHeight + "px", filter:''}, "normal");
	$('.SideBar').animate({height:  $lContentHeight + "px", filter:''}, "normal");
	$('.SideBarPanel').animate({height:  $lContentHeight + "px", filter:''}, "normal");
	$('.SideBar .Container').animate({height:  $lContentHeight + "px", filter:''}, "normal");
	//$('.SideBar .LeftGradient').animate({height:  $lContentHeight + "px"}, "normal");
	
	//$('.Footer').animate({top:  210 + $lContentHeight + "px"}, "normal");
}

// Function: ShowPhoto
// Description: L'utilisateur clique sur la categorie deja presente (bare de navigation ou Sidebar)
//		Afficher la photo avec un cross-fade entre contenu et photo
// Parameters: n/a
// Returns : n/a
function ShowPhoto()
{
	if ($('.Photo').css('display') == 'block')
	{
		return;
	}
	
	// Chacher le curseur s'il est visible
	if (Page_CurrentSousSection != '')
	{
		$('#cursor' + Page_CurrentSousSection).animate({left: "220px", opacity: "0"}, "fast");
		$('#item' + Page_CurrentSousSection).attr('class', 'Item');
	}
	Page_CurrentSousSection = '';
	
	// Reinitialiser la hauteur de la Sidebar
	$lContentHeight = 512;
	$('.Main').animate({height:  294 + $lContentHeight + "px"}, "normal");
	
	$('.ContentContainer').animate({height:  $lContentHeight + "px"}, "normal");
	$('.SideBar').animate({height:  $lContentHeight + "px"}, "normal");
	$('.SideBar .Container').animate({height:  $lContentHeight + "px"}, "normal");
	$('.SideBarPanel').animate({height:  $lContentHeight + "px"}, "normal");
	
	// Move quote if available
	document.getElementById('PhotoQuote').style.display = 'block';
	$('#PhotoQuote').css('opacity', '0.5');
	$('#PhotoQuote').css('left', '260px');
	$('#PhotoQuote').animate({left:  '280px', opacity: '1', filter:''}, 'slow');
	
	$('.Photo').css('display', 'block').animate({opacity: '1', filter:''}, 'slow');
}

// Function: getQueryStringParameterByName
// Description: Fonction generique pour extraire la valeur d'un parametre passes au URL
// Parameters: name
// Returns: valeur du parametre
function getQueryStringParameterByName(name)
{
  name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
  var regexS = "[\\?&]" + name + "=([^&#]*)";
  var regex = new RegExp(regexS);
  var results = regex.exec(window.location.href);
  if(results == null)
    return "";
  else
    return decodeURIComponent(results[1].replace(/\+/g, " "));
}

// Function: ShowFirstLaunchAnimation
// Description: Affichage de l'animation complet d'une section (afficher photo, 
//			apparition d'une quote, affichage de la SideBar et animation des 
//			sous-section de la SideBar)
// Parameters: n/a
// Returns: n/a
function ShowFirstLaunchAnimation()
{
	// Initial state
	$('#PhotoQuote').css('opacity', '0');
	$('#PhotoQuote').css('left', '200px');	
	
	$('.SideBar').css('opacity', '0');
	$('.SideBar').css('left', '-250px');
	
	$('.SideBar .Item').each(function() {
		$(this).css('left', '-250px');
	});
	
	// Show animation
	if ($('#PhotoQuote').length > 0)
	{
		document.getElementById('PhotoQuote').style.display = 'block';
		$('#PhotoQuote').delay(700).animate({left:  '280px', opacity: '1', filter:''}, 'slow');
		$('.SideBar').delay(2500).animate({left:  '0px', opacity: '1', filter:''}, 'slow');
		$lCurrentItemID = 1;
		$('.SideBar .Item').each(function() {
			$(this).delay(3000 + 100 * $lCurrentItemID++).animate({left:  '0px', filter:''}, 'slow');
		});
	}
	else
	{
		$('.SideBar').delay(700).animate({left:  '0px', opacity: '1', filter:''}, 'slow');
		$lCurrentItemID = 1;
		$('.SideBar .Item').each(function() {
			$(this).delay(1300 + 100 * $lCurrentItemID++).animate({left:  '0px', filter:''}, 'slow');
		});
	}
}


// Function: ReCenterContent
// Description: Posititionnement centre du contenu principal de la page avec espace reservee a la scrollbar
// Parameters: n/a
// Returns: n/a
function ReCenterContent()
{
	// Calcul du positionnement horizontal du contenu (pour laisser place a la scrollbar a droite)
	var $lWidthFenetre = $(window).width();
	var $lWidthContenu = 1024 + 20 + 20; // Largeur contenu + largeur ombrages
	
	// Le contenu est plus grand que la fenetre
	if ($lWidthFenetre <= $lWidthContenu)
	{
		// Retirer l'ombrage des deux cotes
		$('.SimplyCite .LeftSide').hide();
		$('.SimplyCite .RightSide').hide();
		
		$lWidthContenu -= 40;
		$('.SimplyCite').css('margin', '0px 0px 0px 0px');
	}
	else
	{
		$('.SimplyCite .LeftSide').show();
		$('.SimplyCite .RightSide').show();
	
		// Recentrer le contenu au milieu de la fenetre en gardant l'espace necessaire pour l'affichage de la scrollbar
		var $lLargeurScrollbar = 20;
		if ($(document).height() > $(window).height()) 
		{
			// La scrollbar est deja visible
			$lLargeurScrollbar = 0;
		}
		var $lWidthGauche = ($lWidthFenetre - $lWidthContenu)/2 - $lLargeurScrollbar;
		//$('.SimplyCite').animate({'marginTop': '0px', 'marginRight': '0px', 'marginBottom': '0px', 'marginLeft': $lWidthGauche + 'px'}, 'slow');
		$('.SimplyCite').css('margin', '0px 0px 0px ' + $lWidthGauche + 'px');
	}
}

// Function: ForceSidebarToAppear
// Description: Forcer la Sidebar a apparaitre apres un certain lapse de temps dans l'eventualite
// 				ou il y aurait un probleme avec l'affichage de l'animation de la SideBar
//				Fonction appelee a partir du timer _timerForceSidebarToAppear
// Parameters: n/a
// Returns: n/a
function ForceSidebarToAppear()
{
	if (Page_TimerForceSidebarToAppear != null)
	{
		clearTimeout(Page_TimerForceSidebarToAppear);
		Page_TimerForceSidebarToAppear = null;
	}

	if ($('.SideBar').css('opacity') < 0)
	{
		$('.SideBar').animate({opacity: '1', filter:''}, 'fast');
	}
}

$(document).ready(function() {	
	ReCenterContent();
	
	Page_TimerForceSidebarToAppear = setTimeout("ForceSidebarToAppear()", 10000); // Forcer la SideBar a apparaitre
});

// Function: n/a
// Description: Point d'entree de l'affichage de la page avec l'annimation de demarrage
//			Lecture du cookie pour savoir s'il faut faire l'animation (plus de 24 hrs de la derniere visite)
// Parameters: n/a
// Returns: n/a
$(window).load(function() {
	ReCenterContent();

	$lSection = getQueryStringParameterByName('section');
	if ($lSection != null && $lSection.length > 0)
	{
		ShowContent($lSection);
	}
	
	// Animate screen on launch
	$lSectionName = window.location.pathname.split( '/' )[1];
	$lIsFirstLaunch = $.cookie('simplycite_' + $lSectionName + '_animation');
	if ($lIsFirstLaunch == null)
	{
		// Show animation
		ShowFirstLaunchAnimation();
	}
	else
	{
		// Animate only quote
		// Move quote if available
		$('.SideBar').css('opacity', '0');
		$('.SideBar').css('left', '0px');
		if ($('.Photo').length > 0)
		{
			// Afficher la sidebar apres la photo
			$('.SideBar').delay(750).animate({opacity: '1', filter:''}, 'normal');
		}
		else
		{
			// Pas de photo a afficher, passer directement au contenu
			$('.SideBar').animate({opacity: '1', filter:''}, 'fast');
		}
		document.getElementById('PhotoQuote').style.display = 'block';
		$('#PhotoQuote').css('opacity', '0.5');
		$('#PhotoQuote').css('left', '260px');
		$('#PhotoQuote').animate({left:  '280px', opacity: '1', filter:''}, 'slow');
	}
	
	// Update Animation Displayed
	$.cookie('simplycite_' + $lSectionName + '_animation', 'false', { expires: 1, path: '/' });
	
	
});

// Function: n/a
// Description: Fonction appelle a tous les resize de la fenetre
// Parameters: n/a
// Returns: n/a
$(window).resize(function() {
  ReCenterContent();
});