/*
 * This file is part of the prestaUtilsPlugin package.
 * (c) Christophe DOLIVET <cdolivet@prestaconcept.net>
 * (c) Mikael RANDY <mrandy@prestaconcept.net>
 *
 * For the full copyright and license information, please view the LICENSE
 * file that was distributed with this source code.
 */

/*****
 * Calendrier javascript s'ouvrant en popin. 
 * Dans la page utiliser: calendar.set_param(...) pour regler eventuellement certains parametres, puis calendar.show_cal(...)
 *
 *****/

function Calendar()
{

	this.month_names= ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre"];
	this.day_names= ["Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi", "Dimanche"];
	this.link_names= {"close":"[Fermer]", "clear": "[Effacer]"};

	this.container= null;
	this.show= false;
	this.dest= null;
	
	this.week_begin_day= 0;	// 0 la semaine commence le lundi, 6 => le dimanche
	
	this.default_format= "dd/mm/yyyy";
	
	this.stylesheet= null;
	
	this.basic_style= {
		"border_color" : "#cacaca"
		,"header_bg_color" : "#525051"
		,"footer_bg_color": "#525051"
		,"day_bg_color": "#FFF"
		,"empty_day_bg_color": "#e8e8e8"
		,"selected_day_bg_color": "#1c5180"
		,"header_font_color" : "#FFF"
		,"footer_font_color": "#FFF"
		,"day_font_color": "#525051"
		,"selected_day_font_color": "#FFF"
		,"font": "11px arial"
		};
	
	this.prev_style= "";
	this.advanced_style= null;
}


Calendar.prototype =
{
	/**
	 *	fonction a appeler ds la page pour redefnir certains paramètres
	 *	params: un tableau contenant divers paremetres à redefinir 
	 *		-params["months"]: traduction des mois
	 *		-params["days"]: traduction des jours
	 *		-params["links"]: traduction des liens
	 *		-params["format"]: format d'affichage des dates à utiliser par défaut
	 *		-params["basic_style"]: tableau permettant de redéfinir simplement les principales couleurs utilisées
	 *		-params["advanced_style"]: si different de null, sa valeur sera utilisée comme feuille de style à appliquer lors de l'affichage du tableau (les valeurs de "basic_style" ne seront pas utilisées)	   
	 **/	  	  
	set_param: function(params)
	{
		if(typeof(params)=="object")
		{
			if(params["months"])
				this.month_names= params["months"];
			if(params["days"])
				this.day_names= params["days"];
			if(params["links"])
				this.link_names= params["links"];
		
			if(params["format"])
				this.default_format= params["format"];
			
			if(params["basic_style"])
			{
				this.basic_style= params["basic_style"];
				this.prev_style= "";
			}
			if(params["advanced_style"])
			{
				this.advanced_style= params["advanced_style"];
				this.prev_style="";
			}
		}
	}

	/**
	 * fonction a appeler pour générer puis afficher le calendrier (cache le calendrier si il est déjà affiché)
	 * id_dest: l'id du champ input qui doit recevoir la date
	 * [format]: une chaine détaillant le format de la date à afficher (ex: dd/mm/dd) (facultatif)
	 * [id_position]: l'id de l'element qui sert de repère de position pour l'affichage du calendrier. si il n'est pas défini, le champ input destinataire va servir de repere (facultatif)
	 **/	 
	,show_cal: function(id_dest, format, id_position){
		if(this.show)
		{
			// si le calendrier est déjà affiché, on le cache
			this.hide_cal();
			// on s'arrete là si le calendrier est affiché pour le mm element
			if(this.dest==document.getElementById(id_dest))
				return;
		}
		
		this.dest= document.getElementById(id_dest);
		if(typeof(format)=="string" && format.length>0)
			this.format= format;
		else
			this.format= this.default_format;
		
		date= new Date();
	
		
		//-------------------- get the date from the input field -----------
		var prev_date= this.dest.value;
		if(prev_date.length>0 && this.match_format(prev_date))
		{
			year= date.getFullYear();
			month= date.getMonth();
			day= date.getDate();
			
			// search_year
			if((y_index = this.format.search(/yyyy/i))!=-1)
				year= prev_date.substring(y_index,y_index+4)-0;
			else if((y_index = this.format.search(/yy/i))!=-1)
			{
				year= prev_date.substring(y_index,y_index+2)-0;
				if(year<70)
					year+= 2000;
				else
					year+= 1900;
			}
			
			//search month
			if((m_index = this.format.search(/mm/i))!=-1)
				month= prev_date.substring(m_index,m_index+2)-1;
			if((m_index = this.format.search(/mon/i))!=-1)
			{
				alert(m_index);
				month_name= prev_date.substring(m_index,m_index+3).toLowerCase();
				for(i=0; i<this.month_names.length; i++)
				{
					if(this.month_names[i].substring(0, 3).toLowerCase()==month_name)
					{
						month= i;
					}
				}		
			}
			
			// search day
			if((d_index = this.format.search(/dd/i))!=-1)
				day= prev_date.substring(d_index,d_index+2)-0;
			
			date= new Date(year, month, day)
		}
		
		this.year= date.getFullYear();
		this.month= date.getMonth();
		this.day= date.getDate();
		
		this.base_date= date;
			
		//----------------- affiche le calendrier ------------------------
		
			
		// ajout du style
		
		var style= this.get_style();
		this.set_style(style);
		
		this.container= document.createElement("div");
		this.container.id= "calendar";
			
		if(id_position && document.getElementById(id_position))
		{
			pos_for= document.getElementById(id_position);
		}else{
			pos_for= document.getElementById(id_dest);
		}
				
		var Y= this.calc_offset(pos_for, "Top")+ pos_for.offsetHeight;
		var X= this.calc_offset(pos_for, "Left");
		
		this.container.style.top= Y + "px";
		this.container.style.left= X + "px";
		
		// traitement particulier pour la popin
		while( pos_for && pos_for.tagName !='BODY' )
		{
			// get computed position
			posForPosition	= '';
			try
			{
				posForPosition	= document.defaultView.getComputedStyle(pos_for, null)['position'];
			}
			catch(e)
			{
				try
				{
					posForPosition	= pos_for.currentStyle.position;
				}
				catch(e)
				{
					
				}
			}
			
			// if the parent have a position fixed, then the calendar will be fixed too
			if( pos_for.className.indexOf('popin_contenu') != -1 && posForPosition == 'fixed')
			{ 
				this.container.style.position = 'fixed';
				this.container.style.zIndex = 1000000;
				break;
			}
			pos_for = pos_for.parentNode;
		}
		
		
		 
		this.set_content();
		document.body.appendChild(this.container);
		this.show= true;
		
	
	}

	/**
	 * detruit le calendrier
	 **/	 	
	,hide_cal: function(){
		document.body.removeChild(this.container);
		this.show= false;
	}
	
	
	,pick_date: function(day) {
		this.hide_cal();
		
		var date= this.format;
		date = date.replace(/yyyy/i, this.year);
		date = date.replace(/yy/i, this.get2Digits(this.year%100));
		date = date.replace(/mm/i, this.get2Digits(this.month+1));
		date = date.replace(/MON/, this.month_names[this.month].substring(0,3).toUpperCase());
		date = date.replace(/Mon/i, this.month_names[this.month].substring(0,3));
		date = date.replace(/dd/i, this.get2Digits(day));
		date = date.replace(/DAY/, this.getDayName(this.year,this.month,day).toUpperCase());
		date = date.replace(/day/i, this.getDayName(this.year,this.month,day));
		
		this.dest.value= date;
	}
	
	
	,get2Digits: function(n) {
		return ((n<10)?"0":"")+n;
	}
	
	,getDayName: function(y,m,d) {
		var date=new Date(y,m,d);
		return this.day_names[(date.getDay()+6)%7].substring(0,3);
	}
	
	/**
	 * change le mois d'affichage du calendrier
	 */	 	
	,move_month: function(change){
		this.month+= change;
		if(this.month<0)
		{
			this.month=11;
			this.year--;
		}
		else if(this.month>11)
		{
			this.month=0;
			this.year++;
		}
		this.set_content();
	}
	
	/**
	 * change l'année d'affichage du calendrier
	 */	
	,move_year: function(change){
		this.year+= change;
		this.set_content();
	}
	
	/**
	 * génère le contenu du calendrier
	 */	 	
	,set_content: function(){
		var res='<table cellspacing="1" cellpadding="0" class="container">';
		
		//------------- ajout du header ----------------
		
		res+='<thead><tr><td colspan="7" class="navigation">';
			res+='<table cellpadding="0" cellspacing="0" class="navigation"><thead><tr>';
				res+='<td class="arrow"><a href="javascript:calendar.move_year(-1)">&#171;</a></td>';
				res+='<td class="arrow"><a href="javascript:calendar.move_month(-1)">&#139;</a></td>';
				res+='<td class="date">'+ this.month_names[this.month]+' '+ this.year +'</td>';
				res+='<td class="arrow"><a href="javascript:calendar.move_month(1)">&#155;</a></td>';
				res+='<td class="arrow"><a href="javascript:calendar.move_year(1)">&#187;</a></td>';
			res+='</tr></thead></table>';
		res+='</td></tr><tr class="day_of_week">';
		for(var i=this.week_begin_day; i<this.week_begin_day+7; i++) {
			res+='<td width="20">'+ this.day_names[(i%7)].substring(0, 1).toUpperCase()+ '</td>';
		}
		res+='</tr></thead>';
		
		
		//------------- ajout des cases des jours du mois ---------------
		res+='<tbody class="days">';
		date= new Date(this.year, this.month, 1);
		var first_day= (date.getDay()+6-this.week_begin_day)%7;
		var last_day= 31;
		for (var i=28; i<32; i++) {
			var date=new Date(this.year, this.month, i);
			if (this.month == date.getMonth()) {
			  	last_day= i;
			}
		}
		count_day= 0;
		for(var i=0; i<6; i++) {
			res+='<tr>';
			for (var j=0; j<7; j++) {
				if ((i*7+j)<first_day || count_day>=last_day) {
					res+='<td class="empty_day">&nbsp;</td>';
				}
				else {
					count_day++;
					var date= new Date(this.year, this.month, count_day);
					if (date.toString()==this.base_date.toString())
						class_name="selected_day";
					else
						class_name="day";
					res+='<td class="'+ class_name +'"><a href="javascript:calendar.pick_date('+ count_day +')">'+ count_day +'</a></td>';
				}
			}
			res+="</tr>\n";
		}
		res+='</tbody>'+"\n";
		
		
		//------------- ajout du footer ---------------
		res+='<tfoot><tr><td colspan="7"><a href="javascript:calendar.hide_cal()">'+ this.link_names["close"] +'</a>&nbsp;&nbsp;<a href="javascript:calendar.dest.value=\'\';calendar.hide_cal();">'+ this.link_names["clear"] +'</a></td></tr></tfoot>';
  		res+="\n</table>";
		this.container.innerHTML= res;
		
	}
	
	,match_format: function(string) {
		var calF = this.format;
		
		calF = calF.replace(/\\/g, '\\\\');
		calF = calF.replace(/\//g, '\\\/');
		calF = calF.replace(/\[/g, '\\\[');
		calF = calF.replace(/\]/g, '\\\]');
		calF = calF.replace(/\(/g, '\\\(');
		calF = calF.replace(/\)/g, '\\\)');
		calF = calF.replace(/\{/g, '\\\{');
		calF = calF.replace(/\}/g, '\\\}');
		calF = calF.replace(/\</g, '\\\<');
		calF = calF.replace(/\>/g, '\\\>');
		calF = calF.replace(/\|/g, '\\\|');
		calF = calF.replace(/\*/g, '\\\*');
		calF = calF.replace(/\?/g, '\\\?');
		calF = calF.replace(/\+/g, '\\\+');
		calF = calF.replace(/\^/g, '\\\^');
		calF = calF.replace(/\$/g, '\\\$');
		
		calF = calF.replace(/dd/i, '\\d\\d');
		calF = calF.replace(/mm/i, '\\d\\d');
		calF = calF.replace(/yyyy/i, '\\d\\d\\d\\d');
		calF = calF.replace(/yy/i, '\\d\\d');
		calF = calF.replace(/day/i, '\\w\\w\\w');
		calF = calF.replace(/mon/i, '\\w\\w\\w');
		
		var reg= new RegExp("^"+ calF +"$");
		
		return reg.test(string);
	}
	
	,calc_offset : function (element, attr){
		var offset=0;
		while(element){
			offset+= element["offset"+ attr] || 0;
			element=element.offsetParent;
		}
		
		return offset;
	}
	
	
	/***
	 * cette methode ajoute du style à la page
	 * style: la chaine correspondant au css à charger dans la page	 
	 **/	 	
	,set_style: function(style){
		if(style.length>0 && this.prev_style!=style){
			if(this.stylesheet==null)
			{
				newcss = document.createElement("style");
				newcss.type="text/css";
				newcss.media="all";
				var head= document.getElementsByTagName("head")[0];
				this.stylesheet= head.insertBefore(newcss, head.firstChild);
			}
			var cssrules = style.split("}");
			
			//--------- on remplace les regles de style ---------
			// met à jour le style
			if( this.stylesheet.styleSheet ) // IE
			{
				this.stylesheet.styleSheet.cssText = style;
			}
			else
			{ // W3C
				// supprime l'ancien style
				while( this.stylesheet.firstChild ) {
					this.stylesheet.removeChild( this.stylesheet.firstChild );
				}
				this.stylesheet.appendChild( document.createTextNode( style ) );
			}
			
			this.prev_style= style;
		}
	}
	
	,get_style: function(){
		var style="";
		if(this.advanced_style!=null)
			style= this.advanced_style;
		else{
			style+="#calendar { position: absolute; z-index: 1100000; }\n";
			style+="#calendar a{  text-decoration: none; }\n";
			style+="#calendar table{ font: "+ this.basic_style["font"]+ "; white-space: nowrap;}\n";
			style+="#calendar table.container{ background-color: "+ this.basic_style["border_color"] +";}\n";
			style+="#calendar td{ vertical-align: middle; text-align: center; height: 20px;}\n";
			style+="#calendar .container thead { background-color: "+ this.basic_style["header_bg_color"] +"; color: "+ this.basic_style["header_font_color"] +"; font-weight: bold;}\n";
			style+="#calendar .container thead table.navigation{ width: 100%; font-weight: bold;}\n";
			style+="#calendar .container tbody td.arrow{ width: 17px;}\n";
			style+="#calendar .container thead a{ color: "+ this.basic_style["header_font_color"] +"; font-weight: bold; padding: 0 2px;}\n";
			style+="#calendar .container tfoot { background-color: "+ this.basic_style["footer_bg_color"] +"; color: "+ this.basic_style["footer_font_color"] +" }\n";
			style+="#calendar .container tfoot a{ color: "+ this.basic_style["footer_font_color"] +"; font-weight: bold;}\n";
			style+="#calendar .container tbody a{color: "+ this.basic_style["day_font_color"] +"; }\n";
			style+="#calendar .container tbody td.day{ background-color: "+ this.basic_style["day_bg_color"] +"; width: 22px;  }\n";
			style+="#calendar .container tbody td.empty_day{ background-color: "+ this.basic_style["empty_day_bg_color"] +"; }\n";
			style+="#calendar .container tbody td.selected_day{ background-color: "+ this.basic_style["selected_day_bg_color"] +"; color: "+ this.basic_style["selected_day_font_color"] +"; }\n";
			style+="#calendar .container tbody td.selected_day a{ color: "+ this.basic_style["selected_day_font_color"] +" }\n";
		}
		
		return style;
	}
}


var calendar= new Calendar();