...

View Full Version : Help with a loop for a calendar



Serynu
04-11-2005, 06:00 PM
:confused:

Alright I am unsure on how I would go about highlighting every other day or every three days on a monthly calendar, I want it to do this no matter what month it is on...here is the code.


<html>
<head>
<style>
input.hidden
{
border-width:0;
color: red;
background: white;
}
</style>
<script>
function getCalendarForMonth(month, year){
var dayOfWeekArray = new Array("S", "M", "T", "W",
"T", "F", "S")
var monthArray = new Array("January", "February",
"March", "April", "May", "June",
"July", "August", "September",
"October", "November", "December")
var noDaysArray = new Array(31, 28, 31, 30, 31, 30,
31, 31, 30, 31, 30, 31)
var firstOfMonth = new Date(month + "/1/" + year )
var day = - firstOfMonth.getDay()

// determine number of days in month
var noDays = noDaysArray[month-1]
if (month == 2){
if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
noDays = 29
}
}

//fabricate string for tables
var strMonth = "<TABLE border=0 cellpadding=0 cellspacing=1>"
strMonth += "<TR><TD align='center'>"
strMonth += "<FONT face='Arial' size=2>"
strMonth += monthArray[month-1] + " " + year
strMonth += "</FONT></TD><TR><TD>"
strMonth += "<TABLE border=1 cellpadding=3 cellspacing=0>"
strMonth += "</TR><TR bgcolor='#CCFFFF' align='center'>"
for(var i = 0; i<=6; i++){
strMonth += "<TD width=15><FONT face='arial' size=1>"
strMonth += dayOfWeekArray[i] + "</FONT></TD>"
}
strMonth += "</TR><TR align='right'>"

//fabricate first week of month
for (i = 0; i <= 6; i++){
strMonth += "<TD width=15><FONT face='arial' size=1>"
day++
if(day > 0){
strMonth += day
}
else{
strMonth += "&nbsp"
}
strMonth += "</FONT></TD>"
}

//fabricate remaining weeks
for(var j=1; j < 6; j++){
strMonth += "</TR><TR align='right'>"
for (i = 0; i <= 6; i++){
strMonth += "<TD><FONT face='arial' size=1>"
day++
if(day <= noDays){
strMonth += day
}
else{
strMonth += "&nbsp"
}
strMonth += "</FONT></TD>"
}
if (day >= noDays){
break;
}
}
strMonth += "</TR></TABLE>"
strMonth += "</TD></TR></TABLE>"

return strMonth
}


//-->
</SCRIPT></head>
<body>

<SCRIPT language="JavaScript">
<!--
var today = new Date()
var curMonth = today.getMonth()+1
var curYear = today.getYear()
if(curYear < 1000){
curYear += 1900
}
document.write (getCalendarForMonth(curMonth, curYear))
//-->
</SCRIPT>


</body>
</html>

...James

Harry Armadillo
04-11-2005, 07:43 PM
When you are adding the date-number the calendar, test it (and the month, or year, day, whatever) and add a style class to the td.

Like so:
<html>
<head>
<style>
input.hidden {
border-width:0;
color: red;
background: white;
}

.third{
color:#88F;
font-size:8px;
text-decoration:underline;
}
.friday{
background:#faa;
font:9px arial;
}
.normal{
background:white;
font:9px arial;
width:16px;
}
</style>
<script>

function getCalendarForMonth(month, year){
var dayOfWeekArray = new Array("S", "M", "T", "W","T", "F", "S")
var monthArray = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December")
var noDaysArray = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31)
var firstOfMonth = new Date(month + "/1/" + year)
var day = - firstOfMonth.getDay()

// determine number of days in month
var noDays = noDaysArray[month-1]
if (month == 2){
if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
noDays = 29
}
}

//fabricate string for tables
var strMonth = "<TABLE border=0 cellpadding=0 cellspacing=1>"
strMonth += "<TR><TD align='center'>"
strMonth += "<FONT face='Arial' size=2>"
strMonth += monthArray[month-1] + " " + year
strMonth += "</FONT></TD><TR><TD>"
strMonth += "<TABLE border=1 cellpadding=3 cellspacing=0>"
strMonth += "</TR><TR bgcolor='#CCFFFF' align='center'>"
for(var i = 0; i<=6; i++){
strMonth += "<TD width=15><FONT face='arial' size=1>"
strMonth += dayOfWeekArray[i] + "</FONT></TD>"
}

//fabricate weeks
for(var j=0; j < 6; j++){
strMonth += "</tr><TR align='right'>"
for (i = 0; i <= 6; i++){
strMonth += "<TD class='"
day++

if(day>0 && day <= noDays){

if(i==5)
strMonth +="friday";
else if(day%3==0)
strMonth +="third";
else
strMonth +="normal";

strMonth+="'>"+day;
}
else{
strMonth += "'>&nbsp"
}
strMonth += "</TD>"
}
strMonth
if (day >= noDays){
break;
}
}
strMonth += "</TR></TABLE>"
strMonth += "</TD></TR></TABLE>"

return strMonth
}


</SCRIPT></head>
<body>
<SCRIPT language="JavaScript">
var today = new Date()
var curMonth = today.getMonth()+1
var curYear = today.getYear()
if(curYear < 1000){
curYear += 1900
}
document.write (getCalendarForMonth(curMonth, curYear))
document.write (getCalendarForMonth(curMonth+1, curYear))
document.write (getCalendarForMonth(curMonth+2, curYear))
document.write (getCalendarForMonth(curMonth-1, curYear+3))
</SCRIPT>


</body>
</html>

Serynu
04-11-2005, 08:00 PM
Thanks! Exactly what I wanted to do but done right :D

Serynu
04-12-2005, 10:43 PM
Okay another question on this... how would I go about highlighting the days that are in between the start date and end date?


<html>
<head>
<style>
input.hidden {
border-width:0;
color: red;
background: white;
}

.third{
color:#88F;
font-size:16 px;
text-decoration:underline;
}
.normal{
background:white;
font:16 px ;
width:16px;
}
</style>
<script>

function getCalendarForMonth(month, year){
var dayOfWeekArray = new Array("S", "M", "T", "W","T", "F", "S")
var monthArray = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December")
var noDaysArray = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31)
var firstOfMonth = new Date(month + "/1/" + year)
var day = - firstOfMonth.getDay()

// determine number of days in month
var noDays = noDaysArray[month-1]
if (month == 2){
if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
noDays = 29
}
}

//fabricate string for tables
var strMonth = "<TABLE border=0 cellpadding=0 cellspacing=1>"
strMonth += "<TR><TD align='center'>"
strMonth += "<FONT face='Arial' size=6px>"
strMonth += monthArray[month-1] + " " + year
strMonth += "</FONT></TD><TR><TD>"
strMonth += "<TABLE border=1 cellpadding=3 cellspacing=0>"
strMonth += "</TR><TR bgcolor='#CCFFFF' align='center'>"
for(var i = 0; i<=6; i++){
strMonth += "<TD width=15><FONT face='arial' size=4px>"
strMonth += dayOfWeekArray[i] + "</FONT></TD>"
}


//fabricate weeks
for(var j=0; j < 6; j++){
strMonth += "</tr><TR align='right'>"
for (i = 0; i <= 6; i++){
strMonth += "<TD class='"
day++
if(day>0 && day <= noDays)
{
if(day%3==0)
strMonth +="third";
else
strMonth +="normal";

strMonth+="'>"+day;
}
else{
strMonth += "'>&nbsp"
}
strMonth += "</TD>"
}
strMonth
if (day >= noDays){
break;
}
}
strMonth += "</TR></TABLE>"
strMonth += "</TD></TR></TABLE>"

return strMonth
}

function isValidDate(dateStr) {
// Checks for the following valid date formats:
// MM/DD/YY MM/DD/YYYY MM-DD-YY MM-DD-YYYY
var datePat = /^(\d{1,2})(\/|-)(\d{1,2})\2(\d{4})$/; // requires 4 digit year

var matchArray = dateStr.match(datePat); // is the format ok?
if (matchArray == null) {
alert(dateStr + " Date is not in a valid format.")
return false;
}
month = matchArray[1]; // parse date into variables
day = matchArray[3];
year = matchArray[4];
if (month < 1 || month > 12) { // check month range
alert("Month must be between 1 and 12.");
return false;
}
if (day < 1 || day > 31) {
alert("Day must be between 1 and 31.");
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31) {
alert("Month "+month+" doesn't have 31 days!")
return false;
}
if (month == 2) { // check for february 29th
var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
if (day>29 || (day==29 && !isleap)) {
alert("February " + year + " doesn't have " + day + " days!");
return false;
}
}
return true;
}

function dateDiff(dateform) {
date1 = new Date();
date2 = new Date();
diff = new Date();

if (isValidDate(dateform.firstdate.value)) { // Validates first date
date1temp = new Date(dateform.firstdate.value);
date1.setTime(date1temp.getTime());
}
else return false; // otherwise exits

if (isValidDate(dateform.seconddate.value)) { // Validates second date
date2temp = new Date(dateform.seconddate.value);
date2.setTime(date2temp.getTime());
}
else return false; // otherwise exits

// sets difference date to difference of first date and second date

diff.setTime(Math.abs(date1.getTime() - date2.getTime()));

timediff = diff.getTime();

days = Math.floor(timediff / (1000 * 60 * 60 * 24));
timediff -= days * (1000 * 60 * 60 * 24);
dateform.difference.value = + days + " days ";

return false; // form should never submit, returns false
}
// End -->

</script>
<script language="javascript" src="../Script/codethatcalendarstd.js"></script>
<script language="javascript" src="box_ex.js"></script>
<script language="javascript">
var c2 = new CodeThatCalendar(caldef2);

</script>
</head>
<body>
<form onSubmit="return dateDiff(this);">
<table>
<tr><td>
<pre>
First Date:<input type="text"name="firstdate" value="04/15/2005"><input type="button" onClick="c2.popup('firstdate');" value="..."/>

Second Date:<input type="text" name="seconddate" value="05/15/2005"><input type="button" onClick="c2.popup('seconddate');" value="..."/>

<center><input type=submit value="Calculate Difference!" >

Date Difference:<br>
<input type=text name=difference value="0" size=60>
</center>
</pre>
</td></tr>
</table>

<SCRIPT language="JavaScript">

var today = new Date()
var curMonth = today.getMonth()+1
var curYear = today.getYear()
if(curYear < 1000){
curYear += 1900
}
document.write (getCalendarForMonth(curMonth, curYear))
document.write (getCalendarForMonth(curMonth+1, curYear))
document.write (getCalendarForMonth(curMonth+2, curYear))
document.write (getCalendarForMonth(curMonth+3, curYear))
document.write (getCalendarForMonth(curMonth+4, curYear))
document.write (getCalendarForMonth(curMonth+5, curYear))
</SCRIPT>
</form>
</body>
</html>

...James

Harry Armadillo
04-12-2005, 11:14 PM
<html>
<head>
<style>
input.hidden {
border-width:0;
color: red;
background: white;
}

.third{
color:#88F;
font-size:16 px;
text-decoration:underline;
}
.normal{
background:white;
font:16 px ;
width:16px;
}
</style>
<script>

function getCalendarForMonth(month, year, start_date, end_date){
var dayOfWeekArray = new Array("S", "M", "T", "W","T", "F", "S")
var monthArray = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December")
var noDaysArray = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31)
var firstOfMonth = new Date(month + "/1/" + year)
var day = - firstOfMonth.getDay()

// determine number of days in month
var noDays = noDaysArray[month-1]
if (month == 2){
if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
noDays = 29
}
}

//fabricate string for tables
var strMonth = "<TABLE border=0 cellpadding=0 cellspacing=1>"
strMonth += "<TR><TD align='center'>"
strMonth += "<FONT face='Arial' size=6px>"
strMonth += monthArray[month-1] + " " + year
strMonth += "</FONT></TD><TR><TD>"
strMonth += "<TABLE border=1 cellpadding=3 cellspacing=0>"
strMonth += "</TR><TR bgcolor='#CCFFFF' align='center'>"
for(var i = 0; i<=6; i++){
strMonth += "<TD width=15><FONT face='arial' size=4px>"
strMonth += dayOfWeekArray[i] + "</FONT></TD>"
}


//fabricate weeks
for(var j=0; j < 6; j++){
strMonth += "</tr><TR align='right'>"
for (i = 0; i <= 6; i++){
strMonth += "<TD class='"
day++
if(day>0 && day <= noDays){
if(start_date && end_date && day>=start_date && day <= end_date)
strMonth +="third";
else
strMonth +="normal";

strMonth+="'>"+day;
}
else{
strMonth += "'>&nbsp"
}
strMonth += "</TD>"
}
strMonth
if (day >= noDays){
break;
}
}
strMonth += "</TR></TABLE>"
strMonth += "</TD></TR></TABLE>"

return strMonth
}

function isValidDate(dateStr) {
// Checks for the following valid date formats:
// MM/DD/YY MM/DD/YYYY MM-DD-YY MM-DD-YYYY
var datePat = /^(\d{1,2})(\/|-)(\d{1,2})\2(\d{4})$/; // requires 4 digit year

var matchArray = dateStr.match(datePat); // is the format ok?
if (matchArray == null) {
alert(dateStr + " Date is not in a valid format.")
return false;
}
month = matchArray[1]; // parse date into variables
day = matchArray[3];
year = matchArray[4];
if (month < 1 || month > 12) { // check month range
alert("Month must be between 1 and 12.");
return false;
}
if (day < 1 || day > 31) {
alert("Day must be between 1 and 31.");
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31) {
alert("Month "+month+" doesn't have 31 days!")
return false;
}
if (month == 2) { // check for february 29th
var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
if (day>29 || (day==29 && !isleap)) {
alert("February " + year + " doesn't have " + day + " days!");
return false;
}
}
return true;
}

function dateDiff(dateform) {
date1 = new Date();
date2 = new Date();
diff = new Date();

if (isValidDate(dateform.firstdate.value)) { // Validates first date
date1temp = new Date(dateform.firstdate.value);
date1.setTime(date1temp.getTime());
}
else return false; // otherwise exits

if (isValidDate(dateform.seconddate.value)) { // Validates second date
date2temp = new Date(dateform.seconddate.value);
date2.setTime(date2temp.getTime());
}
else return false; // otherwise exits

// sets difference date to difference of first date and second date

diff.setTime(Math.abs(date1.getTime() - date2.getTime()));

timediff = diff.getTime();

days = Math.floor(timediff / (1000 * 60 * 60 * 24));
timediff -= days * (1000 * 60 * 60 * 24);
dateform.difference.value = + days + " days ";

return false; // form should never submit, returns false
}
// End -->

</script>
<script language="javascript" src="../Script/codethatcalendarstd.js"></script>
<script language="javascript" src="box_ex.js"></script>
<script language="javascript">
var c2 = new CodeThatCalendar(caldef2);

</script>
</head>
<body>
<form onSubmit="return dateDiff(this);">
<table>
<tr><td>
<pre>
First Date:<input type="text"name="firstdate" value="04/15/2005"><input type="button" onClick="c2.popup('firstdate');" value="..."/>

Second Date:<input type="text" name="seconddate" value="05/15/2005"><input type="button" onClick="c2.popup('seconddate');" value="..."/>

<center><input type=submit value="Calculate Difference!" >

Date Difference:<br>
<input type=text name=difference value="0" size=60>
</center>
</pre>
</td></tr>
</table>

<SCRIPT language="JavaScript">

var today = new Date()
var curMonth = today.getMonth()+1
var curYear = today.getYear()
if(curYear < 1000){
curYear += 1900
}
document.write (getCalendarForMonth(curMonth, curYear,10,15))
document.write (getCalendarForMonth(curMonth+1, curYear))
document.write (getCalendarForMonth(curMonth+2, curYear,1,2))
document.write (getCalendarForMonth(curMonth+3, curYear,28,30))
document.write (getCalendarForMonth(curMonth+4, curYear))
document.write (getCalendarForMonth(curMonth+5, curYear))
</SCRIPT>
</form>
</body>
</html>

Serynu
04-13-2005, 03:01 AM
:thumbsup: Thanks! I'm getting it now

Serynu
04-14-2005, 08:40 PM
I have another one for you all...I've been trying to highlight just every other day in between the start and end date...Now the part where it is'nt working is when you have a month with 31 days like October it highlights day 31 BUT it also highlights day 1 for November...when it should pick up at day 2 :(

Here is thee code...


<html>
<head>
<style>
input.hidden {
border-width:0;
color: red;
background: white;
}
.marker{
color:#88F;
font-size:20 px;
text-decoration:underline;
}
.normal{
background:white;
font:20 px ;
width:20px;
}
</style>
<SCRIPT language="javascript" type="text/javascript">

function getCalendarForMonth(month, year, start_date, end_date){
var dayOfWeekArray = new Array("S", "M", "T", "W","T", "F", "S")
var monthArray = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December")
var noDaysArray = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31)
var firstOfMonth = new Date(month + "/1/" + year)
var day = - firstOfMonth.getDay()

// determine number of days in month
var noDays = noDaysArray[month-1]
if (month == 2){
if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
noDays = 29
}
}

//fabricate string for tables
var strMonth = "<TABLE border=0 cellpadding=0 cellspacing=1>"
strMonth += "<TR><TD align='center'>"
strMonth += "<FONT face='Arial' size=5px>"
strMonth += monthArray[month-1] + " " + year
strMonth += "</FONT></TD><TR><TD>"
strMonth += "<TABLE border=1 cellpadding=3 cellspacing=0>"
strMonth += "</TR><TR bgcolor='#A0C0E0' align='center'>"
for(var i = 0; i<=6; i++){
strMonth += "<TD width=15><FONT face='arial' size=4px>"
strMonth += dayOfWeekArray[i] + "</FONT></TD>"
}
//fabricate weeks
for(var j=0; j < 6; j++)
{
strMonth += "</tr><TR align='right'>"
for (i = 0; i <= 6; i++)
{
strMonth += "<TD class='"
day++
if(day>0 && day <= noDays)
{
if(start_date && end_date && day >= start_date && day <= end_date)
strMonth +="marker";
else
strMonth +="normal";
strMonth +="'>"+day;
}
else
{
strMonth += "'>&nbsp"
}
strMonth += "</TD>"
}
strMonth
if (day >= noDays)
{
break;
}
}
strMonth += "</TR></TABLE>"
strMonth += "</TD></TR></TABLE>"
return strMonth
}
</script>
</head>
<body>
<form name="Dates">
<table cellpadding="10">
<tr><td>
Starting Day:<input name="StartDay" value="9" size="2">
Starting Month:<input name="StartMonth" value="9" size="2">
</td></tr>
<tr><td>
Ending Day:<input name="EndDay" value="12" size="2">
Ending Month:<input name="EndMonth" value="2" size="2">
</td>
<TD colspan="2"> <select name="Times" tabindex="-1">
<option value="1" disabled>Select</option>
<option value="2">ED</option>
<option value="3">EOD</option>
<option value="4">2 X Week</option>
</select> </TD>
</tr>
</table>
<SCRIPT language="javascript" type="text/javascript">
var StartDay = document.Dates.StartDay.value;
var StartMonth = document.Dates.StartMonth.value;
var EndDay = document.Dates.EndDay.value;
var EndMonth = document.Dates.EndMonth.value;

var MonthDays = new Array(12);
MonthDays[1] = 31;
MonthDays[2] = 28;
MonthDays[3] =31;
MonthDays[4] =30;
MonthDays[5] =31;
MonthDays[6] =30;
MonthDays[7] =31;
MonthDays[8] =31;
MonthDays[9] =30;
MonthDays[10] =31;
MonthDays[11] =30;
MonthDays[12] =31;

var today = new Date()
var curMonth = today.getMonth()+1
var Diff = StartMonth - curMonth;

var curYear = today.getFullYear()
var curYearOne = today.getFullYear()
var curYearTwo = today.getFullYear()
var curYearThree = today.getFullYear()
var curYearFour = today.getFullYear()
var curYearFive = today.getFullYear()

var MonthStar = curMonth+Diff;
var MonthStarOne = curMonth+Diff+1;
var MonthStarTwo = curMonth+Diff+2;
var MonthStarThree = curMonth+Diff+3;
var MonthStarFour = curMonth+Diff+4;
var MonthStarFive = curMonth+Diff+5;

<!-- Roll Over the Year if Needed -->
var MonthOver = new Array(5);
MonthOver[13] = 1;
MonthOver[14] = 2;
MonthOver[15] = 3;
MonthOver[16] = 4;
MonthOver[17] = 5;
if(MonthStarOne==13 || MonthStarOne==14 || MonthStarOne==15 || MonthStarOne==16 || MonthStarOne==17)
{
MonthStarOne = MonthOver[MonthStarOne];
curYearOne = today.getFullYear()+1
}
if(MonthStarTwo==13 || MonthStarTwo==14 || MonthStarTwo==15 || MonthStarTwo==16 || MonthStarTwo==17)
{
MonthStarTwo = MonthOver[MonthStarTwo];
curYearTwo = today.getFullYear()+1
}
if(MonthStarThree==13 || MonthStarThree==14 || MonthStarThree==15 || MonthStarThree==16 || MonthStarThree==17)
{
MonthStarThree = MonthOver[MonthStarThree];
curYearThree = today.getFullYear()+1
}
if(MonthStarFour==13 || MonthStarFour==14 || MonthStarFour==15 || MonthStarFour==16 || MonthStarFour==17)
{
MonthStarFour = MonthOver[MonthStarFour];
curYearFour = today.getFullYear()+1
}
if(MonthStarFive==13 || MonthStarFive==14 || MonthStarFive==15 || MonthStarFive==16 || MonthStarFive==17)
{
MonthStarFive = MonthOver[MonthStarFive];
curYearFive = today.getFullYear()+1
}

<!-- Find Which Month the End Day is in -->
var EndDayStart = MonthDays[MonthStar];
var EndDayOne = MonthDays[MonthStarOne];
var EndDayTwo = MonthDays[MonthStarTwo];
var EndDayThree = MonthDays[MonthStarThree];
var EndDayFour = MonthDays[MonthStarFour];
var EndDayFive = MonthDays[MonthStarFive];

var StartDayOne = "1";
var StartDayTwo = "1";
var StartDayThree = "1";
var StartDayFour = "1";
var StartDayFive = "1";

if(MonthStar == EndMonth)
{
EndDayStart = EndDay;
StartDayOne = 0;
StartDayTwo = 0;
StartDayThree = 0;
StartDayFour = 0;
StartDayFive = 0;
}
if(MonthStarOne == EndMonth)
{
EndDayOne = EndDay;
StartDayTwo = 0;
StartDayThree = 0;
StartDayFour = 0;
StartDayFive = 0;
}
if(MonthStarTwo == EndMonth)
{
EndDayTwo = EndDay;
StartDayThree = 0;
StartDayFour = 0;
StartDayFive = 0;
}
if(MonthStarThree == EndMonth)
{
EndDayThree = EndDay;
StartDayFour = 0;
StartDayFive = 0;
}
if(MonthStarFour == EndMonth)
{
EndDayFour = EndDay;
StartDayFive = 0;
}
if(MonthStarFive == EndMonth)
{
EndDayFive = EndDay;
}

if(curYear < 1000){
curYear += 1900
}
</SCRIPT>
<TABLE cellspacing="10" cellpadding="10">
<TR><TD align="center" valign="top">
<SCRIPT language="javascript" type="text/javascript">
document.write (getCalendarForMonth(MonthStar, curYear, StartDay, EndDayStart))
</SCRIPT>
</TD>
<TD align="center" valign="top">
<SCRIPT language="javascript" type="text/javascript">
document.write (getCalendarForMonth(MonthStarOne, curYearOne, StartDayOne, EndDayOne))
</SCRIPT>
</TD>
<TD align="center" valign="top">
<SCRIPT language="javascript" type="text/javascript">
document.write (getCalendarForMonth(MonthStarTwo, curYearTwo, StartDayTwo, EndDayTwo))
</SCRIPT>
</TD>
</TR>
<TR>
<TD align="center" valign="top">
<SCRIPT language="javascript" type="text/javascript">
document.write (getCalendarForMonth(MonthStarThree, curYearThree, StartDayThree, EndDayThree))
</SCRIPT>
</TD><TD align="center" valign="top">
<SCRIPT language="javascript" type="text/javascript">
document.write (getCalendarForMonth(MonthStarFour, curYearFour, StartDayFour, EndDayFour))
</SCRIPT>
</TD><TD align="center" valign="top">
<SCRIPT language="javascript" type="text/javascript">
document.write (getCalendarForMonth(MonthStarFive, curYearFive, StartDayFive, EndDayFive))
</SCRIPT>
</TD>
</TR>
</TABLE>
</form>
</body>
</html>

...James

Serynu
04-15-2005, 04:17 PM
I think I'm on the right track I just need help figuring out how to set id's just for the days that get set with the marker class? I can set it for all the days but can't figure out how to set the id just for the days marked...here is a what I modified above...help please :D


{
if(start_date && end_date && day >= start_date && day <= end_date)
strMonth +="marker";
else
strMonth +="normal";
strMonth +="' id=\"Cycle\" >"+day;
}

Serynu
04-15-2005, 04:34 PM
I figured the id part out here it is...moved the ' from my last strMonth to behind the class name so I could continue the str :p



{
if(start_date && end_date && day >= start_date && day <= end_date)
strMonth +="marker' id='cycle'onmouseover=\"this.className='test'\"";
else
strMonth +="normal'";
strMonth +=">"+day;
}

Harry Armadillo
04-15-2005, 05:05 PM
I'm a little crunched by real work, so no big example. :(

Include another counter. In getCalendarForMonth(), have it increment each time a date in between the start and end days, but only apply the highlighting if the the counter is also how you want (like counter%2==whatever to check for every-other-day-ness).

See what you can come up with, post back with problems, I should have some spare time in a couple o' days.

Harry Armadillo
04-17-2005, 10:57 PM
Okay, I'd do the everynth day thing like this: add a counter that is only incremented between the start and end dates, then test against that counter and and new argument increment to see whether the date is special or not. By making counter a global variable, it's state remains the same between calls to getCalendarForMonth(), so you don't lose your spacing when crossing month boundaries.
<html>
<head>
<style>
input.hidden {
border-width:0;
color: red;
background: white;
}
.marker{
color:#88F;
font-size:20 px;
text-decoration:underline;
}
.normal{
background:white;
font:20 px ;
width:20px;
}
</style>
<SCRIPT language="javascript" type="text/javascript">
var counter=0;

function getCalendarForMonth(month, year, start_date, end_date, increment){
var dayOfWeekArray = new Array("S", "M", "T", "W","T", "F", "S")
var monthArray = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December")
var noDaysArray = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31)
var firstOfMonth = new Date(month + "/1/" + year)
var day = - firstOfMonth.getDay()

// determine number of days in month
var noDays = noDaysArray[month-1]
if (month == 2){
if((year % 4 == 0 && year % 100 != 0) || year % 400 == 0){
noDays = 29
}
}

//fabricate string for tables
var strMonth = "<TABLE border=0 cellpadding=0 cellspacing=1>"
strMonth += "<TR><TD align='center'>"
strMonth += "<FONT face='Arial' size=5px>"
strMonth += monthArray[month-1] + " " + year
strMonth += "</FONT></TD><TR><TD>"
strMonth += "<TABLE border=1 cellpadding=3 cellspacing=0>"
strMonth += "</TR><TR bgcolor='#A0C0E0' align='center'>"
for(var i = 0; i<=6; i++){
strMonth += "<TD width=15><FONT face='arial' size=4px>"
strMonth += dayOfWeekArray[i] + "</FONT></TD>"
}

//fabricate weeks
for(var j=0; j < 6; j++){
strMonth += "</tr><TR align='right'>"
for (i = 0; i <= 6; i++){
strMonth += "<TD class='"
day++
if(day>0 && day <= noDays){
if(start_date && end_date && day >= start_date && day <= end_date){
if(counter%increment==0){
strMonth +="marker";
}
else{
strMonth +="normal";
}
counter++;
}
else{
strMonth +="normal";
}
strMonth +="'>"+day;
}
else{
strMonth += "'>&nbsp"
}
strMonth += "</TD>"
}
if (day >= noDays){
break;
}
}
strMonth += "</TR></TABLE>"
strMonth += "</TD></TR></TABLE>"
return strMonth
}
</script>
</head>
<body>

<script type="text/javascript">
document.write (getCalendarForMonth(5, 2005, 17, 99, 2));
document.write (getCalendarForMonth(6, 2005, 1, 12, 2));
counter=0; //reset counter before doing non-contiguous highlighting
document.write (getCalendarForMonth(6, 2005, 10, 21, 3));
counter=0;
document.write (getCalendarForMonth(7, 2005, 7, 12, 1));
document.write (getCalendarForMonth(8, 2005, 0,0,0));
</script>
</body>
</html>

Serynu
04-18-2005, 03:59 PM
:thumbsup: Ahh! I was trying to put the increament in the same if statment as the start and end date. This is perfect. I will post my final results once I fine tune it all. thanks again!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum