var text_bool	= true; //check if other text dom functions open or it
var date_bool 	= true; //check if other date dom functions open or it
var select_bool = true; //check if other select dom functions open or it
var textarea_bool = true;//check if other textarea dom functions open or it

/**
* check the value type, get the layer id and value then call the needed function
**/
function update(type,id,value,lang)
{
		if(type=='date')
		{
			(date_bool == true) ? updateDate(id,value) : alert('check other date update fields bofore open new one');
		}
		else if(type=='text')
		{
			(text_bool == true) ? updateField(id,value) : alert('check other name update fields bofore open new one');
		}
				else if(type=='select')
		{
			(select_bool == true) ? updateSelect(id,value,lang) : alert('check other genders update fields bofore open new one');
		}
				else if(type=='textarea')
		{
			(textarea_bool == true) ? updateTextArea(id,value,lang) : alert('check other group details fields bofore open new one');
		}

}

/** 
 * on this function I send the id and date value
 * create 3 fields : day, month and year
 * save new date or cancel it
**/
function updateDate(id,value)
{
	day 	= value.substring(8,10); // get the day value from the date
	month 	= value.substring(5,7);	// get the month value from the date
	year 	= value.substring(0,4); // get the year value from the date
	text	= document.createTextNode(' - ');
	text2	= document.createTextNode(' - ');
	layer	= document.getElementById(id);
	
	dayfield = document.createElement('input');
		dayfield.setAttribute("type","text");
		dayfield.setAttribute("id","day");
		dayfield.setAttribute("size",2);
		dayfield.setAttribute("maxLength",2);
		dayfield.setAttribute((document.all ? 'className' : 'class'), 'field');
		dayfield.setAttribute("value",day);
		dayfield.onfocus = function() { this.className='focus'; };
		dayfield.onblur	 = function() { this.className='field'; };
		
	
	monthfield = document.createElement('input');
		monthfield.setAttribute('type','text');
		monthfield.setAttribute('id','month');
		monthfield.setAttribute("maxLength",2);	
		monthfield.setAttribute((document.all ? 'className' : 'class'), 'field');
		monthfield.setAttribute('size',2);
		monthfield.setAttribute('value',month);
		monthfield.onfocus	= function() { this.className='focus'; };	
		monthfield.onblur	= function() { this.className='field'; };	

	
	yearfield = document.createElement('input');
		yearfield.setAttribute('type','text');
		yearfield.setAttribute('id','year');
		yearfield.setAttribute((document.all ? 'className' : 'class'), 'field');
		yearfield.setAttribute('size',4);
		yearfield.setAttribute("maxLength",4);	
		yearfield.setAttribute('value',year);
		yearfield.onfocus	= function() { this.className='focus'; };
		yearfield.onblur	= function() { this.className='field'; };	
		
	imgObj	= document.createElement('img');
		imgObj.setAttribute('src','../images/save.png');
		imgObj.setAttribute('align','middle');
		imgObj.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj.setAttribute('alt','save');
		imgObj.setAttribute('vspace',1);
		imgObj.setAttribute('hspace',7);
		imgObj.onclick = function() { checkDate(id,document.getElementById('month').value,document.getElementById('day').value,document.getElementById('year').value); };
	
	imgObj2	= document.createElement('img');
		imgObj2.setAttribute('src','../images/cancel.png');
		imgObj2.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj2.setAttribute('align','middle');
		imgObj2.setAttribute('alt','cancel');
		imgObj2.setAttribute('vspace',1);
		imgObj2.setAttribute('hspace',7);
		imgObj2.onclick = function() { cancel(id,value); };
		
	document.getElementById(id).innerHTML = '';
	layer.appendChild(dayfield);
	layer.appendChild(text);
	layer.appendChild(monthfield);
	layer.appendChild(text2);
	layer.appendChild(yearfield);
	layer.appendChild(imgObj);
	layer.appendChild(imgObj2);
	
	date_bool = false;
}

/**
 * get the day, month and year
 * check the date if is true or not before call ajax update page
**/

function checkDate(id,month,day,year)
{
	var d = new Date();
	var curr_year = d.getFullYear();
	curr_year++;
	
	if(!IsNumeric(day) || day > 32 || day == '')
	{
		alert('write the day correctly');
		document.getElementById('day').focus();
	}
	else if(!IsNumeric(month) || month > 13 || month == '')
	{
		alert('write the month correctly');
		document.getElementById('month').focus();
	}
	else if(!IsNumeric(year) || year < 1980 || year == '' || year > curr_year)
	{
		alert('write the year correctly');
		document.getElementById('year').focus();
	}
	else {
			if(day<10 && day.length == 1)
			day="0"+day;
			if(month<10 && month.length == 1)
			month="0"+month;
			query = 'type=date&day='+day+'&month='+month+'&year='+year+'&id='+id;
			ajaxPage(id , '../templates/update.php', query);
			
			date_bool = true;
	}
}

/**
* get the old and insert it on layer for cancel update
**/
function cancel(id,value)
{
	document.getElementById(id).innerHTML = value;
	date_bool 	= true;
	text_bool 	= true;
	select_bool = true;
	textarea_bool = true;
}
/**
* DOM function create the field and text field 
**/
function updateField(id,value)
{
	layer = document.getElementById(id);
	
	text = document.createElement('input');
		text.setAttribute("type","text");
		text.setAttribute("id","name");
		text.setAttribute("size",30);
		text.setAttribute((document.all ? 'className' : 'class'), 'field');
		text.setAttribute("value",value);
		text.setAttribute("_new",1);
		text.onfocus = function() { this.className='focus'; };
		text.onblur	 = function() { this.className='field'; };
		
		imgObj	= document.createElement('img');
		imgObj.setAttribute('src','../images/save.png');
		imgObj.setAttribute('align','middle');
		imgObj.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj.setAttribute('alt','save');
		imgObj.setAttribute('vspace',1);
		imgObj.setAttribute('hspace',7);
		imgObj.onclick = function() { checkText(id,document.getElementById('name').value); };
	
	imgObj2	= document.createElement('img');
		imgObj2.setAttribute('src','../images/cancel.png');
		imgObj2.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj2.setAttribute('align','middle');
		imgObj2.setAttribute('alt','cancel');
		imgObj2.setAttribute('vspace',1);
		imgObj2.setAttribute('hspace',7);
		imgObj2.onclick = function() { cancel(id,value); };
		
	layer.innerHTML = '';
	layer.appendChild(text);
	layer.appendChild(imgObj);
	layer.appendChild(imgObj2);
	
	text_bool = false;
}

/**
* check the value before calling ajax page
* call ajax page or alert if wrong
**/
function checkText(id,value)
{
	if(value=='')
	{
		alert('write the name');
		document.getElementById('name').focus();
		alert(parseInt(id));
	}
	else
	{
		primaryId = parseInt(id);
		query = 'type=text&value='+value+'&id='+primaryId;
		ajaxPage(id , '../templates/update.php', query);
		
		
		text_bool = true;

	}
}

/**
* create select dom field with male, female options
**/
function updateSelect(id,value,lang)
{
	layer = document.getElementById(id);
	
	select = document.createElement('select');
		select.setAttribute("id","gender");
		select.setAttribute((document.all ? 'className' : 'class'), 'field');
		select.onfocus = function() { this.className='focus'; };
		select.onblur	 = function() { this.className='field'; };
		
		if(lang == 'en')
		{
			male 	= document.createTextNode('male');
			female	= document.createTextNode('female');
		}
		else
		{
			male 	= document.createTextNode('ذكر');
			female	= document.createTextNode('انثى');
		}
		
		option1 = document.createElement('option');
			option1.setAttribute("value",'male');
			option1.appendChild(male);
		
		option2 = document.createElement('option');
			option2.setAttribute("value",'female');
			option2.appendChild(female);
			
		imgObj	= document.createElement('img');
		imgObj.setAttribute('src','../images/save.png');
		imgObj.setAttribute('align','middle');
		imgObj.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj.setAttribute('alt','save');
		imgObj.setAttribute('vspace',1);
		imgObj.setAttribute('hspace',7);
		imgObj.onclick = function() { checkSelect(id,document.getElementById('gender').value,lang); };
	
	imgObj2	= document.createElement('img');
		imgObj2.setAttribute('src','../images/cancel.png');
		imgObj2.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj2.setAttribute('align','middle');
		imgObj2.setAttribute('alt','cancel');
		imgObj2.setAttribute('vspace',1);
		imgObj2.setAttribute('hspace',7);
		imgObj2.onclick = function() { cancel(id,value); };


	layer.innerHTML = '';
	select.appendChild(option1);
	select.appendChild(option2);
	layer.appendChild(select);
	layer.appendChild(imgObj);
	layer.appendChild(imgObj2);
	
	select_bool = false;

}
/**
* check the value before calling ajax page
* call ajax page or alert if wrong
**/
function checkSelect(id,value,lang)
{
		primaryId = parseInt(id);
		query = 'type=select&value='+value+'&id='+primaryId+'&lang='+lang;
		ajaxPage(id , '../templates/update.php', query);
				
		select_bool = true;

}
/**
* create select dom field with male, female options
**/
function updateTextArea(id,value)
{
	layer	 = document.getElementById(id);
	
	textarea = document.createElement('textarea');
		textarea.setAttribute("id","textarea");
		textarea.setAttribute("cols",50);
		textarea.setAttribute("rows",5);
		textarea.value = value;
		textarea.setAttribute((document.all ? 'className' : 'class'), 'field');
		textarea.onfocus = function() { this.className='focus'; };
		textarea.onblur	 = function() { this.className='field'; };
					
		imgObj	= document.createElement('img');
		imgObj.setAttribute('src','../images/save.png');
		imgObj.setAttribute('align','top');
		imgObj.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj.setAttribute('alt','save');
		imgObj.setAttribute('vspace',1);
		imgObj.setAttribute('hspace',7);
		imgObj.onclick = function() { checkTextArea(id,document.getElementById('textarea').value); };
		
		imgObj2	= document.createElement('img');
		imgObj2.setAttribute('src','../images/cancel.png');
		imgObj2.setAttribute((document.all ? 'className' : 'class'), 'cursor');
		imgObj2.setAttribute('align','top');
		imgObj2.setAttribute('alt','cancel');
		imgObj2.setAttribute('vspace',1);
		imgObj2.setAttribute('hspace',7);
		imgObj2.onclick = function() { cancel(id,value); };


	layer.innerHTML = '';
	layer.appendChild(textarea);
	layer.appendChild(imgObj);
	layer.appendChild(imgObj2);
	
	textarea_bool = false;
}
/**
* check the value before calling ajax page
* call ajax page or alert if wrong
**/
function checkTextArea(id,value)
{
		primaryId = parseInt(id);
		query = 'type=textarea&value='+value+'&id='+primaryId;
		ajaxPage(id , '../templates/update.php', query);
				
		textarea_bool = true;

}