/** @class
  * Boite d'information, avec un en-tete
  * @constructor
  * @param idBox id HTML de la boite
  * @param collapsed (optionnel) booleen indiquant si la boite est fermée (defaut : false)
  */
function Documents (idBox, collapsed, empty)
{
	/** L'element HTML racine de la boite d'information @type HTMLTable */
	this.box = document.getElementById(idBox);
	this.checkStructure(idBox);
	/** L'en-tete @type HTMLDiv */
	this.header = Element.getChildElements(this.box, "div")[0];
	/** Le corps @type HTMLDiv */
	this.body = Element.getChildElements(this.box, "div")[1];
	/** Zone conteant l'icone sur laquelle cliquer @type HTMLSpan */
	this.icon = document.createElement("span");
	if(empty)
	{
		/** Icone de vide pour les dossiers ne contenant rien */
		this.emptyImg = document.createElement("img");
	}
	else
	{
		/** Icone montrant que le contenu est visible @type HTMLImage */
		this.openImg = document.createElement("img");
		/** Icone montrant que le contenu est masqué @type HTMLImage */
		this.closedImg = document.createElement("img");
	}
	/** Icone montrant que le contenu est visible @type HTMLImage */
	this.folderOpenImg = document.createElement("img");
	/** Icone montrant que le contenu est masqué @type HTMLImage */
	this.folderClosedImg = document.createElement("img");
	// Initialiser la structure HTML
	this.setStructure(empty);
	// Mettre les styles
	this.setStyle();
	if(!empty)
	{
		// Faire réagir aux clics
		this.setOnClick();
		// Au départ, réduire a l'en-tete ou afficher le contenu
		if (collapsed)
		{
			this.collapse(false);
		}
		else
		{
			this.expand();
		}
	}
	else
	{
		this.collapse(empty);
	}
}

Documents.prototype = {
	/** Icone par défaut indiquant que le contenu est visible @type String */
	openImgUrl: "./img/vign/stats_visible.gif",
	/** Icone par défaut indiquant que le contenu est masqué @type String */
	closedImgUrl: "./img/vign/stats_hidden.gif",
	/** Couleur de fond du span englobant les icones @type String */
	iconBackground: "transparent",
	/** Icone par défaut montrant que c'est un dossier fermé */
	folderClosedImgUrl: "./img/vign/folder.png",
	/** Icone par défaut montrant que c'est un dossier ouvert */
	folderOpenImgUrl: "./img/vign/folder_image.png",
	/** Icone par défaut représentant un vide */
	emptyImgUrl: "./img/vign/empty.gif",
	

	/** Initialiser la structure HTML */
	setStructure: function (empty)
	{
		// Réorganiser l'en-tete : ajouter les images devant
		var content = this.header.innerHTML;
		this.header.innerHTML = "";
		this.header.appendChild(this.icon);
		
		if(empty)
		{
			this.icon.appendChild(this.emptyImg);
			this.emptyImg.src = this.emptyImgUrl;	
		}
		else
		{
			this.icon.appendChild(this.openImg);
			this.openImg.src = this.openImgUrl;
		
			this.icon.appendChild(this.closedImg);
			this.closedImg.src = this.closedImgUrl;
		
			this.icon.appendChild(this.folderOpenImg);
			this.folderOpenImg.src = this.folderOpenImgUrl;
		}
		this.icon.appendChild(this.folderClosedImg);
		this.folderClosedImg.src = this.folderClosedImgUrl;
		
		this.header.appendChild(document.createElement("span"));
		this.header.lastChild.innerHTML = content;
	},

	/** Initialiser l'apparence */
	setStyle: function ()
	{
		// Les classes
		if (this.box.className == "")
		{
			this.box.className = "docs";
		}
		if (this.header.className == "")
		{
			this.header.className = "docs";
		}
		if (this.body.className == "")
		{
			this.body.className = "docs";
		}
		this.body.style.paddingLeft = "15px";
		this.header.style.paddingLeft = "0px";
		this.header.style.fontWeight = "bold";
		// Les icones
		this.header.lastChild.style.cursor = "pointer";
		this.icon.style.background = this.iconBackground;
		this.icon.style.cursor = "pointer";
		this.icon.style.margin = "0em 1ex 0em 0em";
		this.icon.style.verticalAlign = "middle";
	},

	/** Définir la réaction au clic sur l'icone */
	setOnClick: function ()
	{
		var current = this;
		this.header.onclick = function ()
		{
			if (current.openImg.style.display == "none")
			{
				current.expand();
			}
			else
			{
				current.collapse(false);
			}
		}
	},

	/** Montrer le corps (les infos) */
	expand: function ()
	{
		this.openImg.style.display = "";
		this.folderOpenImg.style.display = "";
		this.closedImg.style.display = "none";
		this.folderClosedImg.style.display = "none";
		this.body.style.display = "";
	},

	/** Cacher le corps */
	collapse: function (empty)
	{
		if(!empty)
		{
			this.openImg.style.display = "none";
			this.folderOpenImg.style.display = "none";
			this.closedImg.style.display = "";
			this.folderClosedImg.style.display = "";
		}
		this.body.style.display = "none";
	},

	/** Vérifier que la boite a uniquement 2 enfants div */
	checkStructure: function (idBox)
	{
		if (this.box == null || this.box.nodeName != "DIV")
		{
			Log.error("Element <div id='"+ idBox +"'> non trouvé dans le document");
		}
		else
		{
			Element.cleanWhiteSpace(this.box);
			var divs = Element.getChildElements(this.box, "div");
			var children = this.box.childNodes;
			var msg = new Array();
			if (divs.length != 2)
			{
				msg.push("doit contenir 2 div interne ("+divs.length+" trouvé)");
			}
			if ((children.length - divs.length) > 0)
			{
				msg.push("doit contenir seulement 2 div ("+ (children.length - divs.length) +" autres éléments trouvés)");
			}
			if (msg.length > 0)
			{
				Log.error("Element " + idBox + "\n" + msg.join("\n"));
			}
		}
	}
}

Documents.prototype.constructor = Documents;