function Fiche(contenu, largeur, mode){
	
	//on supprime les divs en trop (limite fixée à window.nombre_fiches_max)
	window.nombre_fiches ++;
	//on enlève le draggable sur le conteneur pour le redéfinir plus bas
	$("#conteneur").DraggableDestroy();
	if (window.nombre_fiches > window.nombre_fiches_max){
		this.num_div_suppr = window.nombre_fiches-window.nombre_fiches_max;
		this.div_a_supprimer = "#div"+this.num_div_suppr;
		$(this.div_a_supprimer).remove();
	}
	
	
	
	this.contenu = contenu;
	this.classe = "fiche "+mode;

	//on cree
	window.div_en_plus = window.div_en_cours + window.divs;
	window.div_en_cours =  window.div_en_cours +(window.divs-1);
	nom_div_affiche = "div"+window.divs;
	
	this.div = window.div_en_plus;
	//alert("div_en_plus :"+div_en_plus+" -  div_en_cours : "+div_en_cours);
	//var height = Math.random()*200 + 280;
	

	var width = largeur;
	var largeur_scroll = 15;
	var width_conteneur = width - largeur_scroll - 5;
	if ($(window.div_en_plus).height() > $(window).height()- largeur_scroll){
		width += largeur_scroll;
		width += 5;
	}
	
	var html_fiche = "<div style='width:"+width+"px;' id='"+window.nom_div_affiche+"' class='"+this.classe+"'>";
	html_fiche += "<div class='header'></div><!-- header -->";
	html_fiche += "<div class='conteneur_fiche' style='width:"+width_conteneur+"px;'>";
	html_fiche += "<div class='contenu_fiche'></div>";
	html_fiche += "</div><!-- conteneur_fiche-->";
	
	html_fiche += "</div><!-- fiche -->";
	
	$(window.div_en_cours).after(html_fiche);
	$(window.div_en_plus).css("left", $("#conteneur").width());
	
	var contenu_pouet2 = unescape(contenu);
	$(this.div+" > .conteneur_fiche > .contenu_fiche").html(contenu);
	
	window.largeur_totale = $("#conteneur").width() + $(window.div_en_plus).width();

	$("#conteneur").height($(window).height() - 20);
	
	
	$(this.div+" > .scrollbar > .indicateur").css("opacity", 1);
	$(this.div+" > .header").css("opacity", 0.5);
	$(this.div+" > .scrollbar").css("opacity", 0.4);

	//si on dépasse la hauteur de la fenêtre -20px
	
	if ($(window.div_en_plus).height() > $(window).height()-20 && mode!="image" && mode!="video"){
		
		//on fixe la taille du conteneur_fiche qui a un overflow:hidden pour son contenu 
		$(this.div+" > .conteneur_fiche").height($(window).height()-40+"px");
		$(this.div).height($(window).height()-20);
		var scroll_height = ($(window.div_en_plus).height()-30);
		
		//on n'affiche le système de scroll que pour les fiches plus hautes que la fenêtre actuelle
		var html_scroll = "<div class='scrollbar' style=\"height:"+scroll_height+"px; margin-top:10px; width:"+largeur_scroll+"px; background-image:url('img/barre_scroll.gif'); float:left;\">";
			html_scroll += "<div class='indicateur' style='width:"+largeur_scroll+"px;'></div></div>";
		
		$(window.div_en_plus+" > .conteneur_fiche").after(html_scroll);
		
		//on active le scroll
		$(this.div+" > .scrollbar").Slider(
			{
				accept : '.indicateur',
				onSlide : function( cordx, cordy)
				{
					//document.getElementById('cordy3').value = cordy + '%';
					//on calcule la différence de hauteur entre le contenu et le conteneur
					//ici le $(this) correspond à l'indicateur
					//la fiche est donc 
					var fiche = $(this).parent().parent();
					var conteneur_fiche = $(".conteneur_fiche", fiche);
					var contenu_fiche = $(".contenu_fiche", conteneur_fiche);
					
					//console.log($(".conteneur_fiche", $(this).parent().parent()).height());
					
					var dif_height = contenu_fiche.height() - conteneur_fiche.height() +20;
					
					//on déplace le contenu de cordy % de dif_height contre le haut
				
					var delta_height = Math.round((cordy-4)/100 * dif_height);
					if(delta_height >= 0){
						contenu_fiche.css("top", - delta_height);
					}
				}
			}
		);
	}//si hauteur 
	
	$("#conteneur").css("width", window.largeur_totale + 10);
	window.divs++;
	window.div_en_cours = "#div";
	window.div_en_plus = "#div";
	
	//on met à jour la coordonnée du conteneur
	init_position();
	//on définit le hover pour toutes les fiches
//	$(".fiche").hover(function(){}, function(){devant("#menu")})
//	$(".fiche").click(function(){devant("#conteneur")})
	$("#conteneur").Draggable({
		handle:'.header',
		axis:'horizontally'
	})
	
	
}

Fiche.prototype.active_scroll = function(){
		
}

Fiche.prototype.donne_nom = function(){
	//alert("voici le nom : "+this.nom)
}