liste_diapo = [];

function Diaporama(divDiapo,divLegend) {
    var temporisation = 0; //en ms
    var name = divDiapo;
    var nameLegend = divLegend;
    var nameFrame = null;
    var effet= null;
    var liste = new Array;
    var listeTxt = new Array;
    var nombre = 0;
    var nbLoaded = 0;
    var legend = new Array;
    var NbLegend = new Array;
    var idx = 0;
    var timer = null;
    var started = false;
    //	var liste_reflet = new Array;
    //	var reflet = $('#battant');
    //	var nombre_reflet = 0;
    //	var idx_reflet = 0;
    var width = 0;
    var height = 0;
    // On enregistre le diporama dans la liste
    liste_diapo[name] = this;	
    
    this.init = function Diaporama_init(){
	//Retire le contenu
	$('#'+name).html();
	$('#'+name).append('<div/>');
	$('#'+name).append('<div/>');
	$('#'+name).append('<div/>');
	
	$('#'+nameLegend).html();
	//Clear image in html code
	$('#'+name+' *:eq(0)').css('display','none');
	$('#'+nameLegend+' *:eq(0)').css('display','none');
    } // fin fonction init
    
    this.setEffect = function Diaporama_init(effetType,tempo){
	temporisation = tempo; //en ms
	effet=effetType;
    }
    
    this.addImage = function Diaporama_add(path,txtlegend){
	var img = new Image();
	img.src=path;
	$(img).attr('src',img.src) ;
	if (img.complete) {
	    if (width < img.width) {
		width=img.width;
	    }
	    if (height < img.height) {
		height=img.height;
	    }
	    this.sizeFrame();
	    nbLoaded++;
	} else {
	    var diapo = this;
	    $(img).load(function () {
		    if (width < this.width) {
			width=this.width;
		    }
		    if (height < this.height) {
			height=this.height;
		    }
		    diapo.sizeFrame();
		    nbLoaded++;
		});
	}
	img.html = $('<img/>').attr('src',img.src);
	liste[nombre] = img;
	
	addLegend(txtlegend);
	nombre++;			
    } // fin fonction add
    
    function addLegend(txtlegend) {
	legend[nombre] = txtlegend;
    } // fin fonction add
    
    this.addText = function Diaporama_text(text){
	var obj = new Object();
	obj.text = text;
	obj.html = $('<div/>').attr('class','diapotext').html(obj.text); 	

	liste[nombre] = obj;
	listeTxt.push(obj.html);
	nombre++;			
	nbLoaded++;
    } // fin fonction add
    
    /*	this.addReflet = function Diaporama_addReflet(path){
	var img = new Image();
	img.src = path;
	liste_reflet[nombre_reflet] = img;
	nombre_reflet++;			
	} // fin fonction add
    */

    this.start = function(){
	$(name).css('display','hide');

	$('#'+nameLegend).html("Chargement ..."); 
	var diapo = this;
	// Wait the complete loading
	$(function() {
	    started = true;
	    diapo.sizeFrame();
	
	    idx = nombre - 1;
	    updatePos();	    
	    });
    } // fin fonction start
    
    this.play = function(){
	if (started == false) {
	    var cmd = "liste_diapo['" + name + "'].play()";
	    window.setTimeout(cmd,1000);
	} else {
	    $(name).css('display','inline');
	    var cmd = "liste_diapo['" + name + "'].change()";
	    window.setTimeout(cmd,temporisation);
	}
    } // fin fonction start
    
	
    this.change = function Diaporama_change(){
	var cmd = "liste_diapo['" + name + "'].transition()";
	timer=window.setInterval(cmd,5);
    } // fin fonction change
    
    this.transition = function Diaporama_transition(){
	switch(effet) {
	case 0://Replace effect
	effet0();
	break;
	case 1://Slide effect
	effet1();
	break;
	default:
	}
    }
    
    function effet0()
    {
	var imgs = $('#'+name+' > div').get();
	var img = null;
	
	//Move frame (without redrawn)
	for (var slide in imgs) {
	    imgs[slide].posDiv--;
	    
	    if (imgs[slide].posDiv < -1) {
		imgs[slide].posDiv=width;
		img=imgs[slide];
	    } else if (imgs[slide].posDiv == -1) {
		imgs[slide].posDiv=-width;
	    } else {
		imgs[slide].posDiv=0;
	    }
	}
	
	//Display frame
	for (var slide in imgs) {
	    imgs[slide].style.left=imgs[slide].posDiv + "px";
	}
	
	if(img!=null)  {
	    /*
            if (reflet!=null && nombre_reflet>0)
	    {
	    reflet.src=liste_reflet[idx_reflet % nombre_reflet].src;
	    idx_reflet++;
	    }*/
	    obj = liste[idx % nombre];
	    $(img).html(obj.html);
	    
	    leg = legend[idx % nombre];
	    if (nameLegend != null && leg != null)
		$('#'+nameLegend).html(leg.html);
	    idx++;
	    
	    //loop effect
	    window.clearInterval(timer);
	    timer=null;
	    var cmd = "liste_diapo['" + name + "'].change()";
	    window.setTimeout(cmd,temporisation);
	}
	
    } // fin effect 0: replace
    
    function effet1()
    {
	var imgs = $('#'+name+' > div').get();
	var img = null;
	
	//Move frame (without redrawn)
	for (var slide in imgs) {
	    imgs[slide].posDiv--;
	    
	    if (imgs[slide].posDiv < -2*width) {
		imgs[slide].posDiv=width;
		img=imgs[slide];
	    }
	}
	
	//Display frame
	for (var slide in imgs) {
	    imgs[slide].style.left=imgs[slide].posDiv + "px";
	}

	if(img!=null) {
	    /*
	    if (reflet!=null && nombre_reflet>0)
	    {
	    reflet.src=liste_reflet[idx_reflet % nombre_reflet].src;
	    idx_reflet++;
	    }*/
	    obj = liste[idx % nombre];
	    $(img).html(obj.html);
	    // Nota: No display legend
	    idx++;
	    
	    window.clearInterval(timer);
	    timer=null;
	    var cmd = "liste_diapo['" + name + "'].change()";
	    window.setTimeout(cmd,temporisation);
	}
	
    } // fin effect 1: slide
    
    this.previous = function(){
	if (started == true) {
	    var imgs = $('#'+name+' > div').get();   
	    idx = idx + nombre - imgs.length - 1;
	
	    updatePos();
	}
    } // fin fonction previous
    
    this.next = function() {
	if (started == true) {
	    var imgs = $('#'+name+' > div').get();
	    idx = idx - imgs.length + 1;
	    
	    updatePos();
	}
    } // fin fonction next
    
    function updatePos() {
	var imgs = $('#'+name+' > div');
	
	var pos = -width;
	for (var i=0; i<imgs.length; i++, pos+=width) {
	    obj = liste[idx % nombre];
	    leg = legend[idx % nombre];
	    idx++;
	    var div = $(imgs)[i];
	    div.posDiv = pos;
	    div.style.left=div.posDiv + "px";
	    if ((width == 0 && i==1) || width != 0) {
		$(div).html(obj.html);
	    }
	    if (nameLegend != null && leg != null && i==1) {
		$('#'+nameLegend).html(leg);
	    }
	}   
    }
    
    this.createFrame = function(id,nameDiapo,path) {
	var obj = this;
	nameFrame = nameDiapo;
	
	var frame = $('#'+id);
	$(frame).append($('<div/>').attr({
		    id:nameDiapo,
			class:'cadre'
		    }));
	var diapo = $('#'+nameDiapo);
	
	$(diapo).append(($('<div/>').attr({
			id:name,
			    class:'diapo'
			    })).append($('<img/>').attr('src',path)));
	
	$(diapo).append(($('<div/>').attr('class','clegend')).append($('<span/>').attr('id',nameLegend)));
	$(diapo).append($('<div/>').attr('class','cbutton'));
	
	var button = $('#'+nameDiapo+" div.cbutton");
	$(button).append($('<img\>').attr('src','img/previous.png'));
	$(button).append($('<img\>').attr('src','img/next.png'));
	$(button).append($('<img\>').attr('src','img/close.png'));
	
	var imgButton = button.children();
	$($(imgButton)[0]).click(function(){
		obj.previous();
	    });
	$($(imgButton)[1]).click(function(){
		obj.next();
	    });
	$($(imgButton)[2]).click(function(){
		hideDiapo();
	    });
    } // fin fonction createFrame
	
    this.sizeFrame = function() {
	$('#'+name).css({
		height:height,
		width:width,
		margin:"10px"
	    });
	
	var hFrame = height + 80;
	var wFrame = width + 20;
	var maringLeftFrame = -(hFrame / 2);
	var maringTopFrame = -(wFrame / 2);
	var wFrame = width + 20;

	$('#'+nameFrame).css({
		height:hFrame,
		    left:"50%",
		    'margin-left':maringLeftFrame,
		    width:wFrame,
		    top:"50%",
		    'margin-top':maringTopFrame,
		    });
	
	var style = new Array();
	var padding_side = 10;
	var padding_top = height / 3;
	var widthtxt = width - (2 * padding_side);
	var heighttxt = padding_top;
	style.width = widthtxt + "px";
	style.height = heighttxt + "px";
	style.padding_top = padding_top + "px ";
	style.padding_side = padding_side + "px ";

	for (var obj in listeTxt) {
	    $(listeTxt[obj]).css({
		'background-color':'#f0f2c1',
		    'font-size':'24px',
		    'font-family':'neuropol,"Segoe UI Light", shruti, DejaVu, "BPG Unicode Standard", Verdana, sans-serif',
		    width:style.width,
		    height:style.height,
		    padding:style.padding_top+style.padding_side
		    });
	}
    }  // fin fonction sizeFrame
    
    this.style = function(bg_color,txt_color) {
	$('#'+nameFrame).css({
		'background-color':""+bg_color+"",
		    border:"0px solid "+bg_color,
		    position:"absolute",
		    'z-index':"10"
		    });
	$('#'+nameLegend).css({
		color:txt_color
		    });
	
	$('.clegend').css({
		margin:"10px",
		    height:"30px"
		    });

	$('.cbutton').css({
		'text-align':"right"
		    });
    }  // fin fonction style

}  // fin classe Diaporama

function getDiapo(name) {
    return liste_diapo[name];
}


function displayDiapo(name) {
    hideDiapo();

    $(name).css('display','inline');
}

function hideDiapo() {
    $('.cadre').css('display','none');
}