Menu

Cette class me permet de créer un simple menu.

Source

/**
 * Menu
 * @author			neolao <neo@neolao.com>
 * @version			0.1 (18/01/2006)
 * @license			http://creativecommons.org/licenses/by-sa/2.5/
 */
function Menu(){
	this.__construct.apply(this, arguments);
}
Menu.prototype = {
	// ----------------------------- CONSTANTES --------------------------------
 
	// ----------------------------- VARIABLES ---------------------------------
	/**
	 * La cible du menu
	 * @var HTMLElement
	 */
	_target : 0,
	/**
	 * La référence du node html du menu
	 * @var HTMLElement
	 */
	_menu : 0,
	/**
	 * La référence du node html de la liste
	 * @var HTMLElement
	 */
	_list : 0,
	/**
	 * Indique si le menu est affiché ou pas
	 * @var bool
	 */
	_visible : true,
 
	// ----------------------------- EVENEMENTS --------------------------------
 
	/*============================= CONSTRUCTEUR =============================*/
	/*========================================================================*/
	/**
	 * Initialisation
	 * @param string pTarget L'id de la cible du menu
	 * @param string pClassName (optional) Le style CSS
	 */
	__construct : function(pTarget, pClassName){
		this._target = document.getElementById(pTarget);
 
		// Création du menu
		this._createMenu();
		this._menu.className = (pClassName)?pClassName:"menu";
	},
	/*======================= FIN = CONSTRUCTEUR = FIN =======================*/
	/*========================================================================*/
 
	/*=========================== METHODES PRIVEES ===========================*/
	/*========================================================================*/
	/**
	 * Délégation de fonction
	 * @param object pTarget La cible de la fonction
	 * @param function pFunction La fonction
	 * @return function La fonction qui fait la délégation
	 */
	_delegate : function(pTarget, pFunction){
		var f = function(){
			arguments.callee.func.apply(arguments.callee.target, arguments);
		};
		f.target = pTarget;
		f.func = pFunction;
		return f;
	},
	/**
	 * Création du menu
	 */
	_createMenu : function(){
		// Menu
		this._menu = document.createElement("div");
		this._target.appendChild(this._menu);
 
		// Bouton fermer
		var close = document.createElement("div");
		close.className = "close";
		close.addEventListener("mousedown", this._delegate(this, this.hide), false);
		this._menu.appendChild(close);
 
		// Liste
		this._list = document.createElement("ul");
		this._menu.appendChild(this._list);
	},
	/*===================== FIN = METHODES PRIVEES = FIN =====================*/
	/*========================================================================*/
 
	/*============================ GETTER  SETTER ============================*/
	/*========================================================================*/
	/**
	 * Récupère le node html du menu
	 * @return node La fenètre
	 */
	getNode : function(){
		return this._window;
	},
	/*====================== FIN = GETTER  SETTER = FIN ======================*/
	/*========================================================================*/
 
	/*========================== METHODES PUBLIQUES ==========================*/
	/*========================================================================*/
	/**
	 * Ajoute au menu
	 * @param Object pItem Un élément de menu du type {title:"titre", url:"adresse"}
	 */
	add : function(pItem){
		var item = document.createElement("li");
		item.innerHTML = "<a href=\""+pItem.url+"\">"+pItem.title+"</a>";
		this._list.appendChild(item);
	},
	/**
	 * Affiche le menu
	 */
	show : function(){
		this._menu.style.display = "block";
		this._visible = true;
	},
	/**
	 * Cache le menu
	 */
	hide : function(){
		this._menu.style.display = "none";
		this._visible = false;
	}
	/*==================== FIN = METHODES PUBLIQUES = FIN ====================*/
	/*========================================================================*/
};