commit 3af5a65f69fef059fe2b8515db42debf3ada01cd Author: Adam Shaw Date: Sat Jan 16 14:29:18 2010 -0800 initially commit for new docs branch diff --git a/agenda/allDaySlot.txt b/agenda/allDaySlot.txt new file mode 100644 index 0000000..2c29657 --- /dev/null +++ b/agenda/allDaySlot.txt @@ -0,0 +1,11 @@ + +allDaySlot *1.4* +================ + +Determines if the "all-day" slot is displayed at the top of the calendar. + +
+Boolean, *default*: `true` +
+ +When hidden with `false`, all-day events will not be displayed in agenda views. diff --git a/agenda/allDayText.txt b/agenda/allDayText.txt new file mode 100644 index 0000000..13f3595 --- /dev/null +++ b/agenda/allDayText.txt @@ -0,0 +1,9 @@ + +allDayText *1.4* +================ + +The text titling the "all-day" slot at the top of the calendar. + +
+String, *default*: `'all-day'` +
diff --git a/agenda/axisFormat.txt b/agenda/axisFormat.txt new file mode 100644 index 0000000..31ea744 --- /dev/null +++ b/agenda/axisFormat.txt @@ -0,0 +1,13 @@ + +axisFormat *1.4* +================ + +Determines the time-text that will be displayed on the left vertical axis of the agenda views. + +
+String, *default*: `'h(:mm)tt'` +
+ +The value is a format-string that will be processed by [formatDate](../utilities/formatDate). + +The default value will produce times that look like "5pm" and "5:30pm". diff --git a/agenda/defaultEventMinutes.txt b/agenda/defaultEventMinutes.txt new file mode 100644 index 0000000..9b64485 --- /dev/null +++ b/agenda/defaultEventMinutes.txt @@ -0,0 +1,13 @@ + +defaultEventMinutes *1.4* +========================= + +Determines the length (in minutes) an event appears to be when it has an unspecified end date. + +
+Integer, *default*: `120` +
+ +By default, if an [Event Object](../event_data/Event_Object) as no `end`, it will appear to be 2 hours. + +This option only affects events that appear in the agenda slots, meaning they have `allDay` set to `true`. diff --git a/agenda/firstHour.txt b/agenda/firstHour.txt new file mode 100644 index 0000000..db53c5d --- /dev/null +++ b/agenda/firstHour.txt @@ -0,0 +1,14 @@ + +firstHour *1.4* +=============== + +Determines the first hour that will be visible in the scroll pane. + +
+Integer, *default*: `6` +
+ +Values must be from 0-23, where 0=midnight, 1=1am, etc. + +The user will be able to scroll upwards to see events before this time. +If you want to prevent users from doing this, use the [minTime]() option instead. diff --git a/agenda/index.txt b/agenda/index.txt new file mode 100644 index 0000000..09448b3 --- /dev/null +++ b/agenda/index.txt @@ -0,0 +1,14 @@ + +Agenda Options +============== + +The following options only apply to the `agendaWeek` and `agendaDay` views: + +- allDaySlot +- allDayText +- axisFormat +- slotMinutes +- defaultEventMinutes +- firstHour +- minTime +- maxTime diff --git a/agenda/maxTime.txt b/agenda/maxTime.txt new file mode 100644 index 0000000..c6c722c --- /dev/null +++ b/agenda/maxTime.txt @@ -0,0 +1,11 @@ + +maxTime *1.4.2* +=============== + +Determines the last hour/time (exclusively) that will be displayed, even when the scrollbars have been scrolled all the way down. + +
+Integer/String, *default*: `24` +
+ +This can be a number like `22` (which means 10pm), a string like `'22:30'` (which means 10:30pm) or a string like `'10:30pm'`. diff --git a/agenda/minTime.txt b/agenda/minTime.txt new file mode 100644 index 0000000..9fb85d6 --- /dev/null +++ b/agenda/minTime.txt @@ -0,0 +1,11 @@ + +minTime *1.4.2* +=============== + +Determines the first hour/time that will be displayed, even when the scrollbars have been scrolled all the way up. + +
+Integer/String, *default*: `0` +
+ +This can be a number like `5` (which means 5am), a string like `'5:30'` (which means 5:30am) or a string like `'5:30am'`. diff --git a/agenda/slotMinutes.txt b/agenda/slotMinutes.txt new file mode 100644 index 0000000..e666919 --- /dev/null +++ b/agenda/slotMinutes.txt @@ -0,0 +1,11 @@ + +slotMinutes *1.4* +================= + +The frequency for displaying time slots, in minutes. + +
+Integer, *default*: `30` +
+ +The default will make a slot every half hour. diff --git a/current_date/date.txt b/current_date/date.txt new file mode 100644 index 0000000..91f0d47 --- /dev/null +++ b/current_date/date.txt @@ -0,0 +1,16 @@ + +date *1.3* +========== + +The initial date-of-the-month when the calendar loads. + +
+Integer +
+ +This option only matters for the week & day views. Month view does not need this option, +because month view always displays the entire month from start to finish. + +If `date` is unspecified, and `year`/`month` are set to the current year/month, then the +calendar will start on the current date. If `date` is unspecified, and `year`/`month` are *not* +set to the current year/month, then the calendar will start on the first of the month. diff --git a/current_date/getDate.txt b/current_date/getDate.txt new file mode 100644 index 0000000..78464c5 --- /dev/null +++ b/current_date/getDate.txt @@ -0,0 +1,19 @@ + +getDate *1.4.2* +=============== + +Returns a Date object for the current date of the calendar. + +
+.fullCalendar( 'getDate' ) -> Date object +
+ +For month view, it will always be sometime between the first and last day of the month. +For week views, it will always be sometime between the first and last day of the week. + +Example of displaying a calendar's current date when a button is clicked: + + $('#my-button').click(function() { + var d = $('#calendar').fullCalendar('getDate'); + alert("The current date of the calendar is " + d); + }); diff --git a/current_date/gotoDate.txt b/current_date/gotoDate.txt new file mode 100644 index 0000000..363ac8c --- /dev/null +++ b/current_date/gotoDate.txt @@ -0,0 +1,14 @@ + +gotoDate +======== + +Moves the calendar to an arbitrary year/month/date. + +
+.fullCalendar( 'gotoDate', *year* [, *month*, [ *date* ]] ) +
+ +**IMPORTANT**: `month` is 0-based, meaning January=`0`, February=`1`, etc. + +This method can also be called with a single argument, a Date object +(only works in versions >= 1.3.2). diff --git a/current_date/incrementDate.txt b/current_date/incrementDate.txt new file mode 100644 index 0000000..4337e23 --- /dev/null +++ b/current_date/incrementDate.txt @@ -0,0 +1,9 @@ + +incrementDate *1.3* +=================== + +Moves the calendar forward/backward an arbitrary amount of time. + +
+.fullCalendar( 'incrementDate', *years* [, *months*, [ *days* ]] ) +
diff --git a/current_date/index.txt b/current_date/index.txt new file mode 100644 index 0000000..c080bfe --- /dev/null +++ b/current_date/index.txt @@ -0,0 +1,17 @@ + +Current Date +============ + + diff --git a/current_date/month.txt b/current_date/month.txt new file mode 100644 index 0000000..be13411 --- /dev/null +++ b/current_date/month.txt @@ -0,0 +1,14 @@ + +month +===== + +The initial month when the calendar loads. + +
+Integer +
+ +**IMPORTANT**: The value is 0-based, meaning January=`0`, February=`1`, etc. + +If `month` is unspecified and `year` is set to the current year, the calendar will start on the current month. +If `month` is unspecified and `year` is *not* set to the current year, the calendar will start on January. diff --git a/current_date/next.txt b/current_date/next.txt new file mode 100644 index 0000000..0b6ecee --- /dev/null +++ b/current_date/next.txt @@ -0,0 +1,26 @@ + +next *1.3* +========== + +Moves the calendar one step forward (either by a month, week, or day). + +
+.fullCalendar( 'next' ) +
+ +If the calendar is in `month` view, will move the calendar forward one month. + +If the calendar is in `basicWeek` or `agendaWeek`, will move the calendar forward one week. + +If the calendar is in `basicDay` or `agendaDay`, will move the calendar forward one day. + +Example using `next` with an external button: + + $('#my-next-button').click(function() { + $('#calendar').fullCalendar('next'); + }); + + +
+In versions 1.0 through 1.2.1, this option was known as *prevMonth*. +
diff --git a/current_date/nextYear.txt b/current_date/nextYear.txt new file mode 100644 index 0000000..60c2a0a --- /dev/null +++ b/current_date/nextYear.txt @@ -0,0 +1,11 @@ + +nextYear *1.2.x and 1.4 onward* +=============================== + +Moves the calendar forward one year. + +
+.fullCalendar( 'nextYear' ) +
+ +Version 1.3.x did not include this method, but you can use `.fullCalendar('incrementDate', 1)` instead. diff --git a/current_date/prev.txt b/current_date/prev.txt new file mode 100644 index 0000000..c29a3f0 --- /dev/null +++ b/current_date/prev.txt @@ -0,0 +1,25 @@ + +prev *1.3* +========== + +Moves the calendar one step back (either by a month, week, or day). + +
+.fullCalendar( 'prev' ) +
+ +If the calendar is in `month` view, will move the calendar back one month. + +If the calendar is in `basicWeek` or `agendaWeek`, will move the calendar back one week. + +If the calendar is in `basicDay` or `agendaDay`, will move the calendar back one day. + +Example using `prev` with an external button: + + $('#my-prev-button').click(function() { + $('#calendar').fullCalendar('prev'); + }); + +
+In versions 1.0 through 1.2.1, this option was known as *prevMonth*. +
diff --git a/current_date/prevYear.txt b/current_date/prevYear.txt new file mode 100644 index 0000000..f36d83e --- /dev/null +++ b/current_date/prevYear.txt @@ -0,0 +1,11 @@ + +prevYear *1.2.x and 1.4 onward* +=============================== + +Moves the calendar back one year. + +
+.fullCalendar( 'prevYear' ) +
+ +Version 1.3.x did not include this method, but you can use `.fullCalendar('incrementDate', -1)` instead. diff --git a/current_date/today.txt b/current_date/today.txt new file mode 100644 index 0000000..b0b1a1d --- /dev/null +++ b/current_date/today.txt @@ -0,0 +1,15 @@ + +today +===== + +Moves the calendar to the current date. + +
+.fullCalendar( 'today' ) +
+ +Example using `today` with an external button: + + $('#my-today-button').click(function() { + $('#calendar').fullCalendar('today'); + }); diff --git a/current_date/year.txt b/current_date/year.txt new file mode 100644 index 0000000..7461555 --- /dev/null +++ b/current_date/year.txt @@ -0,0 +1,13 @@ + +year +==== + +The initial year when the calendar loads. + +
+Integer +
+ +Must be a 4-digit year like `2009`. + +If `year` is unspecified, the calendar will begin at the current year. diff --git a/display/aspectRatio.txt b/display/aspectRatio.txt new file mode 100644 index 0000000..44e7d70 --- /dev/null +++ b/display/aspectRatio.txt @@ -0,0 +1,32 @@ + +aspectRatio *1.3* +================= + +Determines the width-to-height aspect ratio of the calendar. + +
+Float, *default*: `1.35` +
+ +A calendar is a block-level element that fills its entire avaiable width. +The calendar’s height, however, is determined by this ratio of width-to-height. +(Hint: larger numbers make smaller heights). + +The following example will initialize a calendar who's width is twice its height: + + $('#calendar').fullCalendar({ + aspectRatio: 2 + }); + + +setter +------ + +You may dynamically set a calendar's aspectRatio after initialization: + + $('#calendar').fullCalendar('option', 'aspectRatio', 1.8); + + +
+The *setter* only works in version 1.4.2 and later. +
diff --git a/display/buttonIcons.txt b/display/buttonIcons.txt new file mode 100644 index 0000000..5a1c604 --- /dev/null +++ b/display/buttonIcons.txt @@ -0,0 +1,22 @@ + +buttonIcons *1.3* +================= + +Determines which theme icons appear within the header buttons. + +
+Object, *default:* + + { + prev: 'circle-triangle-w', + next: 'circle-triangle-e' + } +
+ +This option only applies to calendars that have the [theme]() option enabled. + +A hash must be supplied that maps button names (from the [header]()) to icon strings. +The icon strings determine the CSS class that will be used on the button. For example, the +string `'circle-triangle-w'` will result in the class `'ui-icon-triangle-w'`. + +If a button does not have an entry, it falls back to using [buttonText](../text_customization/buttonText). diff --git a/display/contentHeight.txt b/display/contentHeight.txt new file mode 100644 index 0000000..e36447b --- /dev/null +++ b/display/contentHeight.txt @@ -0,0 +1,25 @@ + +contentHeight *1.4.2* +===================== + +Will make the calendar's content area a pixel height. + +
+Integer +
+ +By default, this option is unset and the calendar's height is calculated by [aspectRatio](). + +Example usage of `contentHeight`: + + $('#calendar').fullCalendar({ + contentHeight: 600 + }); + + +setter +------ + +You may dynamically set a calendar's contentHeight after initialization: + + $('#calendar').fullCalendar('option', 'contentHeight', 650); diff --git a/display/destroy.txt b/display/destroy.txt new file mode 100644 index 0000000..8da2852 --- /dev/null +++ b/display/destroy.txt @@ -0,0 +1,11 @@ + +destroy *1.4.3* +=============== + +Restores the element to the state before FullCalendar was initialized. + +
+.fullCalendar( 'destroy' ) +
+ +Removes elements, events handlers, and data. diff --git a/display/firstDay.txt b/display/firstDay.txt new file mode 100644 index 0000000..8bcdf2b --- /dev/null +++ b/display/firstDay.txt @@ -0,0 +1,17 @@ + +firstDay *1.3* +============== + +The day that each week begins. + +
+Integer, *default*: `0` (Sunday) +
+ +The value must be a number that represents the day of the week. + +Sunday=`0`, Monday=`1`, Tuesday=`2`, etc. + +
+In versions 1.1 through 1.2.1, this option was known as *weekStart*. +
diff --git a/display/header.txt b/display/header.txt new file mode 100644 index 0000000..24751a5 --- /dev/null +++ b/display/header.txt @@ -0,0 +1,46 @@ + +header *1.3* +============ + +Defines the buttons and title at the top of the calendar. + +
+Object/`false`, *default:* + + { + left: 'title', + center: '', + right: 'today prev,next' + } +
+ +Setting the header options to `false` will display no header. +An object can be supplied with properties `left`, `center`, and `right`. +These properties contain strings with comma/space separated values. +Values separated by a comma will be displayed adjacently. +Values separated by a space will be displayed with a small gap in between. +Strings can contain any of the following values: + +`title` +: text containing the current month/week/day + +`prev` +: button for moving the calendar back one month/week/day + +`next` +: button for moving the calendar forward one month/week/day + +`prevYear` +: button for moving the calendar back on year + +`nextYear` +: button for moving the calendar forward one year + +`today` +: button for moving the calendar to the current month/week/day + +*a view name* +: button that will switch the calendar to any of the [Available Views](../views/Available_Views) + + +Specifying an empty string for a property will cause it display no text/buttons. diff --git a/display/height.txt b/display/height.txt new file mode 100644 index 0000000..3e9d61b --- /dev/null +++ b/display/height.txt @@ -0,0 +1,25 @@ + +height *1.4.2* +============== + +Will make the entire calendar (including header) a pixel height. + +
+Integer +
+ +By default, this option is unset and the calendar's height is calculated by [aspectRatio](). + +Example usage of `height`: + + $('#calendar').fullCalendar({ + height: 650 + }); + + +setter +------ + +You may dynamically set a calendar's height after initialization: + + $('#calendar').fullCalendar('option', 'height', 700); diff --git a/display/index.txt b/display/index.txt new file mode 100644 index 0000000..7466dc8 --- /dev/null +++ b/display/index.txt @@ -0,0 +1,20 @@ + +General Display +=============== + + diff --git a/display/isRTL.txt b/display/isRTL.txt new file mode 100644 index 0000000..28c024d --- /dev/null +++ b/display/isRTL.txt @@ -0,0 +1,15 @@ + +isRTL *1.3* +=========== + +Displays the calendar in right-to-left mode. + +
+Boolean, *default*: `false` +
+ +This option is meant for right-to-left languages such as Arabic and Hebrew. + +
+In versions 1.1 through 1.2.1, this option was known as *rightToLeft*. +
diff --git a/display/render.txt b/display/render.txt new file mode 100644 index 0000000..af265ff --- /dev/null +++ b/display/render.txt @@ -0,0 +1,26 @@ + +render *1.3.1* +============== + +Immediately forces the calendar to render and/or readjusts its size. + +
+.fullCalendar( 'render' ) +
+ +This method is useful in the scenario where a tab setup might hide/show a calendar. Call this method whenever the tabs are shown. +Here is an example with the [jQuery UI tab plugin](http://jqueryui.com/demos/tabs/): + + $('#my-tabs').tabs({ + show: function(event, ui) { + $('#calendar').fullCalendar('render'); + } + }); + +Notice that this example calls `render` whenever *any* tab is shown, not just the tab that the calendar is within. +This is okay, because FullCalendar is smart enough to only render calendars that are visible to the user. + +
+Prior to version 1.4.2, the *render* method did not readjust the size of the calendar. It only +render the calendar if it was not already rendered. +
diff --git a/display/theme.txt b/display/theme.txt new file mode 100644 index 0000000..3640a2c --- /dev/null +++ b/display/theme.txt @@ -0,0 +1,14 @@ + +theme *1.3* +=========== + +Enables/disables use of jQuery UI themes. + +
+Boolean, *default*: `false` +
+ +Once you enable theming with `true`, you still need to include the CSS file for the +theme you want. For example, if you just downloaded a theme from the +[jQuery UI Themeroller](http://jqueryui.com/themeroller/), you need to put a `` +tag in your page's ``. diff --git a/display/viewDisplay.txt b/display/viewDisplay.txt new file mode 100644 index 0000000..772ecd5 --- /dev/null +++ b/display/viewDisplay.txt @@ -0,0 +1,28 @@ + +viewDisplay *1.3* +================= + +Triggered when the calendar loads and every time a different date-range is displayed. + +
+function( *view* ) { } +
+ +The calendar's date-range changes whenever the user switches to a new view +(for example, if they switch from "month" to "agendaWeek") or when they click the prev/next buttons. + +`view` is a [View Object](../views/View_Object). + +Within the callback function, `this` will be set to the calendar's main element. + +Example: + + $('#calendar').fullCalendar({ + viewDisplay: function(view) { + alert('The new title of the view is ' + view.title); + } + }); + +
+In versions 1.0 through 1.2.1, this option was known as *monthDisplay*. +
diff --git a/display/weekMode.txt b/display/weekMode.txt new file mode 100644 index 0000000..dc4c279 --- /dev/null +++ b/display/weekMode.txt @@ -0,0 +1,29 @@ + +weekMode *1.3* +============== + +Determines the number of weeks displayed in a month view. Also determines each week's height. + +
+String, *default*: `'fixed'` +
+ +Available options: + +`'fixed'` +: The calendar will always be 6 weeks tall. The height will always be the same, as determined by + [height](height), [contentHeight](), or [aspectRatio](). + +`'liquid'` +: The calendar will have either 4, 5, or 6 weeks, depending on the month. + The height of the weeks will stretch to fill the available height, as determined by + [height](height), [contentHeight](), or [aspectRatio](). + +`'variable'` +: The calendar will have either 4, 5, or 6 weeks, depending on the month. + Each week will have the same constant height, meaning the calendar’s height will change + month-to-month. + +
+In versions 1.0 through 1.2.1, this option was known as *fixedWeeks*. +
diff --git a/display/weekends.txt b/display/weekends.txt new file mode 100644 index 0000000..94d1b5f --- /dev/null +++ b/display/weekends.txt @@ -0,0 +1,9 @@ + +weekends *1.4.1* +================ + +Whether to include Saturday/Sunday columns in any of the calendar views. + +
+Boolean, *default*: `true` +
diff --git a/display/windowResize.txt b/display/windowResize.txt new file mode 100644 index 0000000..6784d30 --- /dev/null +++ b/display/windowResize.txt @@ -0,0 +1,27 @@ + +windowResize *1.3* +================== + +Triggered after the calendar's dimensions have been changed due to the browser window being resized. + +
+function( *view* ) { } +
+ +The calendar has automatically adapted to the new size when windowResize is triggered. + +`view` is a [View Object](../views/View_Object). + +Within the callback function, `this` will be set to the calendar's main element. + +Example: + + $('#calendar').fullCalendar({ + windowResize: function(view) { + alert('The calendar has adjusted to a window resize'); + } + }); + +
+In version 1.1 through 1.2.1, this option was known as *resize*. +
diff --git a/event_data/Event_Object.txt b/event_data/Event_Object.txt new file mode 100644 index 0000000..57d4167 --- /dev/null +++ b/event_data/Event_Object.txt @@ -0,0 +1,76 @@ + +Event Object +============ + +A standard object that FullCalendar uses to store information about an event. + +An Event Object has a number of properties, although only two of them are required +for `events`/`eventSources` (the `title` and `start` properties). Here they are: + +**id**: String/Integer (optional) +: Uniquely identifies the given event. Different instances of repeating events should all have the same `id`. + +**title**: String +: The text on an event's element + +**allDay**: `true` or `false` (optional) +: Whether an event occurs at a specific time-of-day. This property affects whether an event's time is shown. + Also, in the agenda views, determines if it is displayed in the "all-day" section. + + **Don't include quotes** around your `true`/`false`. This value is not a string! + + When specifying Event Objects for `events` or `eventSources`, + omitting this property will make it inherit from + [allDayDefault](), which is normally `false`. + +**start**: Date +: A JavaScript Date object indicating the date/time an event begins. + + When specifying Event Objects for `events` or `eventSources`, + you may specify a string in IETF format (ex: "Wed, 18 Oct 2009 13:00:00 EST"), + a string in ISO8601 format (ex: "2009-11-05T13:15:30Z") or a UNIX timestamp. + +**end**: Date (optional) +: A Javascript Date object indicating the date/time an event ends. + As with `start`, you may specify it in IETF, ISO8601, or UNIX timestamp format. + + **If an event is all-day**... + + the end date is inclusive. This means an event with `start` Nov 10 and + `end` Nov 12 will span 3 days on the calendar. + + **If an event is NOT all-day**... + + the end date is exclusive. This is only a gotcha when your `end` has time 00:00. + It means your event ends on midnight, and it will not span through the next day. + +**url**: String (optional) +: A URL that will be visited when this event is clicked by the user. + For more information on controlling this behavior, see the [eventClick](../clicking_hovering/eventClick) callback. + +**className**: String/Array (optional) +: A CSS class (or array of classes) that will be attached to this event's element. + +**editable**: `true` or `false` (optional) +: Overrides the master [editable]() option for this single event. + +**source**: Array/String/Function (automatically populated) +: A reference to the event source (as specified in `events` or `eventSources`) + that this event came from. + + Do not worry about populating this value, FullCalendar will do this automatically. + + +In addition to the fields above, you may also include your own non-standard fields +in each Event Object. FullCalendar will not modify or delete these fields. +For example, developers often include a `description` field for use in callbacks such +as [eventRender](../event_rendering/eventRender). + +
+Prior to version 1.3, the *allDay* property did not exist. *showTime* was used instead, +and was set to *true* to guarantee that an event's time was shown. + +The *className* and *source* properties did not exist prior to version 1.2. +
+ + diff --git a/event_data/addEventSource.txt b/event_data/addEventSource.txt new file mode 100644 index 0000000..2c8c965 --- /dev/null +++ b/event_data/addEventSource.txt @@ -0,0 +1,12 @@ + +addEventSource *1.2* +==================== + +Dynamically adds an event source. + +
+.fullCalendar( 'addEventSource', *source* ) +
+ +Source may be an Array/URL/Function just as in the `events` option. +Events will be immediately fetched from this source and placed on the calendar. diff --git a/event_data/allDayDefault.txt b/event_data/allDayDefault.txt new file mode 100644 index 0000000..d04bb88 --- /dev/null +++ b/event_data/allDayDefault.txt @@ -0,0 +1,9 @@ + +allDayDefault *1.3.1* +===================== + +Determines the default value for each [Event Object]()'s `allDay` property, when it is unspecified. + +
+Boolean, *default*: `true` +
diff --git a/event_data/cacheParam.txt b/event_data/cacheParam.txt new file mode 100644 index 0000000..5f6bded --- /dev/null +++ b/event_data/cacheParam.txt @@ -0,0 +1,11 @@ + +cacheParam *1.1* +================ + +A GET parameter of this name will be inserted into each JSON feed's URL to prevent caching. + +
+String, *default*: `'_'` +
+ +The value will be the current millisecond time. diff --git a/event_data/clientEvents.txt b/event_data/clientEvents.txt new file mode 100644 index 0000000..02b275a --- /dev/null +++ b/event_data/clientEvents.txt @@ -0,0 +1,23 @@ + +clientEvents *1.3* +================== + +Retrieves events that FullCalendar has in memory. + +
+.fullCalendar( 'clientEvents' [, *idOrFilter* ] ) +
+ +This method will return an array of [Event Objects](Event_Object) that FullCalendar has stored +in client-side memory. + +If `idOrFilter` is omitted, *all* events will be returned. + +If `idOrFilter` is an ID, all events with the same ID will be returned. + +`idOrFilter` may also be a filter function that accepts one [Event Object]() +argument and returns `true` if it should be included in the result set. + +
+In versions 1.2 and 1.2.1, this option was known as *getEventsByID* +
diff --git a/event_data/endParam.txt b/event_data/endParam.txt new file mode 100644 index 0000000..ee863f2 --- /dev/null +++ b/event_data/endParam.txt @@ -0,0 +1,11 @@ + +endParam +======== + +A GET parameter of this name will be inserted into each JSON feed's URL. + +
+String, *default*: `'end'` +
+ +The value of this GET parameter will be a UNIX timestamp denoting the end of the last visible day (exclusive). diff --git a/event_data/eventSources.txt b/event_data/eventSources.txt new file mode 100644 index 0000000..a937d3b --- /dev/null +++ b/event_data/eventSources.txt @@ -0,0 +1,21 @@ + +eventSources *1.2* +================== + +A way to specify multiple event sources. + +
+Array +
+ +This option is used instead of the `events` option. +It can take an Array of Arrays/Functions/URLs (anything that the `events` option would take). + +Here is an example calendar that displays two [JSON feeds](events_json_feed): + + $('#calendar').fullCalendar({ + eventSources: [ + '/feed1.php', + '/feed2.php' + ] + }); diff --git a/event_data/events_array.txt b/event_data/events_array.txt new file mode 100644 index 0000000..e3d6a27 --- /dev/null +++ b/event_data/events_array.txt @@ -0,0 +1,26 @@ + +events (as an array) +==================== + +An array of [Event Objects](Event_Object) that will be displayed on the calendar. + +Here is an example of how to specify an array of events: + + $('#calendar').fullCalendar({ + events: [ + { + title : 'event1', + start : '2010-01-01' + }, + { + title : 'event2', + start : '2010-01-05', + end : '2010-01-07' + }, + { + title : 'event3', + start : '2010-01-09 12:30:00', + allDay : false // will make the time show + } + ] + }); diff --git a/event_data/events_function.txt b/event_data/events_function.txt new file mode 100644 index 0000000..5ccb052 --- /dev/null +++ b/event_data/events_function.txt @@ -0,0 +1,54 @@ + +events (as a function) +====================== + +A custom function for programmatically generating [Event Objects](Event_Object). + +
+function( *start*, *end*, *callback* ) { } +
+ +FullCalendar will call this function whenever it needs new event data. +This is triggered when the user clicks prev/next or switches views. + +This function will be given `start` and `end` parameters, which are +Date objects denoting the range the calendar needs events for. + +It will also be given `callback`, a function that must be called when +the custom event function has generated its events. It is the event function's +responsibility to make sure `callback` is being called with an array of +[Event Objects](Event_Object). + +Here is an example showing how to use an event function to fetch events from +an XML feed: + + $('#calendar').fullCalendar({ + events: function(start, end, callback) { + $.ajax({ + url: 'myxmlfeed.php', + dataType: 'xml', + data: { + // our hypothetical feed requires UNIX timestamps + start: Math.round(start.getTime() / 1000), + end: Math.round(end.getTime() / 1000) + }, + success: function(doc) { + + var events = []; + + $(doc).find('event').each(function() { + event.push({ + title: $(this).attr('title'), + start: $(this).attr('start') // will be parsed + }); + }); + + callback(events); + + } + }); + } + }); + +However, if you have the choice, JSON is a better idea because you can just specify a +[feed URL](events_json_feed). diff --git a/event_data/events_json_feed.txt b/event_data/events_json_feed.txt new file mode 100644 index 0000000..d0fc5b5 --- /dev/null +++ b/event_data/events_json_feed.txt @@ -0,0 +1,31 @@ + +events (as a json feed) +======================= + +A URL of a JSON feed that the calendar will fetch [Event Objects](Event_Object) from. + +FullCalendar will visit the URL whenever it needs new event data. +This happens when the user clicks prev/next or changes views. +FullCalendar will determine the date-range it needs events for and will +pass that information along in GET parameters. + +The GET parameter names will be determined by the [startParam]() and [endParam]() options. +(`"start"` and `"end"` by default). + +The value of the parameters will always be UNIX timestamps (seconds since 1970). + +Consider the following script: + + $('#calendar').fullCalendar({ + events: "/myfeed.php" + }); + +Here is a URL that might be visited: + +`/myfeed.php?start=1262332800&end=1265011200&_=1263178646` + +The `_` parameter is automatically inserted to prevent the browser from +caching the result (see [cacheParam]()). + +If you need to access a feed that is in a different domain, you can use JSONP +with a `?` in your URL (see the JSONP discussion in [$.ajax](http://api.jquery.com/jQuery.ajax/)). diff --git a/event_data/index.txt b/event_data/index.txt new file mode 100644 index 0000000..7955ff3 --- /dev/null +++ b/event_data/index.txt @@ -0,0 +1,24 @@ + +Event Data +========== + + + +See also: [renderEvent]() (for adding an event) diff --git a/event_data/loading.txt b/event_data/loading.txt new file mode 100644 index 0000000..3a1f13b --- /dev/null +++ b/event_data/loading.txt @@ -0,0 +1,15 @@ + +loading +======= + +Triggered when event fetching starts/stops. + +
+function( *isLoading*, *view* ) +
+ +Triggered with a `true` argument when the calendar begins fetching events via AJAX. Triggered with `false` when done. + +Last argument is the current [View Object](../views/View_Object). + +This function is often used to show/hide a loading indicator. diff --git a/event_data/refetchEvents.txt b/event_data/refetchEvents.txt new file mode 100644 index 0000000..540c052 --- /dev/null +++ b/event_data/refetchEvents.txt @@ -0,0 +1,13 @@ + +refetchEvents *1.3* +=================== + +Refetches events from all sources and rerenders them on the screen. + +
+.fullCalendar( 'refetchEvents' ) +
+ +
+Prior to version 1.3, the same effect was achieved by the *refresh* method. +
diff --git a/event_data/removeEventSource.txt b/event_data/removeEventSource.txt new file mode 100644 index 0000000..5bc1006 --- /dev/null +++ b/event_data/removeEventSource.txt @@ -0,0 +1,12 @@ + +removeEventSource *1.2* +======================= + +Dynamically removes an event source. + +
+.fullCalendar( 'removeEventSource', *source* ) +
+ +Source must be a reference to the original Array/URL/Function. +Events from the source will immediately be removed from the calendar. diff --git a/event_data/removeEvents.txt b/event_data/removeEvents.txt new file mode 100644 index 0000000..35f58d5 --- /dev/null +++ b/event_data/removeEvents.txt @@ -0,0 +1,17 @@ + +removeEvents *1.2* +================== + +Removes events from the calendar. + +
+.fullCalendar( 'removeEvents' [, *idOrFilter* ] ) +
+ +If `idOrFilter` is omitted, *all* events are removed. + +If `idOrFilter` is an ID, all events with the same ID will be removed. + +`idOrFilter` may also be a filter function that accepts one [Event Object]() +argument and returns `true` if it should be removed. + diff --git a/event_data/startParam.txt b/event_data/startParam.txt new file mode 100644 index 0000000..fbea4fa --- /dev/null +++ b/event_data/startParam.txt @@ -0,0 +1,11 @@ + +startParam +========== + +A GET parameter of this name will be inserted into each JSON feed's URL. + +
+String, *default*: `'start'` +
+ +The value of this GET parameter will be a UNIX timestamp denoting the start of the first visible day (inclusive). diff --git a/event_data/updateEvent.txt b/event_data/updateEvent.txt new file mode 100644 index 0000000..5c99f11 --- /dev/null +++ b/event_data/updateEvent.txt @@ -0,0 +1,26 @@ + +updateEvent *1.2* +================= + +Reports changes to an event and renders them on the calendar. + +
+.fullCalendar( 'updateEvent', *event* ) +
+ +`event` must be the original [Event Object]() for an event, +**NOT** merely a reconstructed object. +The original Event Object can obtained by callbacks such as [eventClick](../clicking_hovering/eventClick), +or by the [clientEvents]() method. + +Here is how you might update an event after a click: + + $('#calendar').fullCalendar({ + eventClick: function(event, element) { + + event.title = "CLICKED!"; + + $('#calendar').fullCalendar('updateEvent', event); + + } + }); diff --git a/event_rendering/Colors.txt b/event_rendering/Colors.txt new file mode 100644 index 0000000..fc10def --- /dev/null +++ b/event_rendering/Colors.txt @@ -0,0 +1,36 @@ + +Event Colors +============ + +You can modify the default color that affects all events by adding some css in the following form: + + .fc-event, + .fc-agenda .fc-event-time, + .fc-event a { + background-color: black; /* background color */ + border-color: black; /* border color */ + color: red; /* text color */ + } + +You can also change the color for certain events by using the `className` property of each [Event Object](../event_data/Event_Object). +Here is an example of the CSS you would write if your `className` was "holiday": + + .holiday, + .fc-agenda .holiday .fc-event-time, + .holiday a { + background-color: green; /* background color */ + border-color: green; /* border color */ + color: yellow; /* text color */ + } + +If you are using the "default" and "className" techniques together, +make sure the CSS for the "default" technique comes first. + + + +
+Versions prior to 1.3 had different ways of setting colors through CSS. +Check your version's *fullcalendar.css* for an example. +
diff --git a/event_rendering/eventAfterRender.txt b/event_rendering/eventAfterRender.txt new file mode 100644 index 0000000..a68fc9c --- /dev/null +++ b/event_rendering/eventAfterRender.txt @@ -0,0 +1,9 @@ + +eventAfterRender *1.4.2* +======================== + +Triggered after an event has been placed on the calendar in its final position. + +
+function( *event*, *element*, *view* ) { } +
diff --git a/event_rendering/eventRender.txt b/event_rendering/eventRender.txt new file mode 100644 index 0000000..91c41c5 --- /dev/null +++ b/event_rendering/eventRender.txt @@ -0,0 +1,40 @@ + +eventRender +=========== + +Triggered while an event is being rendered. + +
+function( *event*, *element*, *view* ) { } +
+ +`event` is the [Event Object](../event_data/Event_Object) that is attempting to be rendered. + +`element` is a newly created jQuery `
` that will be used for rendering. +It has already been populated with the correct time/title. + +The `eventRender` callback function can modify `element`, return a brand new +DOM element that will be used for rendering instead, or it can return `false`, +which will prevent the event from being rendered at all. + +`eventRender` is a great way to attach other jQuery plugins to event elements, +such as a [qTip](http://craigsworks.com/projects/qtip/) tooltip effect: + + $('#calendar').fullCalendar({ + events: [ + { + title: 'My Event', + start: '2010-01-01', + description: 'This is a cool event' + } + // more events here + ], + eventRender: function(event, element) { + element.qtip({ + content: event.description + }); + } + }); + +Note that `description` is a non-standard Event Object field, which is allowed. + diff --git a/event_rendering/index.txt b/event_rendering/index.txt new file mode 100644 index 0000000..2c4a361 --- /dev/null +++ b/event_rendering/index.txt @@ -0,0 +1,11 @@ + +Event Rendering +=============== + + diff --git a/event_rendering/renderEvent.txt b/event_rendering/renderEvent.txt new file mode 100644 index 0000000..8bfed4c --- /dev/null +++ b/event_rendering/renderEvent.txt @@ -0,0 +1,15 @@ + +renderEvent *1.3* +================= + +Renders a new event on the calendar. + +
+.fullCalendar( 'renderEvent', *event* [, *stick* ] ) +
+ +`event` must be an [Event Object](../event_data/Event_Object) with a `title` and `start` at the very least. + +Normally, the event will disappear once the calendar refetches its event sources (example: when prev/next is clicked). +However, specifying `stick` as `true` will cause the event to be permanently fixed to the calendar. + diff --git a/event_rendering/rerenderEvents.txt b/event_rendering/rerenderEvents.txt new file mode 100644 index 0000000..22dfddc --- /dev/null +++ b/event_rendering/rerenderEvents.txt @@ -0,0 +1,13 @@ + +rerenderEvents *1.3* +==================== + +Rerenders all events on the calendar. + +
+.fullCalendar( 'rerenderEvents' ) +
+ +
+Prior to version 1.3, the same effect could be achieved by the *refresh* method. +
diff --git a/event_ui/Requirements.txt b/event_ui/Requirements.txt new file mode 100644 index 0000000..c068487 --- /dev/null +++ b/event_ui/Requirements.txt @@ -0,0 +1,21 @@ + +Requirements for Event Dragging & Resizing +========================================== + +Event dragging and resizing requires the following jQuery UI modules: + +- jQuery UI core +- [Draggable](http://jqueryui.com/demos/draggable/) (the Droppable module is **not** required) +- [Resizable](http://jqueryui.com/demos/resizable/) + +These modules can be conveniently bundled/compressed/downloaded at the jQuery UI +[downloads page](http://jqueryui.com/download). +They are also included in the FullCalendar download in the "jquery" directory, +though as uncompressed files. + +After you have gathered the dependencies, **you still need to enable dragging/resizing** +by settings the [editable]() option to `true`. + + diff --git a/event_ui/disableDragging.txt b/event_ui/disableDragging.txt new file mode 100644 index 0000000..3880887 --- /dev/null +++ b/event_ui/disableDragging.txt @@ -0,0 +1,9 @@ + +disableDragging *1.3* +===================== + +Disables all event dragging, even when events are editable. + +
+Boolean, *default*: `false` +
diff --git a/event_ui/disableResizing.txt b/event_ui/disableResizing.txt new file mode 100644 index 0000000..85614d4 --- /dev/null +++ b/event_ui/disableResizing.txt @@ -0,0 +1,9 @@ + +disableResizing *1.3* +===================== + +Disables all event resizing, even when events are editable. + +
+Boolean, *default*: `false` +
diff --git a/event_ui/dragOpacity.txt b/event_ui/dragOpacity.txt new file mode 100644 index 0000000..6a0cb8d --- /dev/null +++ b/event_ui/dragOpacity.txt @@ -0,0 +1,28 @@ + +dragOpacity *1.3* +================= + +The opacity of an event when it is being dragged. + +
+Float/[View Option Hash](../views/View_Option_Hash), *default*: + + { + // for agendaWeek and agendaDay + agenda: .5, + + // for all other views + '': 1.0 + } +
+ +Float values range from 0.0 to 1.0. + +Specify a single number to affect all views, or a [View Option Hash](../views/View_Option_Hash) to target specific views +(which is what the default does). + +
+A View Option Hash can only be provided in version 1.4 and later. + +Prior to version 1.3, this option was known as *eventDragOpacity* +
diff --git a/event_ui/dragRevertDuration.txt b/event_ui/dragRevertDuration.txt new file mode 100644 index 0000000..37a0757 --- /dev/null +++ b/event_ui/dragRevertDuration.txt @@ -0,0 +1,15 @@ + +dragRevertDuration *1.3* +======================== + +Time it takes for an event to revert to its original position after an unsuccessful drag. + +
+Integer, *default*: `500` +
+ +Time is in milliseconds (1 second = 1000 milliseconds). + +
+Prior to version 1.3, this option was known as *eventRevertDuration* +
diff --git a/event_ui/editable.txt b/event_ui/editable.txt new file mode 100644 index 0000000..530854c --- /dev/null +++ b/event_ui/editable.txt @@ -0,0 +1,22 @@ + +editable *1.3* +============== + +Determines whether the events on the calendar can be modified. + +
+Boolean, *default*: `false` +
+ +This determines if the events can be *dragged* and *resized*. +Enables/disables both at the same time. If you don't want both, +use `editable` in conjunction with [disableDragging]() and [disableResizing](). + +This option can be overridden on a per-event basis with the +[Event Object](../event_data/Event_Object) `editable` property. + +
+Prior to version 1.3, the *draggable* option was used instead. +
+ + diff --git a/event_ui/eventDragStart.txt b/event_ui/eventDragStart.txt new file mode 100644 index 0000000..060d006 --- /dev/null +++ b/event_ui/eventDragStart.txt @@ -0,0 +1,18 @@ + +eventDragStart +============== + +Triggered when event dragging begins. + +
+function( *event*, *jsEvent*, *ui*, *view* ) { } +
+ +`event` is an [Event Object](../event_data/Event_Object) that hold the event's information (date, title, etc). + +`jsEvent` holds the native javascript event with low-level information such as +click coordinates. + +`ui` holds the [jQuery UI object](http://jqueryui.com/demos/draggable/). + +`view` holds the current [View Object](../views/View_Object). diff --git a/event_ui/eventDragStop.txt b/event_ui/eventDragStop.txt new file mode 100644 index 0000000..820ae92 --- /dev/null +++ b/event_ui/eventDragStop.txt @@ -0,0 +1,23 @@ + +eventDragStop +============= + +Triggered when event dragging stops. + +
+function( *event*, *jsEvent*, *ui*, *view* ) { } +
+ +This callback is *guaranteed* to be triggered after the user drags an event, +even if the event doesn't change date/time. It is triggered before the event's +information has been modified (if moved to a new date/time) and before the +[eventDrop]() callback is triggered. + +`event` is an [Event Object](../event_data/Event_Object) that hold the event's information (date, title, etc). + +`jsEvent` holds the native JavaScript event with low-level information such as +mouse coordinates. + +`ui` holds the [jQuery UI object](http://jqueryui.com/demos/draggable/). + +`view` holds the current [View Object](../views/View_Object). diff --git a/event_ui/eventDrop.txt b/event_ui/eventDrop.txt new file mode 100644 index 0000000..097cd12 --- /dev/null +++ b/event_ui/eventDrop.txt @@ -0,0 +1,73 @@ + +eventDrop +========= + +Triggered when dragging stops and the event has moved to a *different* day/time. + +
+function( *event*, *dayDelta*, *minuteDelta*, *allDay*, *revertFunc*, *jsEvent*, *ui*, *view* ) { } +
+ +`event` is an [Event Object](../event_data/Event_Object) that hold the event's information (date, title, etc). + +`dayDelta` holds the number of days the event was moved forward (a positive number) or backwards (a negative number). + +`minuteDelta` holds the number of minutes the event was moved forward (a positive number) or backwards (a negative number). +Only useful for the agenda views. In other views, `0` is passed in. + +`dayDelta` and `minuteDelta` are elegant for dealing with multi-day and repeating events. +If updating a remote database, just add these values to the start and end times of all events with the given `event.id`. + +`allDay` is `true` if the event has been dropped on a day in month view, or the "all-day" slot in the agenda views. +It will be `false` if dropped on a slot in the agenda views (meaning it has been assigned a time). + +`revertFunc` is a function that, if called, reverts the event's start/end date to the values before the drag. +This is useful if an ajax call should fail. + +`jsEvent` holds the native javascript event with low-level information such as +mouse coordinates. + +`ui` holds the [jQuery UI object](http://jqueryui.com/demos/draggable/). + +`view` holds the current [View Object](../views/View_Object). + +Here is an example demonstrating most of these arguments: + + $('#calendar').fullCalendar({ + events: [ + // events here + ], + editable: true, + eventDrop: function(event,dayDelta,minuteDelta,allDay,revertFunc) { + + alert( + event.title + " was moved " + + (dayDelta < 0 ? "back" : "forward") + + dayDelta + " days and " + + (minuteDelta < 0 ? "back" : "forward") + + minuteDelta + " minutes." + ); + + if (allDay) { + alert("Event is now all-day"); + }else{ + alert("Event has a time-of-day"); + } + + if (!confirm("Are you sure about this change?")) { + revertFunc(); + } + + } + }); + + + +
+ +Prior to version 1.4, the *allDay* paramameter was not included. + +Prior to version 1.3, the *revertFunc* parameter was not included. + +
+ diff --git a/event_ui/eventResize.txt b/event_ui/eventResize.txt new file mode 100644 index 0000000..970ce6b --- /dev/null +++ b/event_ui/eventResize.txt @@ -0,0 +1,54 @@ + +eventResize *1.3* +================= + +Triggered when resizing stops and the event has changed in duration. + +
+function( *event*, *dayDelta*, *minuteDelta*, *revertFunc*, *jsEvent*, *ui*, *view* ) { } +
+ +`event` is an [Event Object](../event_data/Event_Object) that hold the event's information (date, title, etc). + +`dayDelta` holds the number of days the event's end date was moved forward (a positive number) or backwards (a negative number). + +`minuteDelta` holds the number of minutes the event's end time was moved forward (a positive number) or backwards (a negative number). +Only useful for the agenda views. In other views, `0` is passed in. + +`dayDelta` and `minuteDelta` are elegant for dealing with multi-day and repeating events. +If updating a remote database, just add these values to the *end* of all events with the given `event.id`. + +`revertFunc` is a function that, if called, reverts the event's end date to the value before the drag. +This is useful if an ajax call should fail. + +`jsEvent` holds the native javascript event with low-level information such as +mouse coordinates. + +`ui` holds the [jQuery UI object](http://jqueryui.com/demos/draggable/). + +`view` holds the current [View Object](../views/View_Object). + +Here is an example demonstrating most of these arguments: + + $('#calendar').fullCalendar({ + events: [ + // events here + ], + editable: true, + eventResize: function(event,dayDelta,minuteDelta,revertFunc) { + + alert( + "The end date of " + event.title + + "has been moved " + + (dayDelta < 0 ? "back" : "forward") + + dayDelta + " days and " + + (minuteDelta < 0 ? "back : "forward") + + minuteDelta + " minutes." + ); + + if (!confirm("is this okay?")) { + revertFunc(); + } + + } + }); diff --git a/event_ui/eventResizeStart.txt b/event_ui/eventResizeStart.txt new file mode 100644 index 0000000..21ae563 --- /dev/null +++ b/event_ui/eventResizeStart.txt @@ -0,0 +1,18 @@ + +eventResizeStart *1.3* +====================== + +Triggered when event resizing begins. + +
+function( *event*, *jsEvent*, *ui*, *view* ) { } +
+ +`event` is an [Event Object](../event_data/Event_Object) that hold the event's information (date, title, etc). + +`jsEvent` holds the native JavaScript event with low-level information such as +click coordinates. + +`ui` holds the [jQuery UI object](http://jqueryui.com/demos/draggable/). + +`view` holds the current [View Object](../views/View_Object). diff --git a/event_ui/eventResizeStop.txt b/event_ui/eventResizeStop.txt new file mode 100644 index 0000000..cce8fa1 --- /dev/null +++ b/event_ui/eventResizeStop.txt @@ -0,0 +1,23 @@ + +eventResizeStop *1.3* +===================== + +Triggered when event resizing stops. + +
+function( *event*, *jsEvent*, *ui*, *view* ) { } +
+ +This callback is *guaranteed* to be triggered after the user resizes an event, +even if the event doesn't change in duration. It is triggered before the event's +information has been modified (if changed in duration) and before the +[eventResize]() callback is triggered. + +`event` is an [Event Object](../event_data/Event_Object) that hold the event's information (date, title, etc). + +`jsEvent` holds the native JavaScript event with low-level information such as +mouse coordinates. + +`ui` holds the [jQuery UI object](http://jqueryui.com/demos/draggable/). + +`view` holds the current [View Object](../views/View_Object). diff --git a/event_ui/index.txt b/event_ui/index.txt new file mode 100644 index 0000000..966f976 --- /dev/null +++ b/event_ui/index.txt @@ -0,0 +1,18 @@ + +Event Dragging & Resizing +========================= + + diff --git a/google_calendar.txt b/google_calendar.txt new file mode 100644 index 0000000..7357c80 --- /dev/null +++ b/google_calendar.txt @@ -0,0 +1,84 @@ + +Google Calendar +=============== + +FullCalendar can be made to display events from a public [Google Calendar](http://calendar.google.com/). +Google Calendar can serve as a backend that manages and persistently stores event data +(a feature that FullCalendar currently lacks). + +**To get started, you must first make your Google Calendar public:** + +1. In the Google Calendar interface, locate the "My Calendar" box on the left. +2. Click the arrow next to the calendar you need. +3. A menu will appear. Click "Share this calendar." +4. Check "Make this calendar public." +5. Make sure "Share only my free/busy information" is **unchecked**. +6. Click "Save." + +**Then, you must obtain your calendar's XML feed URL:** + +1. In the Google Calendar interface, locate the "My Calendar" box on the left +2. Click the arrow next to the calendar you need. +3. A menu will appear. Click "Calendar settings." +4. In the "Calendar Address" section of the screen, click the XML badge. +5. Your feed's URL will appear. + +**Now it's time to initialize your calendar in JavaScript.** +You will use the `$.fullCalendar.gcalFeed` function with the `events` option, like so: + + $(document).ready(function() { + + // page is now ready, initialize the calendar... + + $('#calendar').fullCalendar({ + events: $.fullCalendar.gcalFeed( + "http://www.google.com/your_feed_url/" + ) + }); + + }); + +If you wanted to import more than one Google Calendar, you would use the `events` option. + + + +Options +------- + +You can tweak the way FullCalendar imports your Google Calendar events through these options: + +- **className** - CSS class to attach to each event +- **editable** - whether to allow dragging/resizing (default: `false`) +- **currentTimezone** - a string like "America/Chicago". + Consult [http://php.net/manual/en/timezones.php](http://php.net/manual/en/timezones.php) for a full list. + +Here is an example of how you'd use these options: + + $('#calendar').fullCalendar({ + events: $.fullCalendar.gcalFeed( + "http://www.google.com/your_feed_url/", + { + // put your options here + className: 'gcal-event', + editable: true, + currentTimezone: 'America/Chicago' + } + ) + }); + + + +Timezones Gotchas +----------------- + +Sometimes it can be confusing as to why FullCalendar displays event times differently than the Google Calendar interface. +There are the two factors involved in this: + +- *the calendar's timezone*, accessed through "Calendar settings" after clicking the arrow next to the calendar's name +- *your Google Account's timezone*, accessed through the "Settings" link at the top right of the Google Calendar screen (near the "Sign out" link) + +When both timezones are the same, you should have no problems. When they are different, FullCalendar will display times in the *calendar's* timezone. +Thus, times will be different than what you see in the Google Calendar interface because they are being adjusted to the GMT of the calendar. +The solution is to use the `currentTimezone` option. If this is set to the same timezone as your Google Account, all dates should appear consistent. + + diff --git a/index.txt b/index.txt new file mode 100644 index 0000000..36b9e40 --- /dev/null +++ b/index.txt @@ -0,0 +1,13 @@ + +- [Basic Usage](usage) +- [Google Calendar](google_calendar) +- [General Display](display) +- [Views](views) +- [Agenda Options](agenda) +- [Current Date](current_date) +- [Text/Time Customization](text_customization) +- [Clicking & Hovering](mouse) +- [Event Data](event_data) +- [Event Rendering](event_rendering) +- [Event Dragging & Resizing](event_ui) +- [Utilities](utilities) diff --git a/mouse/dayClick.txt b/mouse/dayClick.txt new file mode 100644 index 0000000..4786901 --- /dev/null +++ b/mouse/dayClick.txt @@ -0,0 +1,46 @@ + +dayClick +======== + +Triggered when the user clicks on a day. + +
+function( *date*, *allDay*, *jsEvent*, *view* ) { } +
+ +`date` holds a Date object for the current day. If user has clicked on a slot in the +agendaWeek or agendaDay views, `date` will also have its time set. + +`allDay` will be set to true `false` if the user has clicked on a slot in the +agendaWeek or agendaDay views. Otherwise, it will be `true`. + +`jsEvent` holds the native JavaScript event with low-level information such as click coordinates. + +`view` is set to the current [View Object](../views/View_Object). + +Within the callback function, `this` is set to the TD element of the clicked day. + +Here is an example that demonstrates all of these variables: + + $('#calendar').fullCalendar({ + dayClick: function(date, allDay, jsEvent, view) { + + if (allDay) { + alert('Clicked on the entire day: ' + date); + }else{ + alert('Clicked on the slot: ' + date); + } + + alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY); + + alert('Current view: ' + view.name); + + // change the day's background color just for fun + $(this).css('background-color', 'red'); + + } + }); + +
+The *allDay* parameter has only been available since version 1.4. +
diff --git a/mouse/eventClick.txt b/mouse/eventClick.txt new file mode 100644 index 0000000..e9287be --- /dev/null +++ b/mouse/eventClick.txt @@ -0,0 +1,54 @@ + +eventClick +========== + +Triggered when the user clicks an event. + +
+function( *calEvent*, *jsEvent*, *view* ) { } +
+ +`calEvent` is an [Event Object](../event_data/Event_Object) that holds the event's information (date, title, etc). + +`jsEvent` holds the native JavaScript event with low-level information such as click coordinates. + +`view` holds the current [View Object](../views/View_Object). + +Within the callback function, `this` is set to the event's `
` element. + +Here is an example demonstrating all these variables: + + $('#calendar').fullCalendar({ + eventClick: function(calEvent, jsEvent, view) { + + alert('Event: ' + calEvent.title); + alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY); + alert('View: ' + view.name); + + // change the text color of the event + $(this).css('color', 'red'); + + } + }); + + +Return Value +------------ + +Normally, if the [Event Object](../event_data/Event_Object) has its `url` property set, a click on the event +will cause the browser to visit the event's url (in the same window/tab). +Returning `false` from within your function will prevent this from happening. + +Often developers want an event's `url` to open in a different tab or a popup window. +The following example shows how to do this: + + $('#calendar').fullCalendar({ + eventClick: function(calEvent, jsEvent, view) { + if (calEvent.url) { + window.open(calEvent.url); + return false; + } + } + }); + +The `window.open` function can take [many other options](http://www.w3schools.com/jsref/met_win_open.asp). diff --git a/mouse/eventMouseout.txt b/mouse/eventMouseout.txt new file mode 100644 index 0000000..555c4f3 --- /dev/null +++ b/mouse/eventMouseout.txt @@ -0,0 +1,17 @@ + +eventMouseout +============= + +Triggered when the user mouses out of an event. + +
+function( *calEvent*, *jsEvent*, *view* ) { } +
+ +`calEvent` is an [Event Object](../event_data/Event_Object) that holds the event's information (date, title, etc). + +`jsEvent` holds the native JavaScript event with low-level information such as click coordinates. + +`view` holds the current [View Object](../views/View_Object). + +Within the callback function, `this` is set to the event's `
` element. diff --git a/mouse/eventMouseover.txt b/mouse/eventMouseover.txt new file mode 100644 index 0000000..c9e635b --- /dev/null +++ b/mouse/eventMouseover.txt @@ -0,0 +1,18 @@ + +eventMouseover +============== + +Triggered when the user mouses over an event. + +
+function( *calEvent*, *jsEvent*, *view* ) { } +
+ +`calEvent` is an [Event Object](../event_data/Event_Object) that holds the event's information (date, title, etc). + +`jsEvent` holds the native JavaScript event with low-level information such as click coordinates. + +`view` holds the current [View Object](../views/View_Object). + +Within the callback function, `this` is set to the event's `
` element. + diff --git a/mouse/index.txt b/mouse/index.txt new file mode 100644 index 0000000..a5130ec --- /dev/null +++ b/mouse/index.txt @@ -0,0 +1,10 @@ + +Clicking & Hovering +=================== + + diff --git a/removed/abbrevDayHeadings.txt b/removed/abbrevDayHeadings.txt new file mode 100644 index 0000000..2d71616 --- /dev/null +++ b/removed/abbrevDayHeadings.txt @@ -0,0 +1,13 @@ + +abbrevDayHeadings +================= + +
+This option was removed in version 1.3. Use [columnFormat](../text_customization/columnFormat) instead. +
+ +Whether to display "Sun" versus "Sunday" for days of the week. + +
+Boolean, *default*: `true` +
diff --git a/removed/addEvent.txt b/removed/addEvent.txt new file mode 100644 index 0000000..107ea6f --- /dev/null +++ b/removed/addEvent.txt @@ -0,0 +1,14 @@ + +addEvent +======== + +
+This method was removed in version 1.3. Please use [renderEvent](../event_rendering/renderEvent) with the *stick* parameter +set to `true` to achieve the same effect. +
+ +Dynamically adds an [Event Object](../event_data/Event_Object) to the calendar. + +
+.fullCalendar( 'addEvent', *event* ) +
diff --git a/removed/buttons.txt b/removed/buttons.txt new file mode 100644 index 0000000..b8f67ff --- /dev/null +++ b/removed/buttons.txt @@ -0,0 +1,32 @@ + +buttons +======= + +
+This option was removed in 1.3 in favor of [header](../display/header) and [buttonText](../text_customization/buttonText). +
+ +Defines the buttons and button-text at the top of the calendar. + +
+Boolean/Object, *default*: `true` +
+ +`true` will display a previous-month, next-month, and "today" button. +The "today" button will only be visible for months other than the current. + +`false` will display absolutely no buttons. + +An object hash can be provided to display only *certain* buttons. +The hash can have the following properties: + + { + today: bool/string, + prevYear: bool/string, + prevMonth: bool/string, + nextMonth: bool/string, + nextYear: bool/string + } + +A value of `false` will not display the button. A value of `true` will display the button with some default text. +A string value will display the button *and* customize its text. diff --git a/removed/draggable.txt b/removed/draggable.txt new file mode 100644 index 0000000..6894a7f --- /dev/null +++ b/removed/draggable.txt @@ -0,0 +1,16 @@ + +draggable +========= + +
+This option was removed in version 1.3. Use [editable](../event_ui/editable) and +[disableDragging](../event_ui/disableDragging) instead. +
+ +Enables/disables dragging. + +
+Boolean, *default*: `false` +
+ +jQuery UI core & draggables required. diff --git a/removed/eventDragOpacity.txt b/removed/eventDragOpacity.txt new file mode 100644 index 0000000..ba309c4 --- /dev/null +++ b/removed/eventDragOpacity.txt @@ -0,0 +1,7 @@ + +eventDragOpacity +================ + +
+In version 1.3, this option was renamed to [dragOpacity](../event_ui/dragOpacity). +
diff --git a/removed/eventRevertDuration.txt b/removed/eventRevertDuration.txt new file mode 100644 index 0000000..fa14da5 --- /dev/null +++ b/removed/eventRevertDuration.txt @@ -0,0 +1,7 @@ + +eventRevertDuration +=================== + +
+In version 1.3, this option was renamed to [dragRevertDuration](../event_ui/dragRevertDuration). +
diff --git a/removed/fixedWeeks.txt b/removed/fixedWeeks.txt new file mode 100644 index 0000000..87ece4d --- /dev/null +++ b/removed/fixedWeeks.txt @@ -0,0 +1,15 @@ + +fixedWeeks +========== + +
+This option was removed in version 1.3. Use [weekMode](../display/weekMode) instead. +
+ +Determines the number of weeks shown in each month. + +
+Boolean, *default*: `true` +
+ +If `true`, the calendar will always be 6 weeks tall. If `false`, the calendar’s height will vary per month. diff --git a/removed/getEventsById.txt b/removed/getEventsById.txt new file mode 100644 index 0000000..af9f873 --- /dev/null +++ b/removed/getEventsById.txt @@ -0,0 +1,13 @@ + +getEventsById +============= + +
+In version 1.3, this method was removed in favor of [clientEvents](../event_data/clientEvents). +
+ +Retrieves all locally-stored events with the given ID. + +
+.fullCalendar( 'getEventsById', *id* ) +
diff --git a/removed/index.txt b/removed/index.txt new file mode 100644 index 0000000..691911f --- /dev/null +++ b/removed/index.txt @@ -0,0 +1,21 @@ + +Renamed/Removed +--------------- + +- prevMonth +- nextMonth +- draggable +- fixedWeeks +- abbrevDayHeadings +- buttons +- title +- eventDragOpacity +- eventRevertDuration +- weekStart +- rightToLeft +- addEvent +- removeEvent +- getEventsById +- refresh +- monthDisplay +- resize diff --git a/removed/monthDisplay.txt b/removed/monthDisplay.txt new file mode 100644 index 0000000..a8629e4 --- /dev/null +++ b/removed/monthDisplay.txt @@ -0,0 +1,15 @@ + +monthDisplay +============ + +
+In version 1.3, this callback was removed in favor of [viewDisplay](../display/viewDisplay). +
+ +Triggered once when the calendar loads and every time the calendar's month is changed. + +
+function( *year*, *month*, *monthTitle* ) +
+ +`month` is **zero-based**. `monthTitle` contains the new title of the month (ex: "January 2009") diff --git a/removed/nextMonth.txt b/removed/nextMonth.txt new file mode 100644 index 0000000..0758b41 --- /dev/null +++ b/removed/nextMonth.txt @@ -0,0 +1,13 @@ + +nextMonth +========= + +
+In version 1.3, this method was renamed to [next](../current_date/next). +
+ +Moves the calendar forward one month. + +
+.fullCalendar( 'nextMonth' ) +
diff --git a/removed/prevMonth.txt b/removed/prevMonth.txt new file mode 100644 index 0000000..ed2719d --- /dev/null +++ b/removed/prevMonth.txt @@ -0,0 +1,13 @@ + +prevMonth +========= + +
+In version 1.3, this method was renamed to [prev](../current_date/prev). +
+ +Moves the calendar back one month. + +
+.fullCalendar( 'prevMonth' ) +
diff --git a/removed/refresh.txt b/removed/refresh.txt new file mode 100644 index 0000000..6ffb64d --- /dev/null +++ b/removed/refresh.txt @@ -0,0 +1,14 @@ + +refresh +======= + +
+This method was removed in version 1.3 in favor of [refetchEvents](../event_data/refetchEvents) +and [rerenderEvents](../event_rendering/rerenderEvents). +
+ +Refetches and redraws the events for the current month. + +
+.fullCalendar( 'refresh' ) +
diff --git a/removed/removeEvent.txt b/removed/removeEvent.txt new file mode 100644 index 0000000..b2e994f --- /dev/null +++ b/removed/removeEvent.txt @@ -0,0 +1,13 @@ + +removeEvent +=========== + +
+In version 1.3, this method was removed in favor of [removeEvents](../event_data/removeEvents). +
+ +Remove an event with a given ID. + +
+.fullCalendar( 'removeEvent', *id* ) +
diff --git a/removed/resize.txt b/removed/resize.txt new file mode 100644 index 0000000..80d4043 --- /dev/null +++ b/removed/resize.txt @@ -0,0 +1,7 @@ + +resize +====== + +
+In version 1.3, this callback was renamed to [windowResize](../display/windowResize). +
diff --git a/removed/rightToLeft.txt b/removed/rightToLeft.txt new file mode 100644 index 0000000..f9b3240 --- /dev/null +++ b/removed/rightToLeft.txt @@ -0,0 +1,7 @@ + +rightToLeft +=========== + +
+In version 1.3, this option was renamed to [isRTL](../display/isRTL). +
diff --git a/removed/title.txt b/removed/title.txt new file mode 100644 index 0000000..392ea16 --- /dev/null +++ b/removed/title.txt @@ -0,0 +1,13 @@ + +title +===== + +
+This option was removed in version 1.3 in favor of the [header](../display/header) system. +
+ +Determines whether a title such as "January 2009" will be displayed at the top of the calendar. + +
+Boolean, *default:* `true` +
diff --git a/removed/weekStart.txt b/removed/weekStart.txt new file mode 100644 index 0000000..0046167 --- /dev/null +++ b/removed/weekStart.txt @@ -0,0 +1,7 @@ + +weekStart +========= + +
+In version 1.3, this option was renamed to [firstDay](../display/firstDay). +
diff --git a/text_customization/buttonText.txt b/text_customization/buttonText.txt new file mode 100644 index 0000000..94f7eda --- /dev/null +++ b/text_customization/buttonText.txt @@ -0,0 +1,30 @@ + +buttonText *1.3* +================ + +Text that will be displayed on buttons of the header. + +
+Object, *default*: + + { + prev: ' ◄ ', // left triangle + next: ' ► ', // right triangle + prevYear: ' << ', // << + nextYear: ' >> ', // >> + today: 'today', + month: 'month', + week: 'week', + day: 'day' + } +
+ +If you wanted to change the prev/next buttons to use < and > characters, +here what you would do: + + $('#calendar').fullCalendar({ + buttonText: { + prev: '<', + next: '>' + } + }); diff --git a/text_customization/columnFormat.txt b/text_customization/columnFormat.txt new file mode 100644 index 0000000..766c3b5 --- /dev/null +++ b/text_customization/columnFormat.txt @@ -0,0 +1,24 @@ + +columnFormat *1.3* +================== + +Determines the text that will be displayed on the calendar's column headings. + +
+String/[View Option Hash](../views/View_Option_Hash), *default*: + + { + month: 'ddd', // Mon + week: 'ddd M/d', // Mon 9/7 + day: 'dddd M/d' // Monday 9/7 + } +
+ +Uses [formatDate](../utilities/formatDate) formatting rules. + +A single string will set the title format for all views. A [View Option Hash](../views/View_Option_Hash) may be provided to target specific views +(this is what the default does). + +
+A View Option Hash can only be provided in version 1.4 and later. +
diff --git a/text_customization/dayNames.txt b/text_customization/dayNames.txt new file mode 100644 index 0000000..ded4a49 --- /dev/null +++ b/text_customization/dayNames.txt @@ -0,0 +1,16 @@ + +dayNames *1.3* +============== + +Full names of days-of-week. + +
+Array, *default*: + + ['Sunday', 'Monday', 'Tuesday', 'Wednesday', + 'Thursday', 'Friday', 'Saturday'] +
+ +
+Prior to version 1.3, this was possible by setting $.fullCalendar.dayNames +
diff --git a/text_customization/dayNamesShort.txt b/text_customization/dayNamesShort.txt new file mode 100644 index 0000000..1dd51be --- /dev/null +++ b/text_customization/dayNamesShort.txt @@ -0,0 +1,15 @@ + +dayNamesShort *1.3* +=================== + +Abbreviated names of days-of-week. + +
+Array, *default*: + + ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'] +
+ +
+Prior to version 1.3, this was possible by setting $.fullCalendar.dayAbbrevs +
diff --git a/text_customization/index.txt b/text_customization/index.txt new file mode 100644 index 0000000..b614356 --- /dev/null +++ b/text_customization/index.txt @@ -0,0 +1,18 @@ + +Text/Time Customization +======================= + +
    +
  • timeFormat
  • +
  • columnFormat
  • +
  • titleFormat
  • +
  • buttonText
  • +
  • monthNames
  • +
  • monthNamesShort
  • +
  • dayNames
  • +
  • dayNamesShort
  • +
+ +Related agenda-view options: [allDayText](../agenda/allDayText), [axisFormat](../agenda/axisFormat) + +Essential for date/time formatting: [formatDate commands](../utilities/formatDate). diff --git a/text_customization/monthNames.txt b/text_customization/monthNames.txt new file mode 100644 index 0000000..1597897 --- /dev/null +++ b/text_customization/monthNames.txt @@ -0,0 +1,16 @@ + +monthNames *1.3* +================ + +Full names of months. + +
+Array, *default*: + + ['January', 'February', 'March', 'April', 'May', 'June', 'July', + 'August', 'September', 'October', 'November', 'December'] +
+ +
+Prior to version 1.3, this was possible by setting $.fullCalendar.monthNames +
diff --git a/text_customization/monthNamesShort.txt b/text_customization/monthNamesShort.txt new file mode 100644 index 0000000..03720bf --- /dev/null +++ b/text_customization/monthNamesShort.txt @@ -0,0 +1,16 @@ + +monthNamesShort *1.3* +===================== + +Abbreviated names of months. + +
+Array, *default*: + + ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun' + 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] +
+ +
+Prior to version 1.3, this was possible by setting $.fullCalendar.monthAbbrevs +
diff --git a/text_customization/timeFormat.txt b/text_customization/timeFormat.txt new file mode 100644 index 0000000..ea564e5 --- /dev/null +++ b/text_customization/timeFormat.txt @@ -0,0 +1,35 @@ + +timeFormat *1.1* +================ + +Determines the time-text that will be displayed on each event. + +
+String/[View Option Hash](../views/View_Option_Hash), *default*: + + { + // for agendaWeek and agendaDay + agenda: 'h:mm{ - h:mm}', // 5:00 - 6:30 + + // for all other views + '': 'h(:mm)t' // 7p + } + +
+ +Uses [formatDate](../utilities/formatDate)/[formatDates](../utilities/formatDates) formatting rules. + +Time-text will only be displayed for [Event Objects](../event_data/Event_Object) that have `allDay` equal to `false`. + +A single format string will change the time-text for events in all views. +A [View Option Hash](../views/View_Option_Hash) may be provided to target specific views (which is what the default does). + +Here is an example of displaying all events in a 24-hour format: + + $('#calendar').fullCalendar({ + timeFormat: 'H(:mm)' // uppercase H for military time + }); + +
+A View Option Hash can only be provided in version 1.4 and later. +
diff --git a/text_customization/titleFormat.txt b/text_customization/titleFormat.txt new file mode 100644 index 0000000..540dbd4 --- /dev/null +++ b/text_customization/titleFormat.txt @@ -0,0 +1,24 @@ + +titleFormat *1.1* +================= + +Determines the text that will be displayed in the header's title. + +
+String/[View Option Hash](../views/View_Option_Hash), *default*: + + { + month: 'MMMM yyyy', // September 2009 + week: "MMM d[ yyyy]{ '—'[ MMM] d yyyy}", // Sep 7 - 13 2009 + day: 'dddd, MMM d, yyyy' // Tuesday, Sep 8, 2009 + } +
+ +Uses [formatDate](../utilities/formatDate)/[formatDates](../utilities/formatDates) formatting rules. + +A single string will set the title format for all views. +A [View Option Hash](../views/View_Option_Hash) may be provided to target specific views (this is what the default does). + +
+A View Option Hash can only be provided in version 1.4 and later. +
diff --git a/usage.txt b/usage.txt new file mode 100644 index 0000000..397cfe4 --- /dev/null +++ b/usage.txt @@ -0,0 +1,77 @@ + +Basic Usage +=========== + +The first step in embedding a calendar on a web page is to have the right JavaScript and CSS files. +Make sure you are including the FullCalendar stylesheet, as well as the FullCalendar and +[jQuery](http://jquery.com/) JS files, in the `` of your page: + + + + + +If you plan to do drag & drop, you also need to get your hands on the [jQuery UI](http://jqueryui.com/download) +"Core" and "Draggable" (more information [here](event_ui/Requirements)). + +Once you have your dependencies, you need to write the JavaScript code that initializes the calendar. +This code must be executed *after* the page has initialized. The best way to do this is with jQuery's +`$(document).ready` like so: + + $(document).ready(function() { + + // page is now ready, initialize the calendar... + + $('#calendar').fullCalendar({ + // put your options and callbacks here + }) + + }); + +The above code should be in a `