Here is the same code after it has gone thru the doughnutalator so that
I can understand it a bit better.
Keep in mind that prior to today I hadn't written any Javascript (in
fact I haven't written any code for over 15 years now).
It still only works in IE.
Given all this, I am not sure that this code helps any of us display a
Google Calendar on a web site but it did clear out a few cobwebs
Regards Doughnut
-----------
------------------------------
<html>
<head>
<title>Calender</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<style type="text/css" >
<!--
.calcaption {
font-family: Arial;
font-size: 12px;
font-weight: bold;
color: #FFFFFF;
background-color: #003399;
border: #003399;
border-style: solid;
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-left-width: 3px;
font-style: normal;
text-transform: none
}
.calender {
background-color: #CCCCCC;
clip: rect( )
}
.calborder {
border: 2px #CCCCCC outset
}
.caldropdowns {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #000000;
background-color: #FFFFFF;
clip: rect( )
}
.calbutts {
font-family: Arial;
font-size: 12px;
font-weight: bold;
color: #000000;
background-color: #CCCCCC;
clip: rect( )
}
.calinsideborder {
border: 2px #CCCCCC inset;
clip: rect( )
}
.caldays {
font-family: Arial;
font-size: 12px;
font-weight: bold;
color: #000000;
background-color: #999999;
text-transform: uppercase
}
.calwknd {
font-family: Arial;
font-size: 12px;
font-weight: bold;
color: #000000;
background-color: #FFFFCC
}
.calwkdy {
font-family: Arial;
font-size: 12px;
font-weight: bold;
color: #000000;
background-color: #FFFFFF
}
.calinsidesettings {
clip: rect( )
}
-->
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
var dhnow = new Date();
var firstyear=dhnow.getYear()-3; //how many years back!
var lastyear=dhnow.getYear()+9; /*1 higher than the years from today
you wish to display*/
var dhday = dhnow.getDate();
var dhmonth = dhnow.getMonth();
var dhyear = dhnow.getYear();
if (dhyear < 2000)
{dhyear = dhyear + 1900};
var daycell = new Array();
var cellday = new Array();
var n;
var greycolour = "#cccccc"; //Greyed out days.
var coltoday = "#FF0000"; //todays colour.
/* Click Function, Currently just displays the cell date, Modify for
what you want to happen!*/
/* NB: cellday[cell] hold the date clicked in ddmmyyyy format.*/
/*-------------------------------------------------------------*/
function mymessage(cell)
{
alert(cellday[cell])
};
/* Calender Code, Modify only if you know what your doing. If you
don't, just keep a back up!*/
/*--------------------------------------------------------------------------------------------*/
// Create Calender
//-----------------
function calendar()
{
var calobj, caption;
caption='Javascript Calendar';
calobj='<table border="1" cellspacing="0" cellpadding="0"
class="calborder">';
calobj+='<tr><td>';
calobj+='<table border="0" cellspacing="2" cellpadding="0"
class="calender">';
calobj+='<tr><td colspan="5" class="calcaption">'+caption+'</td></tr>';
calobj+='<tr><td colspan="3">';
calobj+='<select name="calmonth" onChange="updatecalendar()"
class="caldropdowns">';
calobj+='<option>January<option>February<option>March<option>April<option>May';
calobj+='<option>June<option>July<option>August<option>September<option>October';
calobj+='<option>November<option>December</select>';
calobj+='</td><td colspan="2" align="right">';
calobj+='<select name="calyear" onChange="updatecalendar()"
class="caldropdowns">';
for (n=firstyear;n<lastyear;n++)
{
if (n==dhyear)
{
calobj+='<option selected value="'+n+'">'+n+'</option>'
}
else
{
calobj+='<option value="'+n+'">'+n+'</option>'
} // End If
}; // End For loop
calobj+='</select>';
calobj+='</td></tr>';
calobj+='<tr><td colspan="5" class="calinsideborder">';
calobj+='<table cellspacing="0" class="calinsidesettings" border="1">';
calobj+='<tr align="center">';
calobj+='<td width="14%" class="caldays">Sun</td>';
calobj+='<td width="14%" class="caldays">Mon</td>';
calobj+='<td width="14%" class="caldays">Tue</td>';
calobj+='<td width="14%" class="caldays">Wed</td>';
calobj+='<td width="14%" class="caldays">Thu</td>';
calobj+='<td width="14%" class="caldays">Fri</td>';
calobj+='<td width="14%" class="caldays">Sat</td>';
calobj+='</tr>';
var calcell,calrow;
for (calcell=0;calcell<6;calcell++)
{
calobj+='<tr><td class="calwknd" width="14%" id=cal'+(calcell*7)+'
onclick=mymessage('+(calcell*7)+');> </td>';
calobj+='<td width="14%" class="calwkdy" id=cal'+(calcell*7+1)+'
onclick=mymessage('+(calcell*7+1)+');> </td>';
calobj+='<td width="14%" class="calwkdy" id=cal'+(calcell*7+2)+'
onclick=mymessage('+(calcell*7+2)+');> </td>';
calobj+='<td width="14%" class="calwkdy" id=cal'+(calcell*7+3)+'
onclick=mymessage('+(calcell*7+3)+');> </td>';
calobj+='<td width="14%" class="calwkdy" id=cal'+(calcell*7+4)+'
onclick=mymessage('+(calcell*7+4)+');> </td>';
calobj+='<td width="14%" class="calwkdy" id=cal'+(calcell*7+5)+'
onclick=mymessage('+(calcell*7+5)+');> </td>';
calobj+='<td class="calwknd" width="14%" id=cal'+(calcell*7+6)+'
onclick=mymessage('+(calcell*7+6)+');> </td></tr>'
};
calobj+='</table>';
calobj+='</td></tr>';
calobj+='<tr align="center">';
calobj+='<td width="20%">';
calobj+='<input type="button" name="backyear" value="<<"
class="calbutts" onclick=gobackyear();updatecalendar()>';
calobj+='</td>';
calobj+='<td width="20%">';
calobj+='<input type="button" name="backmonth" value="<"
class="calbutts" onclick=gobackmonth();updatecalendar()>';
calobj+='</td>';
calobj+='<td width="20%">';
calobj+='<input type="button" name="TODAY" value="TODAY"
class="calbutts" onclick=caltoday()>';
calobj+='</td>';
calobj+='<td width="20%">';
calobj+='<input type="button" name="onmonth" value=">"
class="calbutts" onclick=goonmonth();updatecalendar()>';
calobj+='</td>';
calobj+='<td width="20%">';
calobj+='<input type="button" name="onyear" value=">>"
class="calbutts" onclick=goonyear();updatecalendar()>';
calobj+='</td>';
calobj+='</tr>';
calobj+='</table>';
calobj+='</td>';
calobj+='</tr>';
calobj+='</table>';
document.write(calobj);
daycell[0]=cal0;
daycell[1]=cal1;
daycell[2]=cal2;
daycell[3]=cal3;
daycell[4]=cal4;
daycell[5]=cal5;
daycell[6]=cal6;
daycell[7]=cal7;
daycell[8]=cal8;
daycell[9]=cal9;
daycell[10]=cal10;
daycell[11]=cal11;
daycell[12]=cal12;
daycell[13]=cal13;
daycell[14]=cal14;
daycell[15]=cal15;
daycell[16]=cal16;
daycell[17]=cal17;
daycell[18]=cal18;
daycell[19]=cal19;
daycell[20]=cal20;
daycell[21]=cal21;
daycell[22]=cal22;
daycell[23]=cal23;
daycell[24]=cal24;
daycell[25]=cal25;
daycell[26]=cal26;
daycell[27]=cal27;
daycell[28]=cal28;
daycell[29]=cal29;
daycell[30]=cal30;
daycell[31]=cal31;
daycell[32]=cal32;
daycell[33]=cal33;
daycell[34]=cal34;
daycell[35]=cal35;
daycell[36]=cal36;
daycell[37]=cal37;
daycell[38]=cal38;
daycell[39]=cal39;
daycell[40]=cal40;
daycell[41]=cal41;
caltoday();
updatecalendar()
}; // End Function
// Set today
//-----------
function caltoday()
{
dhday = dhnow.getDate();
calmonth.selectedIndex=dhnow.getMonth();
calyear.value=dhnow.getYear();
updatecalendar()
}; // End Function
// Refresh Cells and Dates
//-------------------------
function updatecalendar()
{
dhmonth = calmonth.selectedIndex;
dhyear = calyear.value;
var firstOfMonth = new Date (dhyear, dhmonth, 1);
var startingPos = firstOfMonth.getDay();
var curday=1;
var udays=monthdays(dhmonth,dhyear);
var prevdays=monthdays(dhmonth-1,dhyear);
var astr;
for (n=0;n<42;n++)
{
if (startingPos==n)
{
if
(dhmonth==dhnow.getMonth()&dhyear==dhnow.getYear()&curday==dhnow.getDate())
{
astr=curday;
daycell[n].innerHTML="<fontcolor='"+coltoday+"'>"+astr.toString()+"</font>"
}
else
{
daycell[n].innerHTML=curday
};
setday(n,dhmonth,dhyear,curday);
startingPos++;
curday++
}
else
{
if (startingPos==66)
{
setday(n,dhmonth+1,dhyear,curday);
astr=curday;
curday++
}
else
{
setday(n,dhmonth-1,dhyear,prevdays-startingPos+n+1);
astr=prevdays-startingPos+n+1
};
daycell[n].innerHTML="<fontcolor='"+greycolour+"'>"+astr.toString()+"</font>"
};
if (curday>udays){
curday=1;
startingPos=66
}
} // Close for loop
}; // close function
// Set dhday variables
//-------------------
function setday(cell,dhmonth,dhyear,dhday)
{
dhmonth++;
if (dhmonth==13){dhmonth=1; dhyear++};
if (dhmonth==0){dhmonth=12; dhyear--};
var strmon;
var stryear;
var strday;
strmon=dhmonth.toString();
if (strmon.length==1){strmon="0"+strmon};
strday=dhday.toString();
if (strday.length==1){strday="0"+strday};
stryear=dhyear.toString();
cellday[cell]=stryear+strmon+strday
}; // End Function
// Check days in dhmonth
//---------------------
function monthdays(dhmonth,dhyear) {
var mdays;
if (dhmonth==0 || dhmonth==2 || dhmonth==4 || dhmonth==6 || dhmonth==7
|| dhmonth==9 || dhmonth==11 || dhmonth==-1 || dhmonth==12) {mdays=31}
else if (dhmonth==3 || dhmonth==5 || dhmonth==8 || dhmonth==10)
{mdays=30}
else if (dhmonth==1) {
if (leapyear(dhyear)) { mdays=29 }
else { mdays=28 }
}
return (mdays);
}; // End Function
// Check for leap dhyear
//---------------------
function leapyear (dhyear) {
if (((dhyear % 4)==0) && ((dhyear % 100)!=0) || ((dhyear % 400)==0)) {
return (true)
}
else {
return (false)
} // End If
}; // End Function
// Forward one dhmonth
//-------------------
function goonmonth()
{
dhmonth = calmonth.selectedIndex;
dhmonth++;
if (dhmonth==12)
{
dhmonth=0;
goonyear()
}; // End If
calmonth.selectedIndex=dhmonth
}; // End Function
// Forward one dhyear
//------------------
function goonyear()
{
dhyear = calyear.value;
dhyear++;
if (dhyear==lastyear){dhyear=firstyear};
calyear.value=dhyear
}; // End Function
// Back one dhmonth
//----------------
function gobackmonth()
{
dhmonth = calmonth.selectedIndex;
dhmonth--;
if (dhmonth==-1)
{
dhmonth=11;
gobackyear()
}; // End If
calmonth.selectedIndex=dhmonth
}; // End Function
// Back one dhyear
//---------------
function gobackyear()
{
dhyear = calyear.value;
dhyear--;
if (dhyear<firstyear){dhyear=lastyear-1};
calyear.value=dhyear
} // End Function
//-->
</SCRIPT>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
calendar();
//-->
</SCRIPT>
</body>
</html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Google Calendar Data API" group.
To post to this group, send email to
[email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/google-calendar-help-dataapi
-~----------~----~----~----~------~----~------~--~---