/*
*	DiapoAnnonces en CSS / JS
*	Développeur : Anthony MICHEL
*	Fonctions : 
*		- diapoAnnonces() : fonction d'appel du diaporama
*		- changeDiapo(id) : permet de changer le diaporama et afficher les infos de l'indice passé en paramètre
*		- disparaitre(id) : fait disparaitre la photo
*		- apparaitre(id) : fait apparaitre la photo en changeant par celle souhaitée
*/

var couleurOn = '#FFFFFF';
var couleurOff = '#CF2E47';
var nbAnnonces = 3;
var timerDiapoAnnonces = '';
var timerAutoStart = '';
var current = 0;
var prochain = 1;

function diapoAnnonces() // Fonction d'appel du diaporama
{
	var largeur_module = 510;
	var hauteur_module = 49*nbAnnonces;
	
	// Création du div qui va contenir tout notre module
	var divConteneur = document.createElement('div');
	divConteneur.setAttribute('id', 'diapo');
	divConteneur.style.position = 'relative';
	divConteneur.style.width = largeur_module + 'px';
	divConteneur.style.height = hauteur_module + 'px';
	divConteneur.style.margin = '0px';
	divConteneur.style.padding = '0px';
	divConteneur.style.zIndex = '1';
	divConteneur.style.textAlign = 'left';
	
	document.getElementById('presentation').appendChild(divConteneur);
	
	// Création du div qui va contenir la photo
	var divPhoto = document.createElement('div');
	divPhoto.setAttribute('id', 'photo');
	divPhoto.style.position = 'absolute';
	divPhoto.style.right = '0';
	divPhoto.style.width = '350px';
	divPhoto.style.height = hauteur_module + 'px';
	divPhoto.style.zIndex = '2';
	divPhoto.style.backgroundImage = "url('site/images/normal/" + diapo[2][0] + "')";
	divPhoto.style.backgroundPosition = "center center";
	divPhoto.style.backgroundRepeat = "no-repeat";
	divPhoto.style.opacity = 1;
	divPhoto.style.MsFilter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
	divPhoto.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
	divPhoto.style.MozOpacity = 1;
	divPhoto.style.KhtmlOpacity = 1;
	
	divConteneur.appendChild(divPhoto);
	
	// Création du div qui va contenir le bouton fiche
	var divBouton = document.createElement('div');
	divBouton.setAttribute('id', 'boutonFiche');
	divBouton.style.position = 'absolute';
	divBouton.style.right = '15px';
	divBouton.style.bottom = '15px';
	divBouton.style.width = '100px';
	divBouton.style.height = '25px';
	divBouton.style.zIndex = '4';
	divBouton.style.backgroundColor = "#000";
	divBouton.style.color = "#FFF";
	divBouton.style.fontFamily = "Arial";
	divBouton.style.fontSize = "10px";
	divBouton.style.textAlign = "center";
	divBouton.style.paddingTop = "6px";
	divBouton.style.opacity = 7;
	divBouton.style.MozOpacity = 7;
	divBouton.style.KhtmlOpacity = 7;
	divBouton.style.MsFilter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=70)';
	divBouton.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=70)';
	divBouton.innerHTML = '<a href="' + diapo[1][0] + '" title="' + diapo[0][0] + '" style="color:#FFF; text-decoration:none;">En savoir plus</a>';
	
	divConteneur.appendChild(divBouton);
	
	// Création de la liste des titres
	var ul = document.createElement('ul');
	ul.setAttribute('id', 'titres');
	ul.style.position = 'absolute';
	ul.style.width = '192px';
	ul.style.height = hauteur_module + 'px';
	ul.style.margin = '0';
	ul.style.padding = '0';
	ul.style.top = '0';
	ul.style.left = '0';
	ul.style.zIndex = '3';
	
	divConteneur.appendChild(ul);
	
	for(var i = 1; i <= nbAnnonces; i++)
	{
		window['li' + i] = document.createElement('li');
		window['li' + i].setAttribute('id', 'liste' + (i-1));
		window['li' + i].style.listType = 'none';
		window['li' + i].style.height = '49px';
		window['li' + i].style.margin = '0px';
		window['li' + i].style.padding = '0px';
		window['li' + i].style.top = '0px';
		if(i == 1)
		{
			window['li' + i].style.width = '192px';
			window['li' + i].style.backgroundImage = "url('diapoAnnonces/images/diapoAnnoncesOn.png')";
			window['li' + i].innerHTML = '<a href="javascript:void(0);" title="' + diapo[0][i-1] + '" onclick="changeDiapo(\'' + (i-1) + '\');" style="position:relative; margin-left:5px; top:5px; color:' + couleurOn + '; text-decoration:none; outline:none; font-weight:bold; font-family:Arial; font-size:12px;">' + diapo[0][i-1] + '</a>';
		}
		else
		{
			window['li' + i].style.width = '170px';
			window['li' + i].style.backgroundColor = '#FFF';
			window['li' + i].innerHTML = '<a href="javascript:void(0);" title="' + diapo[0][i-1] + '" onclick="changeDiapo(\'' + (i-1) + '\');" style="position:relative; margin-left:5px; top:5px; color:' + couleurOff + '; text-decoration:none; outline:none; font-weight:bold; font-family:Arial; font-size:12px;">' + diapo[0][i-1] + '</a>';
		}
		
		ul.appendChild(window['li' + i]);	
	}
	
	timerAutoStart = window.setInterval(function(){ changeDiapo(prochain); }, 3000);
}

function changeDiapo(id) //Permet de changer le diaporama et afficher les infos de l'indice passé en paramètre
{
	current = id;
	window.clearInterval(timerAutoStart); 
	if(current == nbAnnonces-1)
	{
		prochain = 0;
	}
	else
	{
		prochain = parseInt(current)+1;
	}
	
	var listes = document.getElementById('titres').getElementsByTagName('li');

	for(var i = 0; i < nbAnnonces; i++)
	{
		document.getElementById('liste' + i).style.width = '170px';
		document.getElementById('liste' + i).style.backgroundImage = '';
		document.getElementById('liste' + i).style.backgroundColor = '#FFF';
		document.getElementById('liste' + i).innerHTML = '<a href="javascript:void(0);" title="' + diapo[0][i] + '" onclick="changeDiapo(\'' + i + '\');" style="position:relative; margin-left:5px; top:5px; color:' + couleurOff + '; text-decoration:none; outline:none; font-weight:bold; font-family:Arial; font-size:12px;">' + diapo[0][i] + '</a>';
	}

	document.getElementById('liste' + id).style.width = '192px';
	document.getElementById('liste' + id).style.backgroundColor = '';
	document.getElementById('liste' + id).style.backgroundImage = "url('diapoAnnonces/images/diapoAnnoncesOn.png')";
	document.getElementById('liste' + id).innerHTML = '<a href="javascript:void(0);" title="' + diapo[0][id] + '" onclick="changeDiapo(\'' + id + '\');" style="position:relative; margin-left:5px; top:5px; color:' + couleurOn + '; text-decoration:none; outline:none; font-weight:bold; font-family:Arial; font-size:12px;">' + diapo[0][id] + '</a>';

	fade(id, 'disparaitre');
	document.getElementById('boutonFiche').innerHTML = '<a href="' + diapo[1][id] + '" title="' + diapo[0][id] + '" style="color:#FFF; text-decoration:none;">En savoir plus</a>';
	timerAutoStart = window.setInterval(function(){ changeDiapo(prochain); }, 3000);
}

function fade(id, type) //Fait apparaitre/disparaitre la photo
{
	window.clearInterval(timerDiapoAnnonces);
	timerDiapoAnnonces = window.setInterval(function(){ opacite(id, type); }, 15);
}

function opacite(id, sens) //Fait apparaitre la photo en changeant par celle souhaitée
{
	var opacite = document.getElementById('photo').style.opacity*100;
	
	if(sens == 'disparaitre')
	{
		if(opacite > 0)
		{
			document.getElementById('photo').style.opacity = Math.round(((opacite/100) - 0.1)*10)/10;
			document.getElementById('photo').style.MsFilter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + (opacite - 10) + ')';
			document.getElementById('photo').style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + (opacite - 10) + ')';
			document.getElementById('photo').style.MozOpacity = Math.round(((opacite/100) - 0.1)*10)/10;
			document.getElementById('photo').style.KhtmlOpacity = Math.round(((opacite/100) - 0.1)*10)/10;
		}
		else
		{
			window.clearInterval(timerDiapoAnnonces);
			document.getElementById('photo').style.backgroundImage = "url('site/images/normal/" + diapo[2][id] + "')";
			fade(id, 'apparaitre');
		}
	}
	else
	{
		if(opacite < 100)
		{
			document.getElementById('photo').style.opacity = Math.round(((opacite/100) + 0.1)*10)/10;
			document.getElementById('photo').style.MsFilter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + (opacite + 10) + ')';
			document.getElementById('photo').style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + (opacite + 10) + ')';
			document.getElementById('photo').style.MozOpacity = Math.round(((opacite/100) + 0.1)*10)/10;
			document.getElementById('photo').style.KhtmlOpacity = Math.round(((opacite/100) + 0.1)*10)/10;
		}
		else
		{
			window.clearInterval(timerDiapoAnnonces);
		}
	}
}