/*********************************************************************************************************************
	Date picker is being written by 'Sunny Jagwani' 28th Nov 2005 [sunny.jags@gmail.com]
	This code is written at Almighty Technologies, bhopal.
/*********************************************************************************************************************
Use Instructions:
	First you need to call this script file in your page in following way:
		<script src="MyCalendar.js"></script>
		(write this line in header section for better possible results)
	To use this caledar with your text box you need to attach call funciton this way
	put any anchor beside your textbox and call the funtion like it:
	<input type=text runat="server" id="txtSample" maxlength=12 readonly>
	<a href="#" onclick="displayCalendar(event,'txtSample');">Calendar</a>
 You need to paas textbox id in function as well as event keyword (which is object of window.event.)
 
 OR just call it with textbox only like:
 <input type=text runat="server" id="txtSample" maxlength=12 readonly onclick="displayCalendar(event,'txtSample');" >
 
 With IE it will automatically open and close javascrit calendar on focus and lost focus. (but After first click only)
 With FireFox you need to call one more event with text box like onkeydown="hideCalendar(event);" 
 
 <input type=text runat="server" id="txtSample" maxlength=12 readonly onclick="displayCalendar(event,'txtSample');" onkeydown="hideCalendar(event);" >
 
 Make sure this setting is for read only text box. Means you need to set onkeydown event only if you are using readonly textbox.
 onkeypress event will check for tab key press to change focus from date textbox to another control
/*********************************************************************************************************************
Terms and conditions:
   This code is free to use by anyone. But you need to follow following conditions:
   1. Comment from this code should not be changed in any case
   2. Actual Author Name should be maintained in  code file in any case
/*********************************************************************************************************************
Code testing:
  This javascript calendar has been test under IP and firefox. This has not been tested yet with opera and other browsers. 
  
*********************************************************************************************************************/

var monthList = ['January','February','March','April','May','June','July','August','September','October','November','December'];
var monthListShort = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
var toDate = new Date();
var currentDate= new Date();
toDate.setDate(1); 
toDate.getTheYear = toDate.getFullYear ? toDate.getFullYear : toDate.getYear;
var mainTableStyle="font-size:7pt;border:1pt solid gray;background-color:white";
var dateNumberStyle="color:#565656;text-decoration:none;font-weight:bold;font-size:8pt;";
var dateLinkDefaultStyle="background-color:white;Font-Size:8pt;Font-Family:verdana;";
var dateLinkHOverStyle="background-color:lightBlue;font-Weight:bold;Font-Size:8pt;Font-Family:verdana;";
var dateLinkSelectedStyle="background-color:Blue;font-Weight:bold; Font-Size:9pt;Font-Family:verdana;";
var thisDateStyle="background-color:orange;font-Weight:bold;Font-Size:8pt;Font-Family:verdana;";
var monthYearHeaderStyle="background-color:#CCCCCC;font-weight:bold;font-size:8pt;font-family:verdana;color:Black;";
var monthHeaderLinkStyle="color:Black;font-size:8pt;font-weight:bold;text-decoration:none;";
var dayHeaderStyle="background-color:Gray;font-Weight:bold; Font-Size:9pt;Font-Family:verdana;color:WhiteSmoke";
var weekDayStyle="background-color:#EFEFEF;font-Weight:normal; Font-Size:8pt;Font-Family:verdana;";

var tmpStorePreviousStyle;
var textBoxControl;
var xPos;
var yPos;
var monthDayCount=[31,((!( toDate.getTheYear() % 4 ) && ( ( toDate.getTheYear() % 100 ) || !( toDate.getTheYear() % 400 ) ))?29:28),31,30,31,30,31,31,30,31,30,31];
function displayCalendar(e, txtId, anchor) 
{
    textBoxControl=document.getElementById(txtId);	
    if (!textBoxControl) 
    {alert('Actual Calendar implementation object not found'); return;}
    var sX = 0, sY = 0; 
    if( !e ) { e = window.event; }
    /*if( e && ( e.screenX || e.screenY ) && screen.availWidth ) { sX = e.screenX; sY = e.screenY; }
    if(window.screenLeft>=0)
        { sX=sX-window.screenLeft;} 
    else 
        {sX=textBoxControl.offsetLeft+textBoxControl.offsetWidth;}
    if(window.screenTop>=0)
        { sY=(sY-window.screenTop)+65;} 
    else 
        {if (textBoxControl.offsetTop>10)
            {sY=textBoxControl.offsetTop;}
        }*/
    var aTag = textBoxControl;
    sY+=aTag.offsetHeight;
	do {
		sX += aTag.offsetLeft;
		sY  += aTag.offsetTop;
		aTag     = aTag.offsetParent;
	} while (aTag.tagName.toUpperCase() != 'BODY');
    xPos=sX;yPos=sY;DrawCalendar();
    textBoxControl.onfocus=DrawCalendar;
    if (navigator.appName.indexOf("Microsoft")>=0 && textBoxControl.getAttribute("readonly")==true )
        textBoxControl.onkeydown=CheckForLostFocus;
}
function CheckForLostFocus()
{
    if (navigator.appName.indexOf("Microsoft")>=0 )
    {if (event.keyCode==9)fnEmptyControl();	}
}
function hideCalendar(e)
{
    if( !e ) { e = window.event; } 
    if (e.keyCode==9){fnEmptyControl();}
}
function resetDate() 
{ 
    toDate.setTime((new Date()).getTime()); 
}
function DrawCalendar() 
{monthDayCount[1]=((!( toDate.getTheYear() % 4 ) && ( ( toDate.getTheYear() % 100 ) || !( toDate.getTheYear() % 400 ) ))?29:28);
    var templateData = '<div><table border="0" cellpadding="0" cellspacing="1" width="180" style="'+ mainTableStyle +'"><tr><td colspan="7"><table border="0" cellpadding="2" cellspacing="0" style="'+ monthYearHeaderStyle +'" width="100%" ><tr><td ><a style="'+monthHeaderLinkStyle+'" href="javascript:fnGetPreviousYear()">&lt;&lt;</a></td><td align="center"  style="'+ monthYearHeaderStyle +'">'+toDate.getTheYear()+'</td><td align="right"><a style="'+monthHeaderLinkStyle+'" href="javascript:fnGetNextYear();">&gt;&gt;</a></td></tr><tr><td><a style="'+monthHeaderLinkStyle+'" href="javascript:fnPreviousMonth()">&lt;&lt;</a></td><td align="center"  style="'+ monthYearHeaderStyle +'">'+monthList[toDate.getMonth()]+' [<a style="'+monthHeaderLinkStyle+'" href="javascript:fnGetThisDate();"><font size="-2">Now</font></a>]</td><td align="right"><a style="'+monthHeaderLinkStyle+'" href="javascript:fnGetNextMonth();">&gt;&gt;</a></td></tr></table></td></tr><tr style="'+ dayHeaderStyle +'"><th >S</th><th >M</th><th >T</th><th >W</th><th >T</th><th >F</th><th >S</th></tr>';for( var x = 1; x <= monthDayCount[toDate.getMonth()]; x++ ) {	toDate.setDate(x);if( x == 1 && toDate.getDay() ) { templateData += '<tr><td  colspan="'+toDate.getDay()+'">&nbsp;</td>'; }templateData += ( ( !toDate.getDay() ) ? '<tr>' : '' ) + '<td onMouseOver="ChangeBoxStyleOnOver(this);" onMouseOut="ChangeBoxStyleOnOut(this);" align="center" style="'+((toDate.getMonth()==(new Date()).getMonth()&&toDate.getYear()==(new Date()).getYear()&&x==(new Date()).getDate())? thisDateStyle:((!toDate.getDay()||toDate.getDay()==6)?weekDayStyle:dateLinkDefaultStyle))+'"><a style="'+dateNumberStyle+'" href="javascript:fnSelectDateToBox(' + x +');">'+x+'</a></td>';} toDate.setDate(1);templateData += '</tr><tr style="'+ dayHeaderStyle +'"><td align="center" style="cursor:hand" title="Clear" OnClick="textBoxControl.value=\'\';fnEmptyControl();" ><a href="#" style="font-size:8pt;color:White;text-decoration:none">/</td><td colspan="5" style="font-weight:bold;color:White;" align="center">'+ ((textBoxControl.value!="")?textBoxControl.value:currentDate.getDate()+"-"+ monthListShort[currentDate.getMonth()] + "-" + currentDate.getFullYear()) +'</td><td align="center" style="cursor:hand" OnClick="fnEmptyControl();" title="Cancel" ><a href="#" style="font-size:8pt;font-weight:bold;color:White;text-decoration:none">X</td></tr></table></div>';
    fnEmptyControl();var divControl=document.createElement("div");divControl.id="divCalendarSJ";divControl.innerHTML=templateData;divControl.style.position="absolute";divControl.style.left=xPos;	divControl.style.top=yPos;divControl.style.display="block";textBoxControl.parentNode.appendChild(divControl);hideElement("SELECT",document.getElementById("divCalendarSJ"));}
function fnGetPreviousYear(){toDate.setYear( toDate.getTheYear() - 1 ); DrawCalendar(); }
function fnPreviousMonth(){	if( toDate.getMonth() ) { toDate.setMonth( toDate.getMonth() - 1 ); } else { toDate.setMonth(11); toDate.setYear( toDate.getTheYear() - 1 ); } DrawCalendar();}
function fnGetNextYear(){toDate.setYear( toDate.getTheYear() + 1 ); DrawCalendar(); }
function fnGetNextMonth(){if( toDate.getMonth() < 11 ) { toDate.setMonth( toDate.getMonth() + 1 ); } else { toDate.setMonth(0); toDate.setYear( toDate.getTheYear() + 1 ); } DrawCalendar(); }
function fnGetThisDate(){resetDate(); DrawCalendar(); }
function fnEmptyControl(){if (textBoxControl.parentNode.childNodes.length>1){	var childNodes=textBoxControl.parentNode.childNodes;if (childNodes[childNodes.length-1].id && childNodes[childNodes.length-1].id=="divCalendarSJ") textBoxControl.parentNode.removeChild(childNodes[childNodes.length-1]); }showElement("SELECT");}
function fnSelectDateToBox(day){textBoxControl.value=day + "-"+ monthListShort[toDate.getMonth()] + "-" + toDate.getFullYear();fnEmptyControl();}
function ChangeBoxStyleOnOver(cntrl){tmpStorePreviousStyle=cntrl.getAttribute("style");cntrl.setAttribute("style", dateLinkHOverStyle )}function ChangeBoxStyleOnOut(cntrl){cntrl.setAttribute("style", tmpStorePreviousStyle)}
	function hideElement( elmID, overDiv ) {
		if(navigator.appName.indexOf("Microsoft")>=0) {
			for(i = 0; i < document.all.tags( elmID ).length; i++) {
				obj = document.all.tags( elmID )[i];
				if(!obj || !obj.offsetParent) continue;

				// Find the element's offsetTop and offsetLeft relative to the BODY tag.
				objLeft   = obj.offsetLeft;
				objTop    = obj.offsetTop;
				objParent = obj.offsetParent;

				while(objParent.tagName.toUpperCase() != 'BODY') {
					objLeft  += objParent.offsetLeft;
					objTop   += objParent.offsetTop;
					objParent = objParent.offsetParent;
				}

				objHeight = obj.offsetHeight;
				objWidth  = obj.offsetWidth;

				if((overDiv.offsetLeft + overDiv.offsetWidth) <= objLeft);
				else if((overDiv.offsetTop + overDiv.offsetHeight) <= objTop);
				/* CHANGE by Charlie Roche for nested TDs*/
				else if(overDiv.offsetTop >= (objTop + objHeight + obj.height));
				/* END CHANGE */
				else if(overDiv.offsetLeft >= (objLeft + objWidth));
				else {
					obj.style.visibility = 'hidden';
				}
			}
		}
	}

	/*
	* unhides <select> and <applet> objects (for IE only)
	*/
	function showElement(elmID) {
		if(navigator.appName.indexOf("Microsoft")>=0) {
			for(i = 0; i < document.all.tags( elmID ).length; i++) {
				obj = document.all.tags(elmID)[i];
				if(!obj || !obj.offsetParent) continue;
				obj.style.visibility = '';
			}
		}
	}
