<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Doug Lawson (dlawson@clark.net) -->
/* Visit http://www.yaldex.com/ for full source code
and get more free JavaScript, CSS and DHTML scripts! */
<!-- Begin
var calStartDOW = 0;
var holidays = new Array();
holidays["1 Jan 2000"] = true;
holidays["17Jan 2000"] = true;
holidays["21 Feb 2000"] = true;
holidays["21 Apr 2000"] = true;
holidays["29 May 2000"] = true;
holidays["3 Jul 2000"] = true;
holidays["4 Jul 2000"] = true;
holidays["4 Sep 2000"] = true;
holidays["10 Nov 2000"] = true;
holidays["23 Nov 2000"] = true;
holidays["24 Nov 2000"] = true;
holidays["25 Dec 2000"] = true;
holidays["31 Dec 2000"] = true;
////////////////////////////////////////////////
// ABBREVIATED MONTH NAMES
// months[] is used internally for (among other things) compatibility
with
// javascript Date.parse() methods. You should only have to change it if
// your language variable changes.
var months = new Array( "Jan","Feb","Mar", "Apr","May","Jun", "Jul","Aug","Sep","Oct",
"Nov", "Dec");
///////////////////////////////////////////////
// Long month names
// longmonths is used for calendar titles. They don't have to be long,
// just whatever you would like to display
//
var longmonths = new Array( "January", "February", "March",
"April", "May", "June",
"July", "August", "September",
"October", "November", "December" );
var leapdays = new Array(31,29,31, 30,31,30, 31,31,30, 31,30,31);
var yeardays = new Array(31,28,31, 30,31,30, 31,31,30, 31,30,31);
////////////////////////////////////////////////
// the symbols to use at the top of the calendars
var dow = new Array("S","M","T","W","T","F","S");
// globalCalWidth is the default width for calendar tables
var globalCalWidth = "95%";
// colors
// changing colors here is a lot easier than slogging through the code
//
// actually, it would be better to do all this with classes and style
sheets
// but we want to support some older browsers
var colorWhite = "#FFFFFF";
var colorDarkRed = "#800000";
var colorMedRed = "#B00000";
var colorLightGrey = "#E0E0E0";
var colorMedGray = "#808080";
var colorOffWhite = "#F8F8F8";
var colorDkBlue = "#0000E0";
// colors for various parts of the calendars
var holidayColor = colorMedRed; // fg color for weekends and holidays
var dowBGColor = colorLightGrey; // bg for days of week at top of
calendar
var dowFGColor = colorDkBlue; // fg for days of week
var calHdrBGColor = colorMedGray; // bg for month and year
var calHdrFGColor = colorOffWhite; // fg for month and year
//////////////////////////////////////////////////////////////////
// a global date object to speed things up a little, since
// there are lots of places where we need today's date
var myDate = new Date();
////////////////////////////////////////////////////////////////
// thisMonth and thisYear are used as static vars for
// newCalendars() (for persistence between calls, which may
// or may not involve reloading the document)
//
// whether these are important or not depends on how you
// handle the PREVIOUS and NEXT buttons. If you reload the
// script from the server using GET, you won't use these variables.
//
// if you want to cahnge the target so that going backward or
// forward does not require a reload, then you will be setting these
// from the buttons, probably best done with a handler for onClick()
var thisMonth = myDate.getMonth();
var thisYear = myDate.getFullYear();
// Now, figure out the arguments the page was loaded with
// and what they mean
//
// you won't need the next four lines if you don't use GET for
// the PREVIOUS and NEXT features. Comment them out
// if that is the case
var URLargs = getURLArgs(true);
if (URLargs.year) { thisYear = parseInt(URLargs.year); }
if (URLargs.month) { thisMonth = (parseInt(URLargs.month)%12); }
if (URLargs.starton) { calStartDOW = (parseInt(URLargs.starton)%7); }
function isLeapYear( year ){
// is it leap year ? returns a boolean
return ( (0 == (year%4)) && ( (0 != (year%100)) || (0 == (year%400))));
// ie, if the year divides by 4, but not by 100 except when it divides
by
// 400, it is leap year
}
function isValidDayOfMonth( day, month, year)
{
// determines whether a day is valid
// (ie, prevents Feb 30 from being processed)
// ( not used but left here for other pages that use
// this calendar, like the time-off request form )
//
if (day <= 0) { return false; }
if (isLeapYear(year)) { return (day <= leapdays[month])}
return ( day <= yeardays[month]);
}
function canonicalDate(day, month, year)
{
// return the number of days since the Jan 0 2000 (ie, 1/1/2K returns 1,
31/12/1999 returns 0)
// for days before Jan 1 2000, returns negative numbers
var canonDate = 0;
// if the function had no arguments, use today's date;
var mday = myDate.getDate();
var mmon = myDate.getMonth();
var myr = myDate.getFullYear();
if( arguments.length > 0 ) { mday = arguments[0]; }
if( arguments.length > 1 ) { mmon = arguments[1]; }
if( arguments.length > 2 ) { myr = arguments[2]; }
if(myr >= 2000)
{ canonDate += mday;
while(mmon > 0) { canonDate += isLeapYear(myr) ? leapdays[mmon]:
yeardays[mmon]; mmon--;}
while(myr > 2000){ canonDate += isLeapYear(myr) ? 366: 365; myr--; }
}
else
{ canonDate -= isLeapYear(myr) ? leapdays[mmon] - mday: yeardays[mmon] -
mday;
while(mmon < 11) { mmon++; canonDate -= isLeapYear(myr) ?
leapdays[mmon]: yeardays[mmon];}
while(myr < 1999){ myr++; canonDate -= isLeapYear(myr) ? 366: 365;}
}
return canonDate;
}
function dateDiff(firstDate, secondDate)
{
// returns the result in days of subtracting firstDate from secondDate.
Result is
// negative if secondDate came before firstDate.
var days= ( canonicalDate(secondDate.getDate(), secondDate.getMonth(),
secondDate.getFullYear()) -
canonicalDate(firstDate.getDate(), firstDate.getMonth(),
firstDate.getFullYear()));
return days;
}
function shiftArray(myArray)
{
// since Array.shift() is missing or broken on some versions of MSIE
// we fake it here.
if(-1 != navigator.appVersion.indexOf("MSIE")) {
var myVal = myArray[0];
for(i=0; i<(myArray.length -1); i++)
{ myArray[i] = myArray[i+1];}
myArray.length = myArray.length -1;
return myVal; }
else return myArray.shift();
}
function isHoliday(year,mon,mday)
{
// it the date on the list?
// the format is a little sensitive, you
// have to make sure that 'mon' is
// something that Date.parse() can
// understand
var dStr = mday + " " + mon + " " + year;
if(holidays[dStr]) { return true; }
return false;
}
function isWeekend( year, mon, mday)
{
var mDate = new Date(mday + " " + mon + " " + year);
return ( ( 0 == mDate.getDay()) || ( 6 == mDate.getDay() ));
}
function calculateWorkDays( startDate, endDate)
{
// called with 2 Date Objects as arguments.
// calculates the number of workdays between two dates by adding up the
// number of days and subtracting weekends and holidays.
var myEndDate = canonicalDate(endDate.getDate(), endDate.getMonth(),
endDate.getFullYear());
var counter = 0;
var mDay = startDate.getDate();
var mMonth = startDate.getMonth();
var mYear = startDate.getFullYear();
while (canonicalDate(mDay, mMonth, mYear) <= myEndDate)
{
if(! ( isHoliday(mYear,months[mMonth],mDay) ||
isWeekend(mYear,months[mMonth],mDay)) )
{ counter++; }
// increment the date
// are we at the end of a month ?
var omDay = mDay;
var omMonth = mMonth;
var omYear = mYear;
mDay = isLeapYear(mYear) ?
((mDay >= leapdays[mMonth]) ? 1 : mDay+1):
((mDay >= yeardays[mMonth]) ? 1 : mDay+1);
// do we need to increment the month ?
mMonth = (mDay == 1) ? (mMonth +1) % 12: mMonth;
// do we need to increment the year?
mYear = ( (mDay == 1) && (mMonth == 0)) ? mYear + 1: mYear;
// startDate = new Date(mDay, mMonth, mYear);
}
return counter;
}
function writeCalendar(target, myYear, myMonth, sday, eday)
{
// writes a calendar to target for myMonth myYear.
// sday and eday are optional values indicating the range of dates
// to be set in bold.
// get a new date for the first day of the month the user is looking at
var calDate = new Date( myYear, myMonth, 1, 0,0,0,0 );
// how many days are in the month ?
var mDays = isLeapYear(myYear) ? leapdays[myMonth]: yeardays[myMonth];
var i = 0;
// what day of the week does the month start on?
var wkDay = calDate.getDay();
var dateBgAtt = "";
var dateFontTag = "";
var fontCloseTag = "";
var boldTag = "";
var unBoldTag = "";
// if the function was called with the sday and eday arguments, then the
// caller wants a range of dates written in bold
var useBold = arguments.length >= 5 ? true: false;
// write the header for the calendar ( month and year )
target.write("<CENTER>\n<TABLE BORDER='0' CELLPADDING='6'
CELLSPACING='0' WIDTH=\"80%\">\n");
// set the background color in the TR tag
target.write("<TR BGCOLOR=\"", calHdrBGColor, "\">");
// set the FG color using a FONT tag, better would be style sheets
target.write(
"<TD COLSPAN='5'><FONT COLOR=\"", calHdrFGColor, "\"><STRONG>",
longmonths[myMonth],
"</STRONG></FONT></TD>","<TD COLSPAN='2'><FONT COLOR=\"", calHdrFGColor,
"\"><STRONG>",
myYear,
"</STRONG></FONT></TD></TR>\n"
);
// write the abbreviations for days of the week into the top line of the
calendar
target.write("<TR BGCOLOR=\"", dowBGColor, "\">");
for(i=0; i< 7; i++)
{ target.write("<TD><FONT COLOR=\"", dowFGColor,
"\">", dow[((i+calStartDOW)%7)],
"</FONT></TD>");}
target.write("</TR>\n");
// start the first line with blank spaces until we get to the first day
of the month
target.write("<TR ALIGN='RIGHT'>");
for(i=0 ; i < ((7 - calStartDOW + wkDay)%7); i++)
{ target.write("<TD> \; \; \;</TD>"); }
// since javascript doesn't do modulus on negative numbers,
// add 7 to anything that might be negative
var cmdate = i - ((7 - calStartDOW + wkDay)%7);
// write the weekdays
for( i=i; cmdate < mDays ; i++)
{
// what is the date ?
cmdate++;
// if we have reached the end of a week, start another one
if(0 == (i%7)){ target.write("</TR>\n<TR ALIGN='RIGHT'>"); }
// if the date is a holiday or weekend, set it in color
if( (isHoliday(calDate.getFullYear(),months[calDate.getMonth()],cmdate))
|| (isWeekend(calDate.getFullYear(),months[calDate.getMonth()],cmdate))
)
{
dateBgAtt = "";
dateFontTag = "<FONT COLOR=\"" + holidayColor + "\">";
fontCloseTag = "</FONT>"; }
else
{ dateBgAtt = "";
dateFontTag = "";
fontCloseTag = ""; }
// set the days off in bold
if( ( useBold ) && (cmdate >= sday) && (cmdate <= eday))
{ boldTag = "<STRONG><EM>";
unBoldTag = "</EM></STRONG>"; }
else {
boldTag = "";
unBoldTag = ""; }
target.write("<TD ", dateBgAtt, " >", dateFontTag, boldTag, cmdate,
unBoldTag, fontCloseTag, "</TD>");
}
while(0 != (i%7)) { target.write("<TD> </TD>"); i++; }
target.write("</TR>");
target.write("</TABLE></CENTER>\n");
}
function drawCalendar( ourTarget, ourYear, ourMonth, startDay, endDay)
{
// serves as a wrapper for writeCalendar()
// if you want to do anything special, such as changing the colors,
// or opening a special window, you can do it here before calling
writeCalendar().
// sday and eday are optional values indicating the range of dates
// to be set in bold.
// arguments:
// ourTarget - document to write to
// ourYear, ourMonth - integers, typically returned by Date.getMonth()
and Date.getDate()
// startDay, endDay - optional start and end days for bolding
var myMonth = myDate.getMonth();
var myYear = myDate.getFullYear();
var target = document;
// strictly speaking, all the arguments are optional.
// if you only want this month's calendar, called drawCalendar() with no
args.
if(arguments.length >= 1) { target = ourTarget; }
if(arguments.length >= 2) { myYear = ourYear; }
if(arguments.length >= 3) { myMonth = ourMonth; }
{ writeCalendar(target, myYear, myMonth, startDay, endDay); }
}
function getURLArgs(caseBool)
{
// gets the arguments the page was loaded with - that is,
// everything after the first '?'
// parameters:
// caseBool - set to true or positive integer to force lowercase
// for parameter values
//
// values are ALWAYS case sensitive
//
var casefree = ( (true == caseBool) || (caseBool >= 1)) ? true: false;
var args = new Object();
var query = location.search.substring(1);
// alert(query);
var pairs = query.split("&");
for(var i = 0; i< pairs.length; i++)
{
pairs[i]= unescape(pairs[i]);
var pos=pairs[i].indexOf('=');
if(-1 == pos) continue;
var argname;
if(true != casefree) { argname = pairs[i].substring(0,pos); }
else { argname = pairs[i].substring(0,pos).toLowerCase(); }
var value = pairs[i].substring(pos+1);
args[argname] = value;
}
return args;
}
function newCalendars(myear, mmonth)
{
// puts three calendars on the page from which it
// was called. (last month, this month, next month)
// Params
//
// when called with 2 arguments
// myear - the year for the center calendar
// mmonth - the month for the center calendar
var myMonth = thisMonth;
var myYear = thisYear;
if(arguments.length == 2) { myMonth = mmonth; myYear == myear; }
// it's surprising how many coders don't use modular arithmetic to
// do date and time. Javascript doesn't understand negative numbers in
// positive modulus, so we add 11 instead of subtracting 1.
var lastMonth = (myMonth + 11) % 12;
var lmYear = (myMonth == 0)? myYear -1: myYear;
var nextMonth = (myMonth +1)%12;
var nmYear = (myMonth == 11)? myYear + 1: myYear;
///////////////////////////////////////////////////////////////////////////
// WRITE CALENDAR #1
//
document.write("<TABLE ALIGN=\"TOP\" WIDTH=\"90\%\"><TR
VALIGN=\"TOP\"><TD>");
var isThisMonth = ((lastMonth == myDate.getMonth())&&
(lmYear==myDate.getFullYear()));
drawCalendar(document, lmYear, lastMonth,
(isThisMonth ? myDate.getDate():0),
(isThisMonth ? myDate.getDate():0)
);
isThisMonth = ((myMonth == myDate.getMonth())&&
(myYear==myDate.getFullYear()));
document.write("</TD>\n<TD>");
///////////////////////////////////////////////////////////////////////////
// WRITE CALENDAR #2
//
drawCalendar(document, myYear, myMonth,
(isThisMonth? myDate.getDate():0),
(isThisMonth? myDate.getDate():0));
document.write("</TD>\n<TD>");
///////////////////////////////////////////////////////////////////////////
// WRITE CALENDAR #3
//
isThisMonth = ((nextMonth == myDate.getMonth())&&
(nmYear==myDate.getFullYear()));
drawCalendar(document, nmYear, nextMonth,
(isThisMonth ? myDate.getDate():0),
(isThisMonth ? myDate.getDate():0));
document.write("</TD></TR></TABLE>\n");
//////////////////////////////////////////////////////////////////////////////
// write the NEXT and PREVIOUS buttons
//
// note that we create a form and use the document URL as the target,
// with the METHOD of GET.
//
// if we were writing the calendars into a separate window or frame,
// we wouldn't need to reload; we could just change the global values
// for thisYear, thisMonth, and calStartDOW, and refresh that window
// by calling newCalendars() with that window as target.
//
var docName = location.pathname;
var buttonString = "<INPUT TYPE=\"BUTTON\" VALUE=\"Previous\"" +
" onClick='document.newCal.month.value=\"" + lastMonth+ "\"; " +
"document.newCal.year.value=" + lmYear + "; " +
"submit();' > ";
document.write("<FORM NAME=\"newCal\" METHOD=\"GET\" ACTION=\"" +
docName + "\">");
document.write("<INPUT TYPE=\"hidden\" NAME=\"month\" VALUE=\"" +
myMonth +"\">");
document.write("<INPUT TYPE=\"hidden\" NAME=\"year\" VALUE=\"" + myYear
+"\">");
document.write("<INPUT TYPE=\"hidden\" NAME=\"startOn\" VALUE=\"" +
calStartDOW +"\">");
document.write("<CENTER>");
document.write( buttonString);
buttonString = "<INPUT TYPE=\"BUTTON\"
VALUE=\" Next \"" +
" onClick='document.newCal.month.value=" + nextMonth+ "; " +
"document.newCal.year.value=" + nmYear + "; " +
"submit();' > ";
document.write("   ");
document.write( buttonString);
document.write("</CENTER><P>\n");
var calStyleString = "" +
"<SMALL>calendar style: US" +
"<INPUT TYPE='radio' NAME='calStyle' VALUE='us'" +
((calStartDOW == 0)? " CHECKED " : " ") +
" onClick='document.newCal.startOn.value=\"0\"; " +
"document.newCal.submit();'> " +
"" +
"Euro <INPUT TYPE='radio' NAME='calStyle' VALUE='euro'" +
((calStartDOW == 1)? " CHECKED " : " ") +
" onClick='document.newCal.startOn.value=\"1\"; " +
"submit();'></SMALL>";
document.write(calStyleString);
document.write("</FORM>");
}
newCalendars();
// End -->
</script>
|