/**
 *
 * @author	Benoit Asselin <benoit(at)agenceici(dot)com>
 * @version	javascript.js, 2010/12/14
 * @link	http://www.agenceici.com/
 *
 */


/**
 * Variable pour le window.onload
 * @return {String}
 */
var v_onload = '';
window.onload = function() { eval(v_onload); };



var v_previous = '';
/**
 * Gestion des sous-menus
 * @param {String} p_id IDentifiant
 */
function smenu(p_id) {
	if(v_previous != p_id && v_previous) {
		Doc.id(v_previous).style.display = 'none';
	}
	v_previous = p_id;
	if(p_id) {
		Doc.id(p_id).style.display = 'block';
	}
}



/**
 * Convertir la transparence des images PNG sous Internet Explorer 6.0 et -
 */
function fixiePNG() {
	var msie = navigator.userAgent.match(/msie\s([\d\.]+)/i);
	if(msie && msie[1] <= '6.0') {
		var png = /\.png$/i;
		var imgs = document.getElementsByTagName('img');
		for(var i = 0, l = imgs.length; i < l; i++) {
			if(png.test(imgs.item(i).src)) {
				imgs.item(i).style.width = imgs.item(i).offsetWidth;
				imgs.item(i).style.height = imgs.item(i).offsetHeight;
				imgs.item(i).style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + imgs.item(i).src + '\',sizingMethod=\'image\')';
				imgs.item(i).src = 'images/null.gif';
			}
		}
	}
}



/**
 * Classe permettant d'executer des fondus sur un lot d'images
 * @param {String} p_id IDentifiant de l'element a manipuler
 * @constructor
 */
function ClassFade(p_id) {
	/** @return {HTMLElement} Element a manipuler */
	this.id = Doc.id(p_id);
	/** @return {HTMLCollection} Les images */
	this.images = this.id.getElementsByTagName('img');
	/** @return {Number} */
	this.imageFade = 0;
	/** @return {Number} Nombre du pas pour les incrementations, min:1 || max:100 */
	this.opacityStep = 3;
	/** @return {Number} Niveau d'opacite a atteindre, 0 ou 100 */
	this.opacityLevel = 100;
	/** @return {Number} Temps avant le prochain fade en Ms, 0=random() || xxx=fixe */
	this.timeNext = 1000;
	/** @return {Number} Temps avant la prochaine etape en Ms */
	this.timeMs = 20;
	/** @return {Boolean} Premier passage */
	this.firstRun = true;
	
	this.csszIndex();
	this.fade();
}
ClassFade.prototype = {
	/**
	 * Appliquer l'opacite en CSS
	 */
	cssOpaticy : function() {
		this.images.item(this.imageFade).parentNode.style.opacity = (this.opacityLevel / 100);
		this.images.item(this.imageFade).parentNode.style.mozOpacity = (this.opacityLevel / 100);
		this.images.item(this.imageFade).parentNode.style.filter = 'alpha(opacity=' + this.opacityLevel + ')';
	},
	/**
	 * Initialisation des zIndex
	 */
	csszIndex : function () {
		var v_Fade = this.imageFade;
		for(var v_zIndex = this.images.length; v_zIndex > 0; v_zIndex--) {
			this.images.item(v_Fade).parentNode.style.zIndex = v_zIndex;
			this.images.item(v_Fade).parentNode.style.opacity = '1';
			this.images.item(v_Fade).parentNode.style.mozOpacity = '1';
			this.images.item(v_Fade).parentNode.style.filter = 'alpha(opacity=100)';
			v_Fade = ((v_Fade + 1) >= this.images.length) ? (0) : (v_Fade + 1);
		}
	},
	/**
	 * Determiner le prochain fondu
	 * @return {Number} Prochain en Ms
	 */
	nextFade : function() {
		return (this.timeNext > 1) ? (this.timeNext) : (Math.random() * 20000);
	},
	/**
	 * Boucle pour les fondus
	 */
	fade : function() {
		this.cssOpaticy();
		
		var v_ms;
		if(this.firstRun) {
			this.firstRun = false;
			v_ms = this.nextFade();
			
		} else if(this.opacityLevel <= 0) {
			this.opacityLevel = 100;
			this.imageFade = ((this.imageFade + 1) >= this.images.length) ? (0) : (this.imageFade + 1);
			this.csszIndex();
			v_ms = this.nextFade();
			
		} else {
			this.opacityLevel = this.opacityLevel - this.opacityStep;
			v_ms = this.timeMs;
		}
		setTimeout(this.fade._bind(this), v_ms);
	}
};



/**
 * Classe effectant des fades
 * @param {HTMLElement} p_elt Element a manipuler
 * @param {Number} p_step Vitesse par etape
 * @param {Function} p_finish Fonction de retour
 * @constructor
 */
function ClassFadeBIS(p_elt, p_step, p_finish) {
	/** @return {HTMLElement} Element a manipuler */
	this.element = p_elt;
	/** @return {Number} Vitesse par etape @default 1 */
	this.step = (p_step !== undefined) ? (p_step) : (1);
	/** @return {Function} Fonction de retour @default function(){} */
	this.finish = (p_finish !== undefined) ? (p_finish) : function(){};

	/** @return {Number} Minimum @default 0 */
	this.min = 0;
	/** @return {Number} Maximum @default 100 */
	this.max = 100;

	/** @return {Number} Opacite actuelle */
	this.opacity = this.min;
	/** @return {Number} Temps en Ms par etape @default 10 */
	this.ms = 10;

	this.css();
}
ClassFadeBIS.prototype = {
	/**
	 * Style CSS
	 */
	css : function() {
		this.element.style.opacity = (this.opacity / 100); // CSS 3
		this.element.style.MozOpacity = (this.opacity / 100); // Moz
		this.element.style.filter = 'alpha(opacity=' + (this.opacity) + ')'; // MsIE
	},
	/**
	 * Fondu affichant l'element
	 */
	fadeIn : function() {
		this.opacity += this.step;

		if(this.opacity > this.max) {
			this.opacity = this.max;
			this.css();
			this.finish('fadein');
		} else {
			this.css();
			setTimeout(this.fadeIn._bind(this), this.ms);
		}
	},
	/**
	 * Fondu masquant l'element
	 */
	fadeOut : function() {
		this.opacity -= this.step;

		if(this.opacity < this.min) {
			this.opacity = this.min;
			this.css();
			this.finish('fadeout');
		} else {
			this.css();
			setTimeout(this.fadeOut._bind(this), this.ms);
		}
	}
};



/**
 * Fonction pour TinyMce, plus simple a manipuler
 * @param {MouseEvent} p_event Evenement du clic de souris
 * @return {Boolean} false
 */
function DisplayImage(p_event) {
	new ClassDisplayImg(p_event);
	return false;
}



/**
 * Afficher une image en grand sur fond noir
 * @param {MouseEvent} p_event Evenement du clic de souris
 * @constructor
 */
function ClassDisplayImg(p_event) {
	/** @return {MouseEvent} Evenement declenchant l'effet */
	this.event = p_event || window.event;
	/** @return {HTMLElement} Balise BODY */
	this.body = Doc.body();
	/** @return {HTMLElement} Balise IMG */
	this.image = FixEvent.element(this.event);

	/** @return {HTMLElement} Conteneur global */
	this.divContainer = null;
	/** @return {HTMLElement} Fond noir (selon CSS) */
	this.divBackground = null;
	/** @return {HTMLElement} L'image en elle-meme */
	this.divImage = null;

	/** @return {ClassFadeBIS} Fondu du fond */
	this.fadeBackground = null;
	/** @return {ClassFadeBIS} Fondu de l'image */
	this.fadeImage = null;

	this.findImage();
	this.build();
//	this.start();
}
ClassDisplayImg.prototype = {
	/**
	 * Recherche l'image et surtout si une image max id="id-max" existe
	 */
	findImage : function() {
		if(this.image.tagName.toLowerCase() != 'img') {
			this.image = this.image.getElementsByTagName('img').item(0);
		}
		if(this.image && this.image.id && Doc.id(this.image.id + '-max')) {
			this.image = Doc.id(this.image.id + '-max');
		}
	},
	/**
	 * Construction des elements pour la previsualisation
	 */
	build : function() {
		if(this.image) {
			this.divContainer = document.createElement('div');
			this.divContainer.className = 'display-image';
			this.divContainer.style.height = this.body.offsetHeight + 'px'; // fix
			this.divBackground = document.createElement('div');
			this.divImage = document.createElement('img');
			this.divImage.style.top = (document.documentElement.scrollTop || document.body.scrollTop) + (screen.height / 2.5) + 'px'; // fix

			this.fadeBackground = new ClassFadeBIS(this.divBackground, 20);
			this.fadeBackground.max = 80;
			this.fadeImage = new ClassFadeBIS(this.divImage, 5, this.updateByFade._bind(this));

			// Position dans le code pour MsIE
			this.divImage.onload = this.loadImage._bind(this);
			this.divImage.src = this.image.src;
			// Position dans le code pour MsIE

			this.divContainer.appendChild(this.divBackground);
			this.divContainer.appendChild(this.divImage);
			this.body.appendChild(this.divContainer);

			this.divImage.style.marginLeft = -(this.divImage.offsetWidth / 2) + 'px';
			this.divImage.style.marginTop = -(this.divImage.offsetHeight / 2) + 'px';
		} else {
			alert('L\'image est introuvable...');
		}
	},
	/**
	 * Chargement de l'image termine -> this.start()
	 * @param {Event} p_event Evenement de chargement
	 */
	loadImage : function(p_event) {
		this.divImage.style.marginLeft = -(this.divImage.offsetWidth / 2) + 'px';
		this.divImage.style.marginTop = -(this.divImage.offsetHeight / 2) + 'px';
		this.start();
	},
	/**
	 * Destruction des elements
	 */
	destroy : function() {
		this.body.removeChild(this.divContainer);
		this.divContainer.removeChild(this.divBackground);
		this.divContainer.removeChild(this.divImage);
	},
	/**
	 * Fonction appelee par la classe ClassFadeBIS
	 * @param {String} p_mode Mode de fondu: 'fadein', 'fadeout'
	 */
	updateByFade : function(p_mode) {
		if(p_mode == 'fadein') {
			this.divContainer.onclick = this.close._bindEvent(this);
		} else {
			this.destroy();
		}
	},
	/**
	 * Demarrage de l'apercu
	 */
	start : function() {
		this.divContainer.onclick = null;
		this.fadeBackground.fadeIn();
		this.fadeImage.fadeIn();
	},
	/**
	 * Fermeture de l'apercu
	 */
	close : function() {
		this.divContainer.onclick = null;
		this.fadeBackground.step = 10;
		this.fadeBackground.fadeOut();
		this.fadeImage.step = 10;
		this.fadeImage.fadeOut();
	}
};