// JavaScript Document
function Page() {
	
/*       recherche des hauteurs des composants de la page affichée     */

	//this.hauteur =  browser.GetElementHeight('global') + browser.GetElementHeight('entete');
	this.hauteur =  $('global').getHeight() + $('entete').getHeight();
	
//	alert('hauteur = ' + this.hauteur);
/*       recherche de la largeur de la page       */
	
	/*this.largeurFenetre = browser.GetWindowWidth();
	this.hauteurFenetre = browser.GetWindowHeight();*/
	this.largeurFenetre = document.viewport.getWidth();
	this.hauteurFenetre = document.viewport.getHeight(); 
	
/*      Position dans la page       */

	var position_scroll_ar = $('body').cumulativeScrollOffset();
	this.scrollH = position_scroll_ar[1];
	this.scrollG = position_scroll_ar[0];

/* les éléments du dom impliqué */

	this.fond = $('fond');	
	this.chargement = $('chargement');
	this.affichage = $('affichage'); // div contenant l'image pour affichage des images
	this.image = $('image_zoom');
	this.article = $('layer_article');
	this.layer_erreur_syst = $('layer_erreur_syst');
	this.layer_erreur = $('layer_erreur');
	this.layer_info = $('layer_info');
	
		
/*	PARAMETRES MODIFIABLE	*/
	
/* paramètre d'affichage des images pouvant être modifié */
	this.cadreImgHauteur = 60;
	this.cadreImgLargeur = 60;
	this.cadreMarginHauteur = 30;
	this.cadreMarginLargeur = 50;
	
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Donner les valeur au Layer conteneur
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/ 
	this.SetLayer = function (idlayer, width, height){
		this.layer=$(idlayer);
		this.layerHauteur = height;
		this.layerLargeur = width;	
	}
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Afficher le fond opacifié
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/  	
	this.AfficheFond = function (){
		this.fond.style.top = 0;
		this.fond.style.left = 0;
		this.fond.style.height = this.hauteur+'px';
		this.fond.style.width = this.largeurFenetre+'px';	
		this.fond.style.display = 'block';
	}
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Affichage de l'animation pour le chargement
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/  		
	this.AfficheChargement = function (){
	
	this.chargement.style.left = this.scrollG + parseInt(this.largeurFenetre - this.chargement.width) / 2+'px';
	this.chargement.style.top = this.scrollH + parseInt(this.hauteurFenetre - this.chargement.height ) / 2+'px';
	/*alert('scrollH = ' + this.scrollH );*/
		this.chargement.style.display = 'block';
		this.fond.style.display = 'block';
	}
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Cache layer
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/  	
	this.CacheLayer = function (id_layer){

		$(id_layer).style.display = 'none';
		// on cache le fond si aucun autre layer est affiché	
		if(this.layer_erreur_syst.style.display != 'block' 
			 && this.layer_erreur.style.display != 'block' 
			 && this.layer_info.style.display != 'block' 
			 //&& this.article.style.display != 'block' 
			 && this.affichage.style.display != 'block'){
			this.fond.style.display = 'none';
		}
		return false;
	}	
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Affichage de l'image
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/  	
	this.AfficheImage = function (imgZoom){
	
		img = new Image();
		img.onload=function() {
			var htmlElt = new Page();
			var imgl = img.width;
			var imgh = img.height;
			if (imgl + htmlElt.cadreImgLargeur > htmlElt.largeurFenetre) {
				imgl = htmlElt.largeurFenetre - htmlElt.cadreImgLargeur;
				imgh = img.height * imgl / img.width;
			}
			if (imgh + htmlElt.cadreImgHauteur > htmlElt.hauteurFenetre) {
				imgh = htmlElt.hauteurFenetre - htmlElt.cadreImgHauteur;
				imgl = img.width * imgh / img.height;
				
			}
			
			htmlElt.affichage.style.top = htmlElt.scrollH + (htmlElt.hauteurFenetre - imgh - htmlElt.cadreMarginHauteur) / 2+'px';
			htmlElt.affichage.style.left = htmlElt.scrollG + (htmlElt.largeurFenetre - imgl - htmlElt.cadreMarginLargeur) / 2+'px';
			htmlElt.affichage.style.width = imgl + htmlElt.cadreMarginLargeur + 'px';
			htmlElt.affichage.style.height = imgh + htmlElt.cadreMarginHauteur + 'px';
			htmlElt.image.src= imgZoom;
			htmlElt.image.width = imgl;
			htmlElt.image.height = imgh;
			htmlElt.affichage.style.display = 'block';
			htmlElt.chargement.style.display = 'none';
			
			return false;
		}
		img.src= imgZoom;
	
	}
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Affichage centré d'un layer
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/  	
	this.AfficheLayer = function (){	
		this.layer.style.left = this.scrollG + parseInt(this.largeurFenetre - this.layerLargeur) / 2+'px';
		this.layer.style.top = this.scrollH + parseInt(this.hauteurFenetre - this.layerHauteur ) / 2+'px';
		
		this.layer.style.display = 'block';
		this.fond.style.display = 'block';
	/*	alert('scrollH = ' + this.scrollH + '\n ' +
					'largeurFenetre = ' + this.largeurFenetre + '\n  ' +
					'layerLargeur = ' + this.layerLargeur + '\n  ' +
					'layer.style.left = ' + this.layer.style.left);*/
	}
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Cache l'image
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/  	
	this.CacheImage = function (){	
		this.fond.style.display = 'none';
		this.affichage.style.display = 'none';
		return false;
	}


/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
		Deplacement de l'image au centre
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX*/  	
	this.MouvImgCenter = function (){	
		if (this.fond.style.display != 'block') return;
		if (this.affichage.style.display != 'block') this.affichage = this.chargement;
		
		this.affichage.style.top = this.scrollH + (this.hauteurFenetre - parseInt(this.affichage.style.height) - this.cadreMarginLargeur) / 2+'px';
		this.affichage.style.left = this.scrollG + (this.largeurFenetre - parseInt(this.affichage.style.width) - this.cadreMarginHauteur) / 2+'px';
	}

}// fin class

	
/* POUR LE ZOOM DES IMAGES */
function ViewImage(imgZoom) {
	var page = new Page();	
	// affichage du fond
	page.AfficheFond();
	// Affichage de l'animation pour le chargement
	page.AfficheChargement();
	// affichage de 
	page.AfficheImage(imgZoom);
}

function cacherImage() {
	var page = new Page();	
	page.CacheImage('affichage');
}


function deplacerImage() {
	var page = new Page();	
	page.MouvImgCenter();
	
}
/* POUR LE LAYER DES ARTICLES */
function ViewArticleLoading() {	
	var page = new Page();	
	// affichage du fond
	page.AfficheFond();
	// Affichage de l'animation pour le chargement
	page.AfficheChargement();
	
}

function ViewArticle() {	
	var page = new Page();
	page.chargement.style.display = 'none';
	page.SetLayer('layer_article', '697', '479');
	page.AfficheLayer();
	// vertical slider control

var slider1 = new Control.Slider('article_handleV', 'article_trackV', {
		axis: 'vertical',
		onSlide: function(v) { scrollVertical(v, $('layer_article_scrollabel'), slider1);  },
		onChange: function(v) { scrollVertical(v, $('layer_article_scrollabel'), slider1); }
	});
	
	// scroll the element vertically based on its width and the slider maximum value
	function scrollVertical(value, element, slider) {
		element.scrollTop = Math.round(value/slider.maximum*(element.scrollHeight-element.offsetHeight));
	}
	
	// disable vertical scrolling if text doesn't overflow the div
	if ($('layer_article_scrollabel').scrollHeight <= $('layer_article_scrollabel').offsetHeight) {
		slider1.setDisabled();
		$('article_trackV').hide();
	}	

}

function CacherArticle() {
	var page = new Page();
	page.SetLayer('layer_article', 0, 0);
	page.CacheLayer('layer_article');
}


/* POUR LES LAYER D'ALERTE */

function ViewLayerErreur(idLayer) {	
	var page = new Page();	
	// affichage du fond
	page.AfficheFond();
	// Affichage de l'animation pour le chargement
	page.AfficheChargement();
	// affichage du cadre des layer
	page.SetLayer(idLayer,519 ,315);
	page.AfficheLayer();

	// vertical slider control
	var slider1 = new Control.Slider(idLayer+'_handleV',idLayer+'_trackV', {
		axis: 'vertical',
		onSlide: function(v) { scrollVertical(v, $(idLayer+'_scrollabel'), slider1);  },
		onChange: function(v) { scrollVertical(v, $(idLayer+'_scrollabel'), slider1); }
	});
	// scroll the element vertically based on its width and the slider maximum value
	function scrollVertical(value, element, slider) {
		element.scrollTop = Math.round(value/slider.maximum*(element.scrollHeight-element.offsetHeight));
	}
	// disable vertical scrolling if text doesn't overflow the div
	if ($(idLayer+'_scrollabel').scrollHeight <= $(idLayer+'_scrollabel').offsetHeight) {
		slider1.setDisabled();
		$(idLayer+'_trackV').hide();
	}
	
}
function CacherLayerErreur(idLayer) {
	var page = new Page();
	page.SetLayer(idLayer,0,0);
	page.CacheLayer(idLayer);
}
/* AFFICHE LE LAYER  POUR LES ALERTES JAVASCRIPT */

function AlertJs(str, layer_type){
	switch (layer_type){
		case 1 :  // erreur système
			$("layer_erreur_syst_js_value").innerHTML = str;
			ViewLayerErreur('layer_erreur_syst');
		  break;
		case 2 :  // alerte système
			$("layer_erreur_js_value").innerHTML = str;
			ViewLayerErreur('layer_erreur');
		  break;
		 case 3 :  // alerte informative
			$("layer_info_js_value").innerHTML = str;
			ViewLayerErreur('layer_info');
		  break;
	}
		
}