This background is for site administrators and page designers.
Overview: {opt.} If calendars are turned on for a site then the administrator can create one or more Calendars by clicking on calendar function. Once a calendar is create, users can be given permission to create events and headlines for that calendar and the calendar related tags will become active.
Configuration: each calendar, as well as the joint is expected to have a page dedicated to its display. On that page the Day Details will be displayed as well either a single or tripple calendar.
- On each calendar two tags are normally used \|.SingleCal:D.\| (or \|.ThreeCal:D.\| or \|.ThreeCalF:D.|) tag followed by the \|.DayDetails:D.\| tag. The optional :D is used to specify which calendar will be displayed. Initially the current month will be the focus month but arrows (« and ») allow the focus to more one month earlier or later. \|.ThreeCalF:D.| displays the focus month followed by the next two months. \|.ThreeCal:D.\| displays three calendars with the current month in the middle.
- Once the pages are created (and if needed, published) then the Page IDs (PID) need to be added to the configuration. The consolidated calendar's PID is set using the Configure function. The calendar specific PIDs are set in each Calendar and replace the Dummy number which was entered when the page was displayed.
Warning: if you click on a date with an event and the home page is displayed you have not properly assigned the PID for that calendar so the system goes to its default page, the home page.
Page designers control most of the appearance using styles. In most instances the page designer need only insert the required tags. However, it a specific date needs to be force the allowing variables should be passed:
- day, month, year (defaults to current date, except for the three calendar listing which will display entire month).
- div {division} defaults to all divisions if not specified.
Styles:
All of this is managed by styles. The calendars use similar formats. "prefixTAGextension" where the extension is optional and is set by the event drop down (e.g., half days). Prefix is determined by the type of calendar month being displayed: CalLeft, CalCenter, CalRight {for the three calendars), and SC {for the single calendar}. In the following list of styles pre should be replaced by one of these four. Similarly xwill exist. Note the month displays are in the format (unlike some systems, this means that number of rows in this table may vary, but there will never be any blank rows). Note: for \|.ThreeCalF:D.| CalCenter is used for the leftmost calendar followed by CalLeft and CalRight. This allows the focus month to be styled to stand out.
« Month Year » | ||||||
S | M | T | W | T | 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 |
28 | 29 | 30 | 31 |
SyleName | Function |
class=preTitle | in TR tag where month and year are displayed Red background in the sample |
class=preDays | in TR tag for list of letters which indicate days of week. |
class=SCArrow | in DIV tag around the « and » links which appear on the single calendar only. see below for three calendar equivalent |
class=preDayCol | in TD tag for the column which contains Today's Date |
class=prenumRow | in TR tag for the row which contains Today's Date |
class=prenum | in TR tag for the rows whihc do NOT contain Today's Date |
class=preToday | in TD tag for the current day. |
class=preNumCol | in TD tag for days in the same column as Today's Date |
Below applies to ThreeCal only | |
class=CalLeftArrow | in TD tag in the separate column where the « is (in three calendar display the arrows are outside the Left and Right months. |
class=CalRightArrow | as above but for the » in the column to the right of the rightmost calendar. |
class=CalLeft, CalRight, CalCenter |
in TD tags around the respective tables containing the Left, Right and Center calendars. |
class=Cspacer3 | in TD tags between Left and Center, and Center and Right columns Used to adjust the gap between them |
class=CalDetails | in DIV tag surrounding table which will have the Details about a single day below the thee wide calendar. |
class=CalDetailTitle | in TR tag for row which displays the Date String. |
class=CalDetailHeadlines | in TR tag which contain the Unordered list of headlines for the day |
class=CalDetaiEntry | in TR tag which contains the entry in 2 colmns (start - stop, and Title) |
class=CalDetailTime | in TD tag which contains the entry's start-stop information |
class=CalDetailRef | in TD tag which contains the entry's Title. (may be a link if there is a Long Description |
Below applies to Headlines:D and Important:D tags ( where D can be Day, Week or Month ) | |
class=Headlines | in DIV tag surrounding table where headlines will be displayed |
class=HeadlinesTitle | in DIV tag surrounding the title line, which is present only if the a division is passed to the page. Title matches the Division's title in the table. |
class=HeadlinesList | in DIV tag surrounding the unorder list which contains the list of headlines. |
Month At A Glance Calendar
Style sheet | /assets/calPrint.css this is hard coded since there is no template for this page. |
id=header | used in div tag which surrounds the title elements of the page. |
id=arrow | used in span tag which surrounds the « and » links used to go to the prior and next months respectively. |
id=cal_home | used in span tag around the link to the site's home page. (i.e, around the word 'Home'). |
id=printCal | used in div tags which surround the entire calendar body. |
id=calTitle | used in tr tag for the row of day names (e.g, Sunday, Monday ... Saturday). |
id=printCalBody | used in tr tag for each of the rows making up the days of the month |
class=print_Z | used in td tag for "Special" day. |
class=print_s | used in td tag for "Holiday" day. |
class=printToday | used in tag for today's date. (Note: _Z and _s variants are used for today when its Special or Holiday respectively) |
.