T
Tom Meerstad
Hello,
I am using a calender which begins with a sunday, but I would like it
to begin with monday.
The author's mail address isn't working (mail got bounced) so I'm
really hoping anyone here can help me out on this..
This is the code in the HEAD of the HTML document (quite long):
========================
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Nick Korosi ([email protected]) -->
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Begin
var dDate = new Date();
var dCurMonth = dDate.getMonth();
var dCurDayOfMonth = dDate.getDate();
var dCurYear = dDate.getFullYear();
var objPrevElement = new Object();
function fToggleColor(myElement) {
var toggleColor = "#ff0000";
if (myElement.id == "calDateText") {
if (myElement.color == toggleColor) {
myElement.color = "";
} else {
myElement.color = toggleColor;
}
} else if (myElement.id == "calCell") {
for (var i in myElement.children) {
if (myElement.children.id == "calDateText") {
if (myElement.children.color == toggleColor) {
myElement.children.color = "";
} else {
myElement.children.color = toggleColor;
}
}
}
}
}
function fSetSelectedDay(myElement){
if (myElement.id == "calCell") {
if (!isNaN(parseInt(myElement.children["calDateText"].innerText))) {
myElement.bgColor = "#c0c0c0";
objPrevElement.bgColor = "";
document.all.calSelectedDate.value =
parseInt(myElement.children["calDateText"].innerText);
objPrevElement = myElement;
parent.content.location.href='comp/' +
document.all.calSelectedDate.value + '-' +
document.all.tbSelMonth.value + '-' +
document.all.tbSelYear.value.substr(2,2) + '.html';
}
}
}
function fGetDaysInMonth(iMonth, iYear) {
var dPrevDate = new Date(iYear, iMonth, 0);
return dPrevDate.getDate();
}
function fBuildCal(iYear, iMonth, iDayStyle) {
var aMonth = new Array();
aMonth[0] = new Array(7);
aMonth[1] = new Array(7);
aMonth[2] = new Array(7);
aMonth[3] = new Array(7);
aMonth[4] = new Array(7);
aMonth[5] = new Array(7);
aMonth[6] = new Array(7);
var dCalDate = new Date(iYear, iMonth-1, 1);
var iDayOfFirst = dCalDate.getDay();
var iDaysInMonth = fGetDaysInMonth(iMonth, iYear);
var iVarDate = 1;
var i, d, w;
if (iDayStyle == 2) {
aMonth[0][0] = "zondag";
aMonth[0][1] = "maandag";
aMonth[0][2] = "dinsdag";
aMonth[0][3] = "woensdag";
aMonth[0][4] = "donderdag";
aMonth[0][5] = "vrijdag";
aMonth[0][6] = "zaterdag";
} else if (iDayStyle == 1) {
aMonth[0][0] = "zon";
aMonth[0][1] = "maa";
aMonth[0][2] = "din";
aMonth[0][3] = "woe";
aMonth[0][4] = "don";
aMonth[0][5] = "vry";
aMonth[0][6] = "zat";
} else {
aMonth[0][0] = "zo";
aMonth[0][1] = "ma";
aMonth[0][2] = "di";
aMonth[0][3] = "wo";
aMonth[0][4] = "do";
aMonth[0][5] = "vr";
aMonth[0][6] = "za";
}
for (d = iDayOfFirst; d < 7; d++) {
aMonth[1][d] = iVarDate;
iVarDate++;
}
for (w = 2; w < 7; w++) {
for (d = 0; d < 7; d++) {
if (iVarDate <= iDaysInMonth) {
aMonth[w][d] = iVarDate;
iVarDate++;
}
}
}
return aMonth;
}
function fDrawCal(iYear, iMonth, iCellWidth, iCellHeight,
sDateTextSize, sDateTextWeight, iDayStyle) {
var myMonth;
myMonth = fBuildCal(iYear, iMonth, iDayStyle);
document.write("<table border='0' cellpadding='1' cellspacing='1'>")
document.write("<tr>");
document.write("<td align='center'><b>" + myMonth[0][0] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][1] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][2] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][3] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][4] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][5] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][6] +
"</b></td>");
document.write("</tr>");
for (w = 1; w < 7; w++) {
document.write("<tr>")
for (d = 0; d < 7; d++) {
document.write("<td align='center' bgcolor='#FFFFFF' valign='top'
id=calCell style='CURSOR:Hand' onMouseOver='fToggleColor(this)'
onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>");
if (!isNaN(myMonth[w][d])) {
document.write("<font id=calDateText
onMouseOver='fToggleColor(this)' onMouseOut='fToggleColor(this)'
onclick=fSetSelectedDay(this)>" + myMonth[w][d] + "</font>");
} else {
document.write("<font id=calDateText
onMouseOver='fToggleColor(this)' onMouseOut='fToggleColor(this)'
onclick=fSetSelectedDay(this)> </font>");
}
document.write("</td>")
}
document.write("</tr>");
}
document.write("</table>")
}
function fUpdateCal(iYear, iMonth) {
myMonth = fBuildCal(iYear, iMonth);
objPrevElement.bgColor = "";
document.all.calSelectedDate.value = "";
for (w = 1; w < 7; w++) {
for (d = 0; d < 7; d++) {
if (!isNaN(myMonth[w][d])) {
calDateText[((7*w)+d)-7].innerText = myMonth[w][d];
} else {
calDateText[((7*w)+d)-7].innerText = " ";
}
}
}
}
// End -->
</SCRIPT>
========================
And this is the code used in the BODY of the HTML document :
========================
<script language="JavaScript" for=window event=onload>
<!-- Begin
var dCurDate = new Date();
frmCalendarSample.tbSelMonth.options[dCurDate.getMonth()].selected =
true;
for (i = 0; i < frmCalendarSample.tbSelYear.length; i++)
if (frmCalendarSample.tbSelYear.options.value ==
dCurDate.getFullYear())
frmCalendarSample.tbSelYear.options.selected = true;
// End -->
</script>
<form name="frmCalendarSample" method="post" action="">
<input type="hidden" name="calSelectedDate" value="">
<table border="1" cellpadding="2" cellspacing="2" width="100%">
<tr bgcolor="#EEEEEE">
<td align="center">
<select style="font-size:9px" name="tbSelMonth"
onchange='fUpdateCal(frmCalendarSample.tbSelYear.value,
frmCalendarSample.tbSelMonth.value)'>
<option value="1">januari</option>
<option value="2">februari</option>
<option value="3">maart</option>
<option value="4">april</option>
<option value="5">mei</option>
<option value="6">juni</option>
<option value="7">juli</option>
<option value="8">augustus</option>
<option value="9">september</option>
<option value="10">oktober</option>
<option value="11">november</option>
<option value="12">december</option>
</select>
<select style="font-size:9px" name="tbSelYear"
onchange='fUpdateCal(frmCalendarSample.tbSelYear.value,
frmCalendarSample.tbSelMonth.value)'>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
</select>
</td>
</tr>
<tr>
<td align="center">
<script language="JavaScript">
var dCurDate = new Date();
fDrawCal(dCurDate.getFullYear(), dCurDate.getMonth()+1, 30, 30,
"10px", "bold", 0);
</script>
</td>
</tr>
</table>
</form>
========================
Thanks!
Best regards,
Tom van den Broek
I am using a calender which begins with a sunday, but I would like it
to begin with monday.
The author's mail address isn't working (mail got bounced) so I'm
really hoping anyone here can help me out on this..
This is the code in the HEAD of the HTML document (quite long):
========================
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Nick Korosi ([email protected]) -->
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Begin
var dDate = new Date();
var dCurMonth = dDate.getMonth();
var dCurDayOfMonth = dDate.getDate();
var dCurYear = dDate.getFullYear();
var objPrevElement = new Object();
function fToggleColor(myElement) {
var toggleColor = "#ff0000";
if (myElement.id == "calDateText") {
if (myElement.color == toggleColor) {
myElement.color = "";
} else {
myElement.color = toggleColor;
}
} else if (myElement.id == "calCell") {
for (var i in myElement.children) {
if (myElement.children.id == "calDateText") {
if (myElement.children.color == toggleColor) {
myElement.children.color = "";
} else {
myElement.children.color = toggleColor;
}
}
}
}
}
function fSetSelectedDay(myElement){
if (myElement.id == "calCell") {
if (!isNaN(parseInt(myElement.children["calDateText"].innerText))) {
myElement.bgColor = "#c0c0c0";
objPrevElement.bgColor = "";
document.all.calSelectedDate.value =
parseInt(myElement.children["calDateText"].innerText);
objPrevElement = myElement;
parent.content.location.href='comp/' +
document.all.calSelectedDate.value + '-' +
document.all.tbSelMonth.value + '-' +
document.all.tbSelYear.value.substr(2,2) + '.html';
}
}
}
function fGetDaysInMonth(iMonth, iYear) {
var dPrevDate = new Date(iYear, iMonth, 0);
return dPrevDate.getDate();
}
function fBuildCal(iYear, iMonth, iDayStyle) {
var aMonth = new Array();
aMonth[0] = new Array(7);
aMonth[1] = new Array(7);
aMonth[2] = new Array(7);
aMonth[3] = new Array(7);
aMonth[4] = new Array(7);
aMonth[5] = new Array(7);
aMonth[6] = new Array(7);
var dCalDate = new Date(iYear, iMonth-1, 1);
var iDayOfFirst = dCalDate.getDay();
var iDaysInMonth = fGetDaysInMonth(iMonth, iYear);
var iVarDate = 1;
var i, d, w;
if (iDayStyle == 2) {
aMonth[0][0] = "zondag";
aMonth[0][1] = "maandag";
aMonth[0][2] = "dinsdag";
aMonth[0][3] = "woensdag";
aMonth[0][4] = "donderdag";
aMonth[0][5] = "vrijdag";
aMonth[0][6] = "zaterdag";
} else if (iDayStyle == 1) {
aMonth[0][0] = "zon";
aMonth[0][1] = "maa";
aMonth[0][2] = "din";
aMonth[0][3] = "woe";
aMonth[0][4] = "don";
aMonth[0][5] = "vry";
aMonth[0][6] = "zat";
} else {
aMonth[0][0] = "zo";
aMonth[0][1] = "ma";
aMonth[0][2] = "di";
aMonth[0][3] = "wo";
aMonth[0][4] = "do";
aMonth[0][5] = "vr";
aMonth[0][6] = "za";
}
for (d = iDayOfFirst; d < 7; d++) {
aMonth[1][d] = iVarDate;
iVarDate++;
}
for (w = 2; w < 7; w++) {
for (d = 0; d < 7; d++) {
if (iVarDate <= iDaysInMonth) {
aMonth[w][d] = iVarDate;
iVarDate++;
}
}
}
return aMonth;
}
function fDrawCal(iYear, iMonth, iCellWidth, iCellHeight,
sDateTextSize, sDateTextWeight, iDayStyle) {
var myMonth;
myMonth = fBuildCal(iYear, iMonth, iDayStyle);
document.write("<table border='0' cellpadding='1' cellspacing='1'>")
document.write("<tr>");
document.write("<td align='center'><b>" + myMonth[0][0] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][1] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][2] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][3] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][4] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][5] +
"</b></td>");
document.write("<td align='center'><b>" + myMonth[0][6] +
"</b></td>");
document.write("</tr>");
for (w = 1; w < 7; w++) {
document.write("<tr>")
for (d = 0; d < 7; d++) {
document.write("<td align='center' bgcolor='#FFFFFF' valign='top'
id=calCell style='CURSOR:Hand' onMouseOver='fToggleColor(this)'
onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>");
if (!isNaN(myMonth[w][d])) {
document.write("<font id=calDateText
onMouseOver='fToggleColor(this)' onMouseOut='fToggleColor(this)'
onclick=fSetSelectedDay(this)>" + myMonth[w][d] + "</font>");
} else {
document.write("<font id=calDateText
onMouseOver='fToggleColor(this)' onMouseOut='fToggleColor(this)'
onclick=fSetSelectedDay(this)> </font>");
}
document.write("</td>")
}
document.write("</tr>");
}
document.write("</table>")
}
function fUpdateCal(iYear, iMonth) {
myMonth = fBuildCal(iYear, iMonth);
objPrevElement.bgColor = "";
document.all.calSelectedDate.value = "";
for (w = 1; w < 7; w++) {
for (d = 0; d < 7; d++) {
if (!isNaN(myMonth[w][d])) {
calDateText[((7*w)+d)-7].innerText = myMonth[w][d];
} else {
calDateText[((7*w)+d)-7].innerText = " ";
}
}
}
}
// End -->
</SCRIPT>
========================
And this is the code used in the BODY of the HTML document :
========================
<script language="JavaScript" for=window event=onload>
<!-- Begin
var dCurDate = new Date();
frmCalendarSample.tbSelMonth.options[dCurDate.getMonth()].selected =
true;
for (i = 0; i < frmCalendarSample.tbSelYear.length; i++)
if (frmCalendarSample.tbSelYear.options.value ==
dCurDate.getFullYear())
frmCalendarSample.tbSelYear.options.selected = true;
// End -->
</script>
<form name="frmCalendarSample" method="post" action="">
<input type="hidden" name="calSelectedDate" value="">
<table border="1" cellpadding="2" cellspacing="2" width="100%">
<tr bgcolor="#EEEEEE">
<td align="center">
<select style="font-size:9px" name="tbSelMonth"
onchange='fUpdateCal(frmCalendarSample.tbSelYear.value,
frmCalendarSample.tbSelMonth.value)'>
<option value="1">januari</option>
<option value="2">februari</option>
<option value="3">maart</option>
<option value="4">april</option>
<option value="5">mei</option>
<option value="6">juni</option>
<option value="7">juli</option>
<option value="8">augustus</option>
<option value="9">september</option>
<option value="10">oktober</option>
<option value="11">november</option>
<option value="12">december</option>
</select>
<select style="font-size:9px" name="tbSelYear"
onchange='fUpdateCal(frmCalendarSample.tbSelYear.value,
frmCalendarSample.tbSelMonth.value)'>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
</select>
</td>
</tr>
<tr>
<td align="center">
<script language="JavaScript">
var dCurDate = new Date();
fDrawCal(dCurDate.getFullYear(), dCurDate.getMonth()+1, 30, 30,
"10px", "bold", 0);
</script>
</td>
</tr>
</table>
</form>
========================
Thanks!
Best regards,
Tom van den Broek