// le chemin vers le dossier des images
var Images_ImagesDir = '../images/uploaded/';
// l'id du masque modal
var Images_ModalMaskId = 'ModalMask';
// l'id de la fleche previous
var Images_PreviousArrowId = 'PicturePreviousArrow';
// l'id de la fleche next
var Images_NextArrowId = 'PictureNextArrow';
// l'id du spacer des fleches
var Images_SpacerArrowId = 'PictureArrowSpacer';


// objet avec les informations sur une image
function Images_ImageInfos(imageId, imageUniqueId, thumbUrl, imageUrl, width, height, desc, author, indexInList)
{
	this.Id = imageId;
	this.ThumbUrl = thumbUrl;
	this.ImageUrl = imageUrl;
	this.Description = desc;
	this.Author = author;
	this.Width = width;
	this.Height = height;
	this.UniqueId = imageUniqueId;
	this.IndexInList = indexInList;
}

// objet avec les informations sur les id des élements constitutif de l'aperçu d'une image
function Images_PictureViewerInfos(imageInfos, containerId, copyrightId, pictureId, descriptorId)
{
	this.ImageInfos = imageInfos;
	this.ViewerContainerId = containerId;
	this.CopyrightContainerId = copyrightId;
	this.PictureContainerId = pictureId;
	this.DescriptionContainerId = descriptorId;
}


function Images_ShowDetailledImage(viewerInfos)
{
	var container = document.getElementById(viewerInfos.ViewerContainerId);
	var copyright = document.getElementById(viewerInfos.CopyrightContainerId);
	var picture = 	document.getElementById(viewerInfos.PictureContainerId);
	var descriptor = document.getElementById(viewerInfos.DescriptionContainerId);
	var arrowPrevious = document.getElementById(Images_PreviousArrowId);
	var arrowNext = document.getElementById(Images_NextArrowId);
	var arrowSpacer = document.getElementById(Images_SpacerArrowId);
	
	var imageViewer = new Image();

	// définition de la source de l'image
	imageViewer.src = Images_ImagesDir+viewerInfos.ImageInfos.ImageUrl;
	imageViewer.style.width = viewerInfos.ImageInfos.Width + 'px';
	imageViewer.style.height = viewerInfos.ImageInfos.Height + 'px';
	
	descriptor.style.width = viewerInfos.ImageInfos.Width + 'px';
	descriptor.innerHTML = viewerInfos.ImageInfos.Description;
	
	picture.src = Images_ImagesDir+viewerInfos.ImageInfos.ImageUrl;
	copyright.innerHTML = viewerInfos.ImageInfos.Author;
	
	// mise à jour des dimensions du panel de copyright
	if( imageViewer.width > 0 ) copyright.style.width = imageViewer.width+'px';
	else copyright.style.width = '100%';
	if( imageViewer.height > 0 ) copyright.style.height = imageViewer.height+'px';
	else copyright.style.height = '100%';

	// on place la visionneuse au centre de l'écran
	if( viewerInfos.ImageInfos.Width > 0 && Common_GetRealClientWidth() > 0 ) container.style.left = parseInt(Math.max(0, Common_GetRealClientWidth() - viewerInfos.ImageInfos.Width ) / 2) + 'px';
	else  container.style.left = '0px';
	if( viewerInfos.ImageInfos.Height > 0 && Common_GetRealClientHeight() > 0 ) container.style.top = parseInt(Math.max(0, Common_GetRealClientHeight() - viewerInfos.ImageInfos.Height ) / 2) + 'px';
	else  container.style.top = '0px';

	// mise à jour de flèches de défilement
	if(viewerInfos.ImageInfos.Width > 0)
	{
		arrowSpacer.style.width = (viewerInfos.ImageInfos.Width - 70) + 'px';
		arrowPrevious.style.marginTop = '60px';
		arrowNext.style.marginTop = '60px';
	}

	// on rend tout visible
	container.style.visibility = 'visible';	
}

function Images_HideDetailledImage(viewerInfos)
{
	document.getElementById(viewerInfos.ViewerContainerId).style.visibility = 'hidden';
}

// méthode d'affichage d'une image (via un objet Images_ImageInfos)
function Images_ShowModalImage(imageInfos, showNavigation, imageList)
{
	var arrowPrevious = document.getElementById(Images_PreviousArrowId);
	var arrowNext = document.getElementById(Images_NextArrowId);
	
	// affichage du cadre modal
	Modal_ShowModal(Images_ModalMaskId);
	
	// mise à jour de l'objet de configuration du viewer
	Page_ViewerConfig.ImageInfos = imageInfos;
	
	// affichage de l'image et de ses informations
	Images_ShowDetailledImage(Page_ViewerConfig);
	
	arrowPrevious.style.display = 'none';
	arrowNext.style.display = 'none';
		
	if (showNavigation == true)
	{
		if (imageInfos.IndexInList > 0)
		{
			arrowPrevious.style.display = 'block';
			arrowPrevious.onclick = function() { Images_ShowModalImage(imageList[imageInfos.IndexInList - 1], true, imageList); }
			Opacity_SetOpacity(10, Images_PreviousArrowId);
		}
		
		if (imageInfos.IndexInList < imageList.length - 1)
		{
			arrowNext.style.display = 'block';
			arrowNext.onclick = function() { Images_ShowModalImage(imageList[imageInfos.IndexInList + 1], true, imageList); }
			Opacity_SetOpacity(10, Images_NextArrowId);
			
			if (imageInfos.IndexInList == 0) arrowNext.style.marginLeft = '35px';
			else arrowNext.style.marginLeft = '0px';
		}
	}
}

function Images_ChangeArrowOpacity(opacity)
{
	var arrowPrevious = document.getElementById(Images_PreviousArrowId);
	var arrowNext = document.getElementById(Images_NextArrowId);
	
	if (arrowPrevious.style.display != 'none') Opacity_SetOpacity(opacity, Images_PreviousArrowId);
	if (arrowNext.style.display != 'none') Opacity_SetOpacity(opacity, Images_NextArrowId);
}