0byt3m1n1

Path: /home1/aserty/www/bymal.com/campperf/jscripts/calendar/ [ Home ]
File: calendar_body.html
<html>
  <head>
    <title>Calendar</title>
    <style>
body { 
  background-color: #FFFFFF;
}
.calendar {
  position: absolute;
  left: 5px;
  top: 5px;
  width: 400px;
}
.dayofweek { 
  font-size: 13px;
} 
.month { 
  font-size: 13px;
}
.date { 
  width: 10%;
  height: 40px;
  padding-right: 3px;
  text-align: right;
  vertical-align: bottom;
  font-size: 13px;
  font-weight: bold;
  cursor: pointer;
  cursor: hand;
}
.selected { 
  width: 10%;
  height: 40px;
  padding-right: 3px;
  text-align: right;
  vertical-align: bottom;
  font-weight: bold;
  font-size: 13px;
  cursor: pointer;
  cursor: hand;
} 
.empty { 
  width: 10%;
  height: 40px;
} 
a {
  font-weight: bold;
}
form {
  padding: 0px;
  margin: 0px;
}
    </style>
    <script type="text/javascript" language="JavaScript"><!--
// {{{ calendar()

function calendar(month, year) 
{
    var realMonth = parseInt(month) + 1;
    // we need to put in the zero placeholders
    if (realMonth < 10) {
        realMonth = '0' + realMonth;
    }

    var realDate = '';
    var output = '';
       
    firstDay = new Date(year, month, 1);
    startDay = firstDay.getDay();
    weekdayOffset = 0;
    if (parent.calendarStartMonday) {
        if (startDay) {
            startDay--;
        }
        else {
            startDay = 6;
        }

        weekdayOffset++;
    }


    // Determined whether this is a leap year or not
    if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) {
        parent.calendarDays[1] = 29; 
    }
    else {
        parent.calendarDays[1] = 28;
    }

    // we break up the output so it flushes the buffer frequently
    output += '<form><table border="0" cellspacing="0" cellpadding="3" width="100%"><tr><td align="left"><img src="arrows_l_still.gif" id="arrow_left_id" border="0" usemap="#arrow_left_map"></td><td align="center">';
    output += '<select onchange="parent.month=this.options[this.selectedIndex].value; window.location='+"'calendar_body.html'"+';" title="Month Jump">';
    for (month_cnt = 0; month_cnt < 12; month_cnt++) {
        output += '<option value='+month_cnt;
        if (month_cnt == thisMonth) {
            output += ' selected';
        }

        output += '>' + parent.calendarMonths[month_cnt] + '</option>';
    }

    output += '</select> <select onchange="parent.year=this.options[this.selectedIndex].value; window.location='+"'calendar_body.html'"+';" title="Year Jump">';
    for (year_cnt = 1; year_cnt <= 21; year_cnt++) {
        output += '<option value="'+yeararray[year_cnt]+'"';
        if (yeararray[year_cnt] == thisYear) {
            output += ' selected';
        }
        output += '>'+yeararray[year_cnt]+'</option>';
    }

    output += '</select></td>';
    output += '<td align="right"><img src="arrows_r_still.gif" name="arrow_right_id" id="arrow_right_id" border="0" usemap="#arrow_right_map"></td></tr>\n';
    output += '<tr><td colspan="3" valign="top"><table border="0" cellspacing="1" cellpadding="0" width="100%">';
    output += '<tr class="dayofweek" style="background-color: '+calendarColors['headerBgColor']+';">';
    // print out the days of the week
    for (i = weekdayOffset; i < 7 + weekdayOffset; i++) {
        output += '<th style="color: '+calendarColors['headerColor']+';">' + parent.calendarWeekdays[i] + '</th>';
    }

    output += '\n<tr>';

    var column = 0;
    for (i = 0; i < startDay; i++) {
        output += '<td class="empty" style="background-color: '+calendarColors['bgColor']+';">&nbsp</td>';
        column++;
    }

    for (i = 1; i <= parent.calendarDays[month]; i++) {
        realDate = i;
        // add the zero place holder
        if (realDate < 10) {
            realDate = '0' + realDate
        }
	 
        if ((i == parent.currentDay)  && (month == parent.currentMonth) && (year == parent.currentYear)) {
            output += '<td class="selected" style="background-color: '+calendarColors['dateSelectedBgColor']+'; color: '+calendarColors['dateSelectedColor']+';" height="40" onmouseover="colorize(this,1,\'dateSelected\');" onmouseout="colorize(this,0,\'dateSelected\');" onclick="sendDate('+realMonth+', '+realDate+', '+year+');">';
            if(document.layers) {
         output += '<a href="javascript: void(0);" onclick="sendDate('+realMonth+', '+realDate+', '+year+');">'+i+'</a>&nbsp;&nbsp;';
            }
            else {
	        output += '<br />' + i;
            }
	    output += '</td>';
        }
        else {
            output += '<td class="date" style="background-color: '+calendarColors['dateBgColor']+'; color: '+calendarColors['dateColor']+';" height="40" onmouseover="colorize(this,1,\'date\');" onmouseout="colorize(this,0,\'date\');" onclick="sendDate('+realMonth+', '+realDate+', '+year+');">';
            if(document.layers) {
	        output += '<a href="javascript: void(0);" onclick="sendDate('+realMonth+', '+realDate+', '+year+');">'+i+'</a>&nbsp;&nbsp;';
            }
            //put in some line breaks to fill up the cell
	    else {
	        output += '<br />'+i
	    }
            output += '</td>';
        }

        column++;
        // end the week
        if (column == 7) {
            output += '</tr>\n<tr>';
            column = 0;
        }
    }

    for(j = parent.calendarDays[month]; j < 42-startDay; j++) {
        output += '<td class="empty" style="background-color: '+calendarColors['bgColor']+';" height="40">&nbsp</td>';
        column++;
        // end the week
        if (column == 7) {
            output += '</tr>\n<tr>';
            column = 0;
        }
    }
     
    output += '</tr></table></td></tr></table></form>';
     
    return output;
}

// }}}
// {{{ printCalendar()

function printCalendar(whichMonth)
{
    var output = '';

    if (document.layers) {
        var output = '<body link="' + calendarColors['dateColor'] + '" alink="' + calendarColors['dateSelectedColor']+ '"><layer bgcolor="'+calendarColors['bgColor']+'">';
    }
    else {
        var output = '<body><style>select { font-weight: bold; font-size: 12px; }</style><div class="calendar" style="border: 2px solid ' + calendarColors['borderColor'] + '; background-color: '+calendarColors['bgColor']+';">';
    }

    output += calendar(whichMonth,thisYear);
    if (!document.layers) {
        output += '</div>';
    }
    else {
        output += '</layer>';
    }

    output += '<map name="arrow_right_map"><area shape="RECT" coords="1,1,13,17" onmouseover="animate_right(\'arrow_right_id\',1)" onmouseout="animate_right(\'arrow_right_id\',0)" onclick="nextmonth();" href="calendar_body.html" title="Next Month" alt="Next Month"><area shape="RECT" coords="22,1,44,17" onmouseover="animate_right(\'arrow_right_id\',1)" onmouseout="animate_right(\'arrow_right_id\',0)" onclick="yearforward();" href="calendar_body.html" title="Next Year" alt="Next Year"></map><map name="arrow_left_map"><area shape="RECT" coords="1,1,23,17" onmouseover="animate_left(\'arrow_left_id\',1)" onmouseout="animate_left(\'arrow_left_id\',0)" onclick="yearback();" href="calendar_body.html" title="Previous Year" alt="Previous Year"><area shape="RECT" coords="32,1,45,17" onmouseover="animate_left(\'arrow_left_id\',1)" onmouseout="animate_left(\'arrow_left_id\',0)" onclick="previousmonth();" href="calendar_body.html" title="Previous Month" alt="Previous Month"></map>';
    output += '</body>';

    document.open();
    document.write(output);
    document.write();
}

// }}}
// {{{ animate_right() 

function animate_right(imagename,imageswitch) 
{
    if(document.all) {
        imagename = eval("document.all." + imagename)
    }
    else if(document.getElementById) {
        imagename = document.getElementById(imagename)
    }

    if (!document.layers) {
        if (imageswitch == 1) {
            imagename.src = parent.right_anim;
        }
        else {
            imagename.src = parent.right_still;
        }
    }
}

// }}}
// {{{ animate_left()

function animate_left(imagename,imageswitch) 
{
    if (document.all) {
        imagename = eval("document.all." + imagename)
    }
    else if (document.getElementById) {
        imagename = document.getElementById(imagename)
    }
    if (!document.layers) {  
        if (imageswitch == 1) {
          imagename.src = parent.left_anim;
        }
        else {
          imagename.src = parent.left_still;
        }
    }
}

// }}}
// {{{ colorize()

function colorize (which, toggle, type) 
{
    if ((document.all) || (document.getElementById)) {
        if (toggle == 1) { 
            which.style.color = calendarColors['dateHoverColor'];
            which.style.backgroundColor = calendarColors['dateHoverBgColor'];
        }
        else {
            which.style.color = calendarColors[type + 'Color'];
            which.style.backgroundColor = calendarColors[type + 'BgColor'];
        }
    }
}

// }}}
// {{{ yearback()

function yearback() 
{
   parent.year--;
}

// }}}
// {{{ yearforward()

function yearforward() 
{
   parent.year++;
}

// }}}
// {{{ previousmonth()

function previousmonth() 
{
    if (parent.month > 0) {
        parent.month--;
    }
    else {
        parent.month = 11;
        parent.year--;
    }  
}

// }}}
// {{{ nextmonth()

function nextmonth() 
{
    if (parent.month < 11) {
        parent.month++;
    }
    else {
        parent.month = 0;
        parent.year++;
    }
}

// }}}
// {{{ sendDate()

function sendDate(month, day, year) 
{
    // pad with blank zeros numbers under 10
    month = month < 10 ? '0' + month : month;
    day   = day   < 10 ? '0' + day   : day;
    selectedDate = parent.calendarFormat;
    selectedDate = selectedDate.replace(/m/, month);
    selectedDate = selectedDate.replace(/d/, day);
    selectedDate = selectedDate.replace(/y/, year);
    targetDateField.value = selectedDate;
    parent.window.close();
}

// }}}

// grab the color settings from the parent, who has done validition on the variable
var calendarColors = parent.calendarColors;

// get the reference to the target element from the parent, who has done validation on variable
var targetDateField = parent.targetDateField;

var thisDay   = parent.day;
var thisMonth = parent.month;
var thisYear  = parent.year;

var yeararray = new Array();
for (year_cnt = 1; year_cnt <= 21; year_cnt++) {
    yeararray[year_cnt] = thisYear - 1 + year_cnt;
}

printCalendar(thisMonth); 

//--></script>
  </head>
  <body alink="#000000">
  </body>
</html>