Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 12 of 12
  1. #1
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help with a loop for a calendar



    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.

    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

  • #2
    Regular Coder
    Join Date
    Feb 2005
    Posts
    400
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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:
    Code:
    <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>

  • #3
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up

    Thanks! Exactly what I wanted to do but done right

  • #4
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Okay another question on this... how would I go about highlighting the days that are in between the start date and end date?

    Code:
    <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

  • #5
    Regular Coder
    Join Date
    Feb 2005
    Posts
    400
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    <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>

  • #6
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks! I'm getting it now

  • #7
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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...

    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

  • #8
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    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

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

  • #9
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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

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

  • #10
    Regular Coder
    Join Date
    Feb 2005
    Posts
    400
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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.

  • #11
    Regular Coder
    Join Date
    Feb 2005
    Posts
    400
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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.
    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">
    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>

  • #12
    New Coder
    Join Date
    Apr 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •