var cal_calendarimage='whoru_js/calendar.gif';
var cal_monthname = new Array('มกราคม','กุมภาพันธ์','มีนาคม','เมษายน','พฤษภาคม','มิถุนายน','กรกฏาคม','สิงหาคม','กันยายน','ตุลาคม','พฤษจิกายน','ธันวาคม');
var cal_dayname = new Array('อา','จ','อ','พ','พฤ','ศ','ส');
var cal_today = new Date();
var cal_minyear = 1900;
var cal_maxyear = cal_today.getFullYear();
var cal_thaiyear = 0;

var style_normal="font-family: Tahoma; font-size: 8pt;";
var style_button = "font-family: Tahoma; font-size: 8pt; border:1px solid #FFAFAF;  background: #FFEFEF; width: 15px;";
var style_buttonDisable = "font-family: Tahoma; font-size: 8pt; border:1px solid #FFDFDF;  background: #FFEFEF; color: #FFAFAF; width: 15px;";
var style_button2 = "font-family: Tahoma; font-size: 8pt; border:1px solid #FFAFAF; background: #FFEFEF;";
var style_bg = "background: #EFEFFF; border: 1px solid #CFCFFF; cursor:default;";
var style_cell = "text-align:center; width: 20px; height: 17px;";
var style_cellActive = "border: 1px solid silver; background: #EFEFEF; text-align:center; height: 17px; cursor: pointer;";
var style_cellOver = "border: 1px solid silver; background: #EFEFEF; text-align:center; height: 17px; cursor: pointer;";
var style_cellBlank = "width: 20px; height: 20px; cursor:default;";
var style_cellHead = "border: 1px; text-align:center; width: 20px; background: white; height: 17px;";

function calendarinput(fieldName, defaultValue) {
	var validDate;
	var d = document;
	var nl = "\n";
	var yeardiff = 0;
	if (cal_thaiyear)
		yeardiff = 543;

	if (typeof(defaultValue) == "undefined" || defaultValue == '' || defaultValue == '0000-00-00') {
		validDate = 0
	}
	else {
		var default_date_array = defaultValue.split('-');
		var month = typeof(default_date_array[1]) == "undefined"?-1:default_date_array[1]-1;
		var year = typeof(default_date_array[0]) == "undefined"?0:default_date_array[0];
		var day = typeof(default_date_array[2]) == "undefined"?0:default_date_array[2];

		if (month == -1 || year == 0 || day == 0) {
			validDate = 0;
		}
		else {
			var testDate = new Date(year, month, day);
			if (year != testDate.getFullYear())
				validDate = 0;
			else if (month != testDate.getMonth())
				validDate = 0;
			else if (day != testDate.getDate())
				validDate = 0;
			else {
				validDate = 1;
				day = testDate.getDate();
				month = testDate.getMonth();
				year = testDate.getFullYear();
			}
		}
	}
	d.write('<span style="border:1px solid #7f9db9;" id="'+fieldName+'_show">'+nl);
	if (validDate) {
		if (day in [1,21,31])		daysuf = 'st';
		else if (day in [2, 22])		daysuf = 'nd';
		else if (day in [3, 23])		daysuf = 'rd';
		else								daysuf = 'th';
		d.write(' ' + day + ' ' + cal_monthname[month] + ' ' + (year+yeardiff));
	}
	else 
		d.write('<span style="color:silver">Place click right to select date.</span>');
	d.write('</span>&nbsp&nbsp&nbsp;');
	d.write('<input type=image src="'+cal_calendarimage+'" onclick="calendar_onclick(\''+fieldName+'\'); return false;" id="'+fieldName+'_button">'+nl);
	d.write('<input type=hidden name="'+fieldName+'" id="'+fieldName+'" ');
	if (validDate)
		d.write(' value="'+defaultValue+'" ');
	d.write('><div id="'+fieldName+'_layer" style="position:absolute; left:0px; top:0px;display:none"></div>'+nl);
}

function calendar_onclick(fieldName) {
	var e = el(fieldName+'_layer');
	if (e.style.display == 'none') {
		showcalendar(fieldName);
	}
	else {
		hidecalendar(fieldName);
	}
}

function showcalendar(fieldName) {
	var b = el(fieldName+'_button');
	var l = el(fieldName+'_layer');
	var s = el(fieldName+'_show');
	var h = el(fieldName);

	// Find position to display under b
	var x = b.offsetLeft;
	var y = b.offsetTop + b.offsetHeight ;
	var parent = b;
	while (parent.offsetParent) {
		parent = parent.offsetParent;
		x += parent.offsetLeft;
		y += parent.offsetTop ;
	}

	l.style.top = y;
	l.style.left = x;
	l.style.display = 'block';

	// Get datetime
	var default_date = h.value;
	var default_date_array = h.value.split('-');
	var month = typeof(default_date_array[1]) == "undefined"?-1:default_date_array[1]-1;
	var year = typeof(default_date_array[0]) == "undefined"?0:default_date_array[0];
	var day = typeof(default_date_array[2]) == "undefined"?0:default_date_array[2];

	if (month < 0 || month > 11) {
		month = cal_today.getMonth();
	}
	if (year == 0)
		year = cal_maxyear;
	if (year < cal_minyear)
		year = cal_minyear;
	if (year > cal_maxyear)
		year = cal_maxyear;
	if (day < 1)
		day = cal_today.getDate();
	drawcalendar(fieldName, day, month, year);
}

function drawcalendar(fieldName, day, month, year) {
	var l = el(fieldName+'_layer');
	var d = new Date(year, month, 1);
	var html = '';
	var nl = "\n";
	var yeardiff = 0;
	if (cal_thaiyear)
		yeardiff = 543;

	year = d.getFullYear();
	month = d.getMonth();
	//day = d.getDate();

	// Month and Year
	html = '<table cellpadding=2 cellspacing=0 border=0 style="' + style_normal + style_bg + '"><tr><td align=center>' + nl;
	html += '<table cellpadding=0 cellspacing=0 border=0 width=150 style="' + style_normal + '"><tr>';
	if (year == cal_minyear && month == 0)
		html += '<td width=15><input type=button value="<" style="'+style_buttonDisable+'"></td>'; // write event here
	else
		html += '<td width=15><input type=button value="<" style="'+style_button+'" onclick="drawcalendar(\''+fieldName+'\', ' + day + ',' +(month-1)+',' +year+');"></td>'; // write event here

	html += '<td align=center>' + cal_monthname[month] + '</td>' + nl;

	if (year == cal_today.getFullYear() && month == 11)
		html += '<td width=15><input type=button value=">" style="'+style_buttonDisable+'"></td>'; // write event here
	else
		html += '<td width=15><input type=button value=">" style="'+style_button+'" onclick="drawcalendar(\''+fieldName+'\', ' + day + ',' +(month+1)+',' +year+');"></td>'; // write event here

	html += '<td align=right width=60><select style="'+style_button2+'" onchange="blur(); drawcalendar(\''+fieldName+'\',' + day + ',' + month+', this.options[this.selectedIndex].value);">' + nl;
				for(i = cal_minyear; i <= cal_today.getFullYear(); i++) {
		if (i == year) {
			html += '<option value="'+i+'" selected>' + (i + yeardiff) + nl;
		}
		else {
			html += '<option value="'+i+'">' + (i + yeardiff) + nl;
		}
	}
	html +='</select></td></tr></table>' + nl;
	html += '</td></tr>' + nl;

	// Sun - Sat
	html += '<tr><td align=center>' + nl;
	html += '<table cellpadding=0 cellspacing=1 border=0 style="'+style_normal+'"><tr>' + nl;
	for(i = 0; i < 7; i++) {
		html += '<td style="'+style_cellHead+'">';
		html += cal_dayname[i];
		html += '</td>' + nl;
	}
	html += '</tr>' + nl;

	while (d.getDay() != 0) {
		d.setDate(d.getDate() - 1);
	}

	html += '<tr>' + nl;

	while (d.getDate() != 1) {
		html += '<td class="'+style_cellBlank+'"></td>';
		d.setDate(d.getDate() + 1);
	}

	do {
		d2 = d.getDate();
		if (d.getDay() == 0 && d2) {
			html += '</tr><tr>';
		}
		if (d2 != day)
			html += '<td style="'+style_cell+'" onmouseover="this.style.cssText=\''+style_cellOver+'\'" onmouseout="this.style.cssText=\''+style_cell+'\'" onclick="assigndatevalue(\''+fieldName+'\', '+d2+','+month+','+year+');">'+d2+'</td>'+nl;
		else
			html += '<td style="'+style_cellActive+'" onmouseover="this.style.cssText=\''+style_cellOver+'\'" onmouseout="this.style.cssText=\''+style_cellActive+'\'" onclick="assigndatevalue(\''+fieldName+'\', '+d2+','+month+','+year+');">'+d2+'</td>'+nl;
		d.setDate(d.getDate() + 1);
	} while (d.getDate() != 1)
	html += '</tr></table>' + nl;

	html += '</td></tr><tr><td align=center>';
	html += '<input type=button style="'+style_button2+'" value="Today" onclick="drawcalendar(\''+fieldName+'\','+cal_today.getDate()+','+cal_today.getMonth()+','+cal_today.getFullYear()+');"> ';
	html += ' <input type=button style="'+style_button2+'" value="Close" onclick="hidecalendar(\''+fieldName+'\');">';
	html += '</td></tr></table>';

	l.innerHTML = html;
}

function assigndatevalue(fieldName, day, month, year) {
	var h = el(fieldName);
	var s = el(fieldName+'_show');
	var yeardiff = 0;
	var daysuff = '';
	if (cal_thaiyear)
		yeardiff = 543;
	h.value='' + year + '-' + (month+1) + '-' + day;
	if (day in [1,21,31])		daysuf = 'st';
	else if (day in [2, 22])		daysuf = 'nd';
	else if (day in [3, 23])		daysuf = 'rd';
	else								daysuf = 'th';
	s.innerHTML=' '  + day + '  '  + cal_monthname[month] + '  ' + (year+yeardiff);
	hidecalendar(fieldName);
}

function hidecalendar(fieldName) {
	l = el(fieldName + '_layer');
	l.style.display = 'none';
}

function el(layerName) {
	return document.getElementById(layerName);
}