ScriptCalendar.com
A Javascript Event Calendar
  
Contact
ScriptCalendar.com
An incredible javascript event calendar

Contact:
techadmin @ scriptcalendar.com

Site Map

Copyright 2008 All Rights Reserved
     

An incredible javascript event calendar, either a javascript calendar or an xml calendar.

Properties


This a list of all the properties you can set within your HTML code to control the calendar. The examples assume your instance of the calendar is the variable "objCal". More detailed information is avaiable in the FAQ page.

Property Description
beginMonday This boolean flag controls which day begins the weeks the calendar displays. Set this property to "true" to begin the week on Monday. Omit this property or set it "false" to begin the week with Sunday.

Please note that you must also change the "longDays" property if you set this to "true".

The default value of this property is "false".

example: objCal.beginMonday=true;
cellHeight This numeric property controls the height of the date cells within the calendar, and therefore the horizontal size of the entire calendar. If the event text is too large to fit in the cell, the text will be truncated.

The default value of this property is "100".

example: objCal.cellWidth=80;
cellWidth This numeric property controls the width of the date cells within the calendar, and therefore the vertical size of the entire calendar.

The default value of this property is "100".

example: objCal.cellWidth=80;
dateRangeEnd Sets the last available year in the year dropdown data selector. The year selector will display numbers between dateRangeStart and dateRangeEnd

The default value of this property is 2010.

example: objCal.dateRangeEnd=2011;
dateRangeStart Sets the first available year in the year dropdown data selector. The year selector will display numbers between dateRangeStart and dateRangeEnd

The default value of this property is 2004.

example: objCal.dateRangeStart=2005;
dateSelector Defines which of the date selectors will be displayed in the calendar header. This is property is manipulated by bitwise operators.

a value of 1 = month selector is visible
a value of 2 = year selector is visible
a value of 4 = prev month link is visible
a value of 8 = next month link is visible
a value of 16 = month is displayed as text
a value of 32 = year is displayed as text

Values may be combined to create various looks. For example 4+8 means only the prev and next are visible while the month and year are hidden.

The default value of this property is 1+2+4+8.

example: objCal.dateSelector=4+8;
deadCellBehavior Defines what will display in the cells belonging to the previous or next month. This is property is manipulated by bitwise operators. Cells belonging in the previous or next month are called "dead" cells. There are three types of behavior. One, display the date number. Two, show display dead events. Three, display event from the previous and next month.

a value of 1 = date number is visible
a value of 2 = dead events are visible. (A dead event is an event for a non-existant date. For example, the date 2/0/2005 would put an event in on the February 2005 calendar in the last day of January. The event would only be visible in February, not January.
a value of 4 = events from the previous and next month are visible

Values may be combined to create various looks. For example 1+2 means only the date number and dead events are visible.

The default value of this property is 0 (all all off).

example: objCal.deadCellBehavior=1+2+4;
displayWeekNumber This boolean flag controls if the calendar the week number of the year is shown along the left hand side of the calendar. The style is set by the class "scWeekNumber".

The default value of this property is "false".

example: objCal.displayWeekNumber=true;
expandCellHeight This boolean allows the date cell expand to include all the events and event text. The normal behavior is to truncate the events at the height set in the cellHeight property. If the you set this property to true, the cellHeight acts like a "min-height" and if needed will expand to include all events. Please note that some browsers may render this slightly differently.

When you set the property to true, it is recommended that you set the property expandEventStyle to false. This will instruct the calendar not to attempt to extend the style of the last event and should render consistently in all browsers.

The default value of this property is "false".

example: objCal.expandCellHeight="true";
expandEventStyle This boolean allows the event class of one event expand to include other events that have no class. The origin of this property is from calendar that use background colors. If you a "red" background event and a recurring event with no class (i.e. black text), you might want the red background to expand and cover both events, thus the entire date cell will be red and not just half of it.

The default value of this property is "true".

example: objCal.expandEventStyle="false";
filterNames This string allows you to create keywords to filter events. The string is simply a comma delimited list of keywords. If this property is something other than empty string, a table of checkboxes appears at the bottom of the calendar.

The default value of this property is "" (empty string).

example: objCal.filterNames="weekends,holidays,special";
initialDate This date value controls the month and year displayed when the calendar is first accessed. By default, it uses the current date. However, you can set it to any valid date value.

The default value is the current date.

example: objCal.initialDate = new Date(2005, 2, 20);
longDays This array supplies the weekday headers for the calendar. The defaults are Sun, Mon, Tues... but you could change the array to Sunday, Monday, Tuesday... Also, this permits weekday headers in alternative languages.

Please note that if you begin the weeks with Monday, you'll have to adjust this array to begin with Monday as well.

example: objCal.longDays = new Array( "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" );
longMonths This array supplies the months header for the calendar.

The default is January, February, March... but you could change the array to Jan, Feb, Mar or 1,2,3 or adjust it for other languages.

example: objCal.longMonths = new Array( "January", "February", "March", "April","May", "June", "July", "August", "September", "October", "November", "December" );
nextHtml This string supplies the HTML to be used for the next month link in the calendar header. You may use an image tag to use a graphic for the link. The style for the link is the class "scSelector".

The default is "<font size='3'>&raquo; </font>".

example: objCal.nextHTML = "<img src='myimage.gif'>";
padding This numeric property controls the amount of padding in pixels between the edge of the date cell and the event text.

The default value is 3.

example: objobjCal.padding=3;
overrideSpecialEvent This boolean, when set to true will suppress any special event in a date cell that has regular event.

The default is false.

example: objCal.overrideSpecialEvent = true;
padding This numeric property controls the amount of padding in pixels between the edge of the date cell and the event text.

The default value is 3.

example: objobjCal.padding=3;
popupAddParam This boolean property controls appending the "scDate" QueryString parameter on the URL of the popup window. The parameter will contain the date value of the event.

The default value is true.

example: objobjCal.popupAddParam=false;
popupProperities This string property is the equivalent of the window.open properties string. It allows you to set the size, scrollbars, etc... of the windows that popup (assuming you've defined a few events with the popuplink parameter).

The default value is "width=600, height=400, scrollbars=yes, resizable=yes, titlebar=yes, toolbar=yes, menubar=yes, location=yes, status=yes".

example: objCal.popupProperties="width=600, height=400, scrollbars=yes, resizable=yes, titlebar=yes, toolbar=yes, menubar=yes, location=yes, status=yes";
popupType This numeric property controls how the pages specified in the PopupLink parameter of the fscEvent call are displayed.

a value of 1 = popup, new browser window
a value of 2 = a DIV tag on top of the calendar (defeats popup blocking software).
a value of 3 = as a hyperlink in the main window.

The default value is 1.

example: objCal.popupType=2;
prevHtml This string supplies the HTML to be used for the previous month link in the calendar header. You may use an image tag to use a graphic for the link. The style for the link is the class "scSelector".

The default is "&laquo;".

example: objCal.prevHTML = "<img src='myimage.gif'>";
showFutureEvents This boolean property can hide future events coded in the dcevent.js if the value is set to false. Thus, only todays and past events are displayed.

The default value is true.

example: objCal.showFutureEvents=false;
showPastEvents This boolean property can hide past events coded in the dcevent.js if the value is set to false. Thus, only todays and future events are displayed.

The default value is true.

example: objCal.showPastEvents=false;
spacing This numeric property controls the amount of transparent space in pixels appears between date cells. Either the background color of the calendar (set in calendarStyle) or your HTML page will show through.

The default value is 2.

example: objCal.spacing=2;
xmlFile This string property controls if the calendar should use the dcevent.js as the source for the events or an xml formatted event file. To use the dcevent.js file, simply omit this property in the calling html. To use an xml file for event data, set the property to the relative path of the xml file. Please see the xml documentation for more information.

The default value is false.

example: objCal.xmlFile = "myfile.xml";
xslFile This string property controls if the calendar should output XML which will then be tranformed by the specified XSLT. Using an XLST to transform the raw XML output of the calendar gives you total control over display. Please see the xml documentation for more information.

The default value is false.

example: objCal.xmlFile = "myfile.xsl";