Results 1 to 5 of 5

Thread: Simple calendar creator

  1. #1
    Join Date
    Dec 2010
    Location
    ATHENS GREECE
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Simple calendar creator

    I am not an expert in javascript but I know some basics.
    I use for my personal site the simple calendar creator script by Brian Gosselin which I attach.
    I have tried many ways to change the appearance of the dates i.e from "SMTWTFS" to something like "Su, Mo, Tu, We, Th, Fr, Sa" but I have not been succesful doing it. Any idea on how to modify the script to get it ?
    P.s
    I wish to all of you Happy New Year

    Code:
    function buildCal(m, y, cM, cH, cDW, cD, brdr, sDay, action){
    var mn=['January','February','March','April','May','June','July','August','September','October','November','December'];
    var dim=[31,0,31,30,31,30,31,31,30,31,30,31];
    
    if(sDay<1 || sDay>7)sDay=1;
    
    var oD = new Date(y, m-1, 1); //DD replaced line to fix date bug when current day is 31st
    oD.od=oD.getDay()+1; //DD replaced line to fix date bug when current day is 31st
    
    var tmpod=oD.od-sDay;
    if(tmpod<0)tmpod=7+tmpod;
    oD.od=tmpod+1;
    
    var wkstr="SMTWTFS".substr(sDay-1,"SMTWTFS".length)+"SMTWTFS".substr(0,sDay-1);
    
    var todaydate=new Date() //DD
    var scanfortoday=(y==todaydate.getFullYear() && m==todaydate.getMonth()+1)? todaydate.getDate() : 0 //DD
    
    dim[1]=(((oD.getFullYear()%100!=0)&&(oD.getFullYear()%4==0))||(oD.getFullYear()%400==0))?29:28;
    var t='<div class="'+cM+'"><table class="'+cM+'" cellpadding="0" border="'+brdr+'" cellspacing="0">';
    t+='<tr align="center"><td colspan="7" align="center" class="'+cH+'">'+mn[m-1]+' - '+y+'</td></tr>';
    t+='<tr align="center">';
    for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+wkstr.substr(s,1)+'</td>';
    t+='</tr><tr align="center">';
    for(i=1;i<=42;i++){
    var x=( (i-oD.od>=0) && (i-oD.od<dim[m-1]) )? '<div style="width:100%" '+((action!='')? 'onmouseup="'+action+'('+m+','+(i-oD.od+1)+','+y+')':(i-oD.od+1))+'">'+(i-oD.od+1)+'</div>' : '&nbsp;';
    if (i-oD.od+1==scanfortoday)x='<span id="today" class="'+cD+'">'+x+'</span>' //DD
    t+='<td width="14.28%" class="'+cD+'">'+x+'</td>';
    if(((i)%7==0)&&(i<36))t+='</tr><tr align="center">';
    }
    t+='</tr></table></div>';
    return t;
    }

  2. #2
    Join Date
    Dec 2010
    Posts
    2
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default Improved version

    Use this instead:

    <script type="application/javascript" language="javascript">
    function buildCal(m, y, cM, cH, cDW, cD, brdr, sDay, action){
    var mn=['January','February','March','April','May','June','July','August','September','October','November','December'];
    var dn=['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];
    var dim=[31,0,31,30,31,30,31,31,30,31,30,31];

    if(sDay<1 || sDay>7)sDay=1;

    var oD = new Date(y, m-1, 1); //DD replaced line to fix date bug when current day is 31st
    oD.od=oD.getDay()+1; //DD replaced line to fix date bug when current day is 31st

    var tmpod=oD.od-sDay;
    if(tmpod<0)tmpod=7+tmpod;
    oD.od=tmpod+1;


    var todaydate=new Date() //DD
    var scanfortoday=(y==todaydate.getFullYear() && m==todaydate.getMonth()+1)? todaydate.getDate() : 0 //DD

    dim[1]=(((oD.getFullYear()%100!=0)&&(oD.getFullYear()%4==0))||(oD.getFullYear()%400==0))?29:28;
    var t='<div class="'+cM+'"><table class="'+cM+'" cellpadding="0" border="'+brdr+'" cellspacing="0">';
    t+='<tr align="center"><td colspan="7" align="center" class="'+cH+'">'+mn[m-1]+' - '+y+'</td></tr>';
    t+='<tr align="center">';
    //for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+wkstr.substr(s,1)+'</td>';
    for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+dn[s]+'</td>';
    t+='</tr><tr align="center">';
    for(i=1;i<=42;i++){
    var x=( (i-oD.od>=0) && (i-oD.od<dim[m-1]) )? '<div style="width:100%" '+((action!='')? 'onmouseup="'+action+'('+m+','+(i-oD.od+1)+','+y+')' : (i-oD.od+1))+'">'+(i-oD.od+1)+'</div>' : '&nbsp;';
    if (i-oD.od+1==scanfortoday)x='<span id="today" class="'+cD+'">'+x+'</span>' //DD
    t+='<td width="14.28%" class="'+cD+'">'+x+'</td>';
    if(((i)%7==0)&&(i<36))t+='</tr><tr align="center">';
    }
    t+='</tr></table></div>';
    return t;
    }
    </script>
    _______________

    I replaced this:
    var wkstr="SMTWTFS".substr(sDay-1,"SMTWTFS".length)+"SMTWTFS".substr(0,sDay-1);
    with this:
    var dn=['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];
    The day names can now be anything you like.
    and this line:
    for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+wkstr.substr(s,1)+'</td>';
    with this:
    for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+dn[s]+'</td>';

    Good luck,
    David

  3. The Following User Says Thank You to dpcoombs For This Useful Post:

    alex1812 (12-31-2010)

  4. #3
    Join Date
    Dec 2010
    Location
    ATHENS GREECE
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thank you dpcoombs.It works perfect. It was the best present for Christmas.
    Also I thing it is an improvment to Simple Calendar as now it can be multilingual.
    I will work also to improve it with different colours on weekend days. Again thank you for your post.

  5. #4
    Join Date
    Dec 2010
    Location
    ATHENS GREECE
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    The only think is that, if you want to start the week from Monday you have to write
    var dn=[ 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'];

    and change the sDay from 1 to 2 whenever you use it as an output.

  6. #5
    Join Date
    Dec 2010
    Posts
    2
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default

    Yes, you're right. I'll try to fix that problem, but it's New Year's Eve, so not tonight!.
    David

Bookmarks

Posting Permissions

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