﻿// -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
// Title: Timestamp picker																=-
// Description: See the demo at url														=-
// URL: http://us.geocities.com/tspicker/												=-
// Script featured on: http://javascriptkit.com/script/script2/timestamp.shtml			=-
// Version: 1.0																			=-
// Date: 12-05-2001 (mm-dd-yyyy)														=-
// Author: Denis Gritcyuk <denis@softcomplex.com>; <tspicker@yahoo.com>					=-

// This is actually Version 2.0.														=-
// Date: 18-02-2005 (mm-dd-yyyy)														=-
// The 1st version opened a window for the calender.									=-
// This one is much neater: it opens the calender in a layer.							=-
// Modified By: Arpan Dhandhania <arpan10@gmail.com>									=-

// Notes: Permission given to use this script in any kind of applications if			=-
//    header lines are left unchanged. Feel free to contact the author					=-
//    for feature requests and/or donations												=-
// -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-


// str_target : "document.form_name.input_field_name"
// str_datetime : "document.form_name.input_field_name.value"
// layer_name : "the layer in which the calender must appear"
function ShowCalendar(str_target, str_datetime, layer_name)
{
	var arr_months = ["January", "February", "March", "April", "May", "June",
		"July", "August", "September", "October", "November", "December"];
	var week_days = ["S", "M", "T", "W", "T", "F", "S"];
	var n_weekstart = 0; // day of week starts from (normally 0 or 1)

	var dt_datetime = (str_datetime == null || str_datetime =="" ?  new Date() : str2dt(str_datetime));
	var dt_prev_month = new Date(dt_datetime);
	dt_prev_month.setMonth(dt_datetime.getMonth()-1);
	var dt_next_month = new Date(dt_datetime);
	dt_next_month.setMonth(dt_datetime.getMonth()+1);
	var dt_firstday = new Date(dt_datetime);
	dt_firstday.setDate(1);
	dt_firstday.setDate(1-(7+dt_firstday.getDay()-n_weekstart)%7);
	var dt_lastday = new Date(dt_next_month);
	dt_lastday.setDate(0);
	
	// html generation (feel free to tune it for your particular application)
	// print calendar header
	var str_buffer = new String (
		"<table class=\"clsOTable\" cellspacing=\"0\" cellpadding=\"1\" border=\"0\" width=\"100%\">\n" +
		"<tr><td bgcolor=\"#999999\">\n" +
		"<table cellspacing=\"0\" cellpadding=\"2\" border=\"0\" width=\"100%\">\n" +
		"<tr>\n	<td bgcolor=\"#EEEEEE\"><a href=\"javascript:ShowCalendar('" +
		str_target + "','" + dt2dtstr(dt_prev_month) + "','" + layer_name + "');\">" +
		"<img src=\"/images/prev.gif\" width=\"16\" height=\"16\" border=\"0\"" +
		" alt=\"previous month\"></a></td>\n" +
		"	<td bgcolor=\"#EEEEEE\" colspan=\"5\" align=\"center\">" +
		"<font color=\"#000000\">"
		+ arr_months[dt_datetime.getMonth()] + " " + dt_datetime.getFullYear() + "</font></td>\n" +
		"	<td bgcolor=\"#EEEEEE\" align=\"right\"><a href=\"javascript:ShowCalendar('"
		+ str_target + "','" + dt2dtstr(dt_next_month) + "','" + layer_name + "');\">" +
		"<img src=\"/images/next.gif\" width=\"16\" height=\"16\" border=\"0\"" +
		" alt=\"next month\"></a></td>\n</tr>\n"
	);
	
	var dt_current_day = new Date(dt_firstday);
	// print weekdays titles
	str_buffer += "<tr>\n";
	for (var n=0; n<7; n++)
		str_buffer += "	<td bgcolor=\"#CCCCCC\" align=\"right\">" +
		"<font color=\"#666666\">" +
		week_days[(n_weekstart+n)%7] + "</font></td>\n";
	// print calendar table
	str_buffer += "</tr>\n";
	
	while (dt_current_day.getMonth() == dt_datetime.getMonth() ||
		dt_current_day.getMonth() == dt_firstday.getMonth()) {
		// print row header
		str_buffer += "<tr>\n";
		for (var n_current_wday=0; n_current_wday<7; n_current_wday++) {
				if (dt_current_day.getDate() == dt_datetime.getDate() &&
					dt_current_day.getMonth() == dt_datetime.getMonth())
					// print current date
					str_buffer += "	<td bgcolor=\"#FF6600\" align=\"right\">";
				else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6)
					// weekend days
					str_buffer += "	<td bgcolor=\"#EEEEEE\" align=\"right\">";
				else
					// print working days of current month
					str_buffer += "	<td bgcolor=\"white\" align=\"right\">";

				if (dt_current_day.getMonth() == dt_datetime.getMonth())
					// print days of current month
					str_buffer += "<a href=\"javascript:" + str_target +
					".value='" + dt2dtstr(dt_current_day) + "';HideCalendar('" + layer_name + "');\">" +
					"<font color=\"black\">";
				else 
					// print days of other months
					str_buffer += "<a href=\"javascript:" + str_target +
					".value='" + dt2dtstr(dt_current_day) + "'; HideCalendar('" + layer_name + "');\">" +
					"<font color=\"gray\">";
				str_buffer += dt_current_day.getDate() +"</font></a></td>\n";
				dt_current_day.setDate(dt_current_day.getDate()+1);
		}
		// print row footer
		str_buffer += "</tr>\n";
	}
	
	str_buffer +=
		"</table>\n" +
		"</tr>\n</td>\n</table>\n";
		
	var cal = document.getElementById(layer_name);
	cal.style.position = "absolute";
	cal.style.left=calculateOffsetLeft(str_target)+"px";
	cal.style.top=calculateOffsetTop(str_target)+str_target.offsetHeight-1+"px";
	cal.style.visibility = "visible";
	cal.innerHTML = str_buffer;
}

function HideCalendar(layer_name)
{
	var cal = document.getElementById(layer_name);
	cal.style.visibility = "hidden";
}

// datetime parsing and formatting routimes. modify them if you wish other datetime format
//
function str2dt (str_datetime)
{	
	var re_date = /^(\d+)\/(\d+)\/(\d+)/;
	if (!re_date.exec(str_datetime))
		return alert("Invalid Datetime format: "+ str_datetime);
	return (new Date (RegExp.$3, RegExp.$2-1, RegExp.$1));
}

function dt2dtstr (dt_datetime) {
	return (new String (
			dt_datetime.getDate() + "/" + (dt_datetime.getMonth()+1) + "/" + dt_datetime.getFullYear()));
}

function calculateOffsetLeft(r)
{
	return Ya(r,"offsetLeft")
}

function calculateOffsetTop(r)
{
	return Ya(r,"offsetTop")
}

function Ya(r,attr)
{
	var kb=0;
	while(r)
	{
		kb+=r[attr]; 
		r=r.offsetParent
	}
	return kb
}