Ctycalendar

Tuesday, November 11, 2003 - Topic(s) CityDesk Technology

This is an article about a small program I wrote to use with Fog Creek Software's excellent desk top content management system City Desk

City script is great at creating lists of articles sorted all kinds of ways but what if you want to create a calendar of weblog posts or an events calendar.  John Conners has a calendar creator that generates html to plug in to your site but you need to update the calendars manually. Ctycalendar runs as a post publishing step within City Desk to create a calendar from a specially formatted list which can be built with city script.

Installing Ctycalendar

Click for Larger Image

Click here to download the cty calendar executable. Unzip it to a directory on your computer. The examples that follow assume that you used c:\ctycalendar but you can place it you like. You'll need to set up a publish location for testing on you your computer and add Ctycalendar to it as well as to your regular publish location. You can find directions for setting up a publish location in your city desk help file or here in the online manual.  Add Ctycalendar as a "before copy" step on the run external programs dialog.

Ctycalendar takes the following arguments
   --workdir      Working directory put "%1" here 
  --file {file}   Html file to process
  --class {class} Of ul element to convert to table(s)
  --dayheadings   Headings for each day of the week.
                  For example "Sun,Mon,Tue,Wed,Thu,Fri,Sat"
                  
  --monthheadings {month,month,etc}
                  Specify headings for each month. 
                  Separated by commas.
                  
  --debug         The original html is output as 
                  comments in the modified file

Creating Calendars

To create a calendar you'll need to create a an unordered list <ul> of the data to go into the calendar.You can create two styles of calendars with Ctycalendar. The first has an only one link for each day of the month with the number for that day linked to the article. To create a calendar like this you would create a list with city script containing the dates of the posts and links to each article. Something like this.

{$ setDateTimeFormat "*" "MM/dd/yyyy" "hh:mm" $}
<span class="calendar"><b>Recent Posts</b></span>
<ul class="calendar">
{$ foreach x in (and (folder "Articles")(monthOf publishDate)) sortAscendBy .filedDate $}
<li>{$ x.filedDate$}::{$ x.link $}::</li>
{$ next $}
</ul>

Here's the list produced by city desk
And here is after processing by Ctycalendar
October 2003
S M T W TH F S
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
29
30
31
November 2003
S M T W TH F S
1
3
4
5
6
7
8
9
12
13
14
15
16
18
19
20
21
22
23
24
25
26
27
28
29
December 2003
S M T W TH F S
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
18
19
20
21
22
23
24
25
26
27
28
29
31

Of course you'd need to adjust the for loop to fit your site. You need to give your list a class by adding class="someclass" to the <ul> tag. Ctycalendar uses the class declaration to determine which lists to process. The default class is "calendar" but you can use another class by specifying it on the City Desk command line. Each <li> element must be formatted exactly as shown. Ctycalendar only understands dates in the format shown and the two colons :: are what it uses to separate the dates and links. The items must be in ascending date order or Ctycalendar will become very confused. If there is more than one entry for one date it will create a link to the last item. The list can contain dates for more than one month. Ctycalendar will create a new table for each month.

Creating links to more than one article

Ctycalendar can also create an events listing, where multiple items are shown for each day of the month. To create this kind of listing change the list item so that it provides text to form the body of the link. Like this.....

<li>{$ x.filedDate$}::{$ x.link $}::{$ x.headline $}</li>
Again here is the City Desk Output
Here it is processed into tables.
October 2003
Sun Mon Tue Wed Thu Fri Sat
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
November 2003
Sun Mon Tue Wed Thu Fri Sat
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
December 2003
Sun Mon Tue Wed Thu Fri Sat
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

Styling the output

The calendars above were styled using css. Ctycalendar assigns classes to various elements to assist in this. Here are the styles applied to the calendar's above

table.calendar{
   text-align: right;
   border: 1px solid black;
   margin-top: 2em;
   width: 25%;
}
tr.calhead {
   text-align: center;
}
tr.calhead {
   background-color: #D3DEE0;
}
table.calendar td{
   width: 14.28%;
   text-align: right;
   padding: 2px; 
}
a.callink {
   display: block;
}
#bigcal table.calendar{
   width: 90%;
}
#bigcal table.calendar th{
   text-align: center;
   border-bottom: 1px solid gray;
   border-right: 1px solid gray;
}
#bigcal table.calendar td{
   border-top: 1px solid #fff;
   border-left: 1px solid #fff;
   border-right: 1px solid gray;
   border-bottom: 1px solid gray;
   text-align: right;
   vertical-align: top;
   padding: 0;
}