(function($){
	
	$.espanel=function(options){
		var texte = arguments[1];
		$("<span></span>").espanel(options, texte);
	}
	/**
	 * Ouvre une panel typé ES
	 * 
	 * @param {Object} options  les options de la fenetre
	 */
	$.fn.espanel = function(options){
		if (options == 'close_loading')
		{
			$.fn.espanel.close('loading');
			return;
		}
		var options = $.extend({
			id:"",
			appendTo:'body',
			width:200,
			className:'',
			overflow:'hidden',
			height:200,
			beforeClose:null,// function exécutée avant de fermer la popup parametre. : {options:options, className:'container-es-panel', el:'L'objet JQUERY panel'}
			close:null,// function exécutée aprés avoir fermé la popup parametre. : {options:options, className:'container-es-panel', el:'L'objet JQUERY panel'}
			type:'default',
			zIndex:999,
			className:"",
			from:'html',
			beforeLoad:null, // function exécutée avant de charger la popup parametre. : le tableau d'options
			load:null,// function exécutée aprés avoir chargé la popup. parametre : l'objet Jquery panel
			borderColor:'black',
			borderSize:4,
			iframe:true,
			backgroundColor:'transparent',
			/*
			 *   si c'est une fonction un bouton Ok est ajouté le  clic execute la fonction
			 *   si c'est un objet : {txt:'Le texte sur le bouton', fn:'La fonction du click', className:'la class du bouton'}
			 */
			bouton_ok:null,
			/*
			 *   si c'est une fonction un bouton Annuler est ajouté le  clic execute la fonction
			 *   si c'est un objet : {txt:'Le texte sur le bouton', fn:'La fonction du click', className:'la class du bouton'}
			 */
			bouton_cancel:null
		}, options);
		
		switch(options.type)
		{
			case 'normal':
				options.borderColor ='#FBA117';
				options.borderSize = 3;
				options.backgroundColor = 'white';
				break;
			case 'alert':
				options.borderColor ='#FF0000';
				options.borderSize = 3;
				options.backgroundColor = 'white';
				break;
			case 'blue':
			case 'bleu':
				options.borderColor ='transparent';
				options.borderSize = 0;
				options.backgroundColor = 'white';
				break;
			case 'loading':
				options.borderColor ='black';
				options.borderSize = 1;
				options.backgroundColor = 'white';
				options.width = 250;
				options.height = 50;
				options.from='loading';
				options.beforeClose=null;
				options.close=null;
				options.beforeLoad=null;
				options.load=null
				options.modal=true;
				break;
			default:
				break;
		}
		
		var wH = $(window).height(); // Window Height
		var wW = $(window).width(); // Window Width
		var x =  (wW-options.width)/2;
		var y =  (wH-options.height)/2;
		
		var a = $('<div id="'+options.id+'" class="container-es-panel">' + this.html() + '</div>');
		a.width(options.width);
		a.height(options.height);
		
		if($.browser.msie){
			a.css('position', 'absolute');
		}else{
			a.css('position', 'fixed');
		}
		a.css('top', y);
		a.css('left', x);
		a.css('z-index', options.zIndex);
		a.addClass(options.type);
		a.addClass(options.className);
		a.css('overflow', options.overflow);
		switch(options.from)
		{
			case 'texte':
				$('<div id="es-panel-close-1'+options.id+'">'+$.config('img_close_panel_16')+'</div>').appendTo(a);
				var epc = $('<div class="es-panel-container"></div>');
				$('<div class="es-panel-title"></div>').appendTo(epc);
				$('<div class="es-panel-content">'+arguments[1]+'</div>').appendTo(epc);
				$('<div class="es-panel-footer"></div>').appendTo(epc);
				epc.appendTo(a);
				$('<div id="es-panel-close-2'+options.id+'">'+$.config('img_close_panel_16')+'</div>').appendTo(a);
				break;
			case 'html2':
				$('<div id="es-panel-close-1'+options.id+'">'+$.config('img_close_panel_16')+'</div>').appendTo(a);
				var epc = $('<div class="es-panel-container"></div>');
				$('<div class="es-panel-title"></div>').appendTo(epc);
				var cont =$('<div class="es-panel-content"></div>'); 
				cont.appendTo(epc);
				$('<div class="es-panel-footer"></div>').appendTo(epc);
				epc.appendTo(a);
				cont.html(arguments[1]);
				$('<div id="es-panel-close-2'+options.id+'">'+$.config('img_close_panel_16')+'</div>').appendTo(a);
				break;
			case 'object':
				$('<div id="es-panel-close-1'+options.id+'">'+$.config('img_close_panel_16')+'</div>').appendTo(a);
				var epc = $('<div class="es-panel-container"></div>');
				$('<div class="es-panel-title">'+arguments[1].title+'</div>').appendTo(epc);
				$('<div class="es-panel-content">'+arguments[1].bdy+'</div>').appendTo(epc);
				$('<div class="es-panel-footer">'+arguments[1].footer+'</div>').appendTo(epc);
				epc.appendTo(a);
				$('<div id="es-panel-close-2'+options.id+'">'+$.config('img_close_panel_16')+'</div>').appendTo(a);
				break;
			case 'loading':
				var epc = $('<div class="es-panel-container"></div>');
				$('<div class="es-panel-content">'+$.config("image_loading")+'</div>').appendTo(epc);
				epc.appendTo(a);
				break;
			case 'html':
				a.html(this.html());
				break;
		}
		if(options.beforeLoad != null){
			if ($.isFunction(options.beforeLoad))
				options.beforeLoad(options);
		}
		if (options.modal){
			
			var modal = $("<div class='modal"+options.id+"'></div>");
			modal.width(wW);
			modal.height(wH);
			modal.css("position", "absolute");
			modal.css("top", 0);
			modal.css("left", 0);
			modal.css("overflow", 'hidden');
			modal.css("z-index", options.zIndex-1);
			modal.css("background-color", "black");
			modal.css("opacity", "0.1");			
			modal.appendTo('body');
		}
		//$("#produits-table-content").css('overflow', 'hidden');
		//$("body *").css('overflow', 'hidden');
		// gestion des boutons
		var btns = $('<div class="es-panel-boutons"></div>');
		var hasBtns = false;
		var value_ok = "Ok";
		var value_cancel = "Cancel";
		var cla = "";
		var fnOk = null;
		var fnCancel = null;
		if ($.isObject(options.bouton_ok)){
			hasBtns = true;
			if (options.bouton_ok.txt)
				value_ok = options.bouton_ok.txt;
			if (options.bouton_ok.className)
				cla = options.bouton_ok.className;
				
			if ($.isFunction(options.bouton_ok.fn))
				fnOk= options.bouton_ok.fn;
			else
				fnOk = options.bouton_ok;
				
			$('<input type="button" class="blanc" value="'+value_ok+'" id="es-panel-bouton-ok'+options.id+'" class="'+cla+'" />').appendTo(btns);
		}
		if ($.isObject(options.bouton_cancel)){
			hasBtns = true;
			if (options.bouton_cancel.txt)
				value_cancel = options.bouton_cancel.txt;
			
			if (options.bouton_cancel.className)
				cla = options.bouton_cancel.className;
				
			if ($.isFunction(options.bouton_cancel.fn))
				fnCancel = options.bouton_cancel.fn;
			else
				fnCancel = options.bouton_cancel;
			$('<input type="button" class="blanc annuler" value="'+value_cancel+'" id="es-panel-bouton-cancel'+options.id+'" class="'+cla+'" />').appendTo(btns);
		}
		
		if (options.iframe){
			var iframe = $("<iframe class='iframe-espanel'/>");
			iframe.css({
				left:x,
				position:'absolute',
				top:y, 
				width:options.width,
				border:'none',
				height:options.height,
				'z-index':options.zIndex-2
			});
			iframe.appendTo(options.appendTo);
		}
		
		a.appendTo(options.appendTo);
		if (hasBtns)
		{
			btns.appendTo('.es-panel-content');
			btns.css("display", "block");
			$('#es-panel-bouton-cancel'+options.id).bind('click',{options:options, el:a}, fnCancel);
			$('#es-panel-bouton-ok'+options.id).bind('click',{options:options, el:a}, fnOk);
		}
		if (options.from == 'loading') {
			$('.container-es-panel').css('border', options.borderSize + 'px ' + options.borderColor + " solid");
			$('.container-es-panel').css('background-color', options.backgroundColor);
			$('.container-es-panel .es-panel-content').css('position', 'relative');
			$('.container-es-panel .es-panel-content').css('top', 0);
			$('.container-es-panel .es-panel-content').css('left', 0);
			$('.container-es-panel .es-panel-content').height(options.height);
			$('.container-es-panel .es-panel-content').width(options.width);
			$('.container-es-panel .es-panel-content').css('overflow', 'hidden');
			$('.container-es-panel .es-panel-content').css('text-align', 'center');
			$('.container-es-panel .es-panel-content').css('padding-top', '10px');
		}
		else {
			// Stylage de la panel
			$('.container-es-panel').css('border', options.borderSize + 'px ' + options.borderColor + " solid");
			$('.container-es-panel').css('background-color', options.backgroundColor);
			
			$('.es-panel-title').css('position', 'relative');
			$('.es-panel-title').css('top', 0);
			$('.es-panel-title').css('left', 0);
			$('.es-panel-title').height(20);
			$('.es-panel-title').width(options.width);
			$('.es-panel-title').css("z-index", 1000);
			
			
			$('.container-es-panel .es-panel-content').css('position', 'relative');
			$('.container-es-panel .es-panel-content').css('top', 0);
			$('.container-es-panel .es-panel-content').css('left', 5);
			//$('.container-es-panel .es-panel-content').css('font-family', 'verdana');
			//$('.container-es-panel .es-panel-content').css('font-size', 'smaller');
			
			$('.container-es-panel .es-panel-content').height(options.height - 40);
			$('.container-es-panel .es-panel-content').width(options.width-10);
			
			$('.container-es-panel .es-panel-content').css('overflow', options.overflow);
			
			
			
			
			$('.es-panel-footer').css('position', 'absolute');
			$('.es-panel-footer').css('top', options.height - 20);
			$('.es-panel-footer').css('left', 0);
			$('.es-panel-footer').height(20);
			$('.es-panel-footer').width(options.width);
			$('.es-panel-footer').css("z-index", options.zIndex+1);
			
			
			$('#es-panel-close-1'+options.id).css("z-index", options.zIndex+2);
			$('#es-panel-close-1'+options.id).css("position", 'absolute');
			$('#es-panel-close-1'+options.id).css("top", 0);
			$('#es-panel-close-1'+options.id).css("left", options.width - 20);
			$('#es-panel-close-1'+options.id).css("cursor", 'pointer');
			$('#es-panel-close-1'+options.id).width(16);
			$('#es-panel-close-1'+options.id).height(16);
			$('#es-panel-close-1'+options.id).bind('click', {
				options: options,
				className: 'container-es-panel',
				el: a
			}, $.fn.espanel.close);
			
			$('#es-panel-close-2'+options.id).css("z-index", options.zIndex+2);
			$('#es-panel-close-2'+options.id).css("position", 'absolute');
			$('#es-panel-close-2'+options.id).css("top", options.height - 25);
			$('#es-panel-close-2'+options.id).css("left", options.width - 20);
			$('#es-panel-close-2'+options.id).css("cursor", 'pointer');
			$('#es-panel-close-2'+options.id).width(16);
			$('#es-panel-close-2'+options.id).height(16);
			$('#es-panel-close-2'+options.id).bind('click', {
				options: options,
				className: 'container-es-panel',
				el: a
			}, $.fn.espanel.close);
			
			if ($.browser.msie)
			{
				$('#es-panel-close-1'+options.id).css("top", 6);
				$('#es-panel-close-2'+options.id).css("top", options.height - 19);
			}
			
			
			if (options.load != null) {
				if ($.isFunction(options.load)) 
					$(a).ready(function(){
						options.load(a);
					});
			}
		}
	};
	$.fn.espanel.close=function(e){
		if (e == 'loading'){
			 $(".loading").hide();
			 $(".loading").remove();
		}else{
			if (e.data.options.beforeClose != null){
				if ($.isFunction(e.data.options.beforeClose))
					e.data.options.beforeClose(e.data);
			}
			$('.iframe-espanel').hide();
			$('.iframe-espanel').remove();
			
			e.data.el.hide();
			e.data.el.remove();
			if (e.data.options.modal){
				$(".modal").hide();
				$(".modal").remove();
			}
			if (e.data.options.close != null) {
				if ($.isFunction(e.data.options.close))
					e.data.options.close(e.data, e);
			}
		}
	};
	
})(jQuery);
