Permalink
Browse files

update documentation

  • Loading branch information...
1 parent 0effb2a commit c1432552bd01a3fe727393f342417492ec598cda @tardate committed Oct 3, 2010
Showing with 72 additions and 23 deletions.
  1. +52 −4 README.rdoc
  2. +20 −19 addtocal.htm
View
@@ -12,18 +12,66 @@ Supported calendar systems:
* Any iCal-compatible desktop application
* Any vCalendar-compatible desktop application
-See the addtocal.htm demo file for an example of how to initialize and use jquery.addtocal.
+See the {addtocal.htm}[http://github.com/tardate/jquery.addtocalendar/blob/master//addtocal.htm] demo file for
+an example of how to initialize and use jquery.addtocal.
Using jquery.addtocal is simply a matter of initializing the widget, and attaching it to any DOM element that will
hold a calendarable event in your application.
You need to implement one method when initializing jquery.addtocal: getEventDetails( element ).
-It is called when a user selects a calendar to add an event to.
-The element parameter is the jQuery object for the event invoked.
+It is called when a user selects a calendar to add an event to.
+The element parameter is the jQuery object for the event invoked.
You must return an object packed with the relevant event details.
-How you determine the event attributes will depend on your page structure, and whether you are using a standard markup such as
+How you determine the event attributes will depend on your page structure, and whether you are using a standard markup such as
the {hCalendar microformat}[http://microformats.org/wiki/hcalendar].
+=== Widget Initialzation
+Here's an example of the minimal initialisation require. This example attaches the addtocal widget to all elements with the class 'addtocal'.
+
+ $(document).ready(function() {
+
+ $('.addtocal').AddToCal({
+ // ical and vcal require an ics or vcs file to be served.
+ // Disable these features if reqired (as a result the 30boxes, iCal and vCalendar menu links will not appear)
+ icalEnabled:false,
+ vcalEnabled:false,
+
+ getEventDetails: function( element ) {
+
+ ... [implement whatever is required to parse 'element' into the required event structure] ...
+
+ // return the required event structure
+ return {
+ webcalurl: null,
+ icalurl: null,
+ vcalurl: null,
+ start: start,
+ end: end,
+ title: title,
+ details: details,
+ location: null,
+ url: null
+ };
+ },
+ });
+
+ });
+
+=== Required getEventDetails event structure
+
+The structure returned from getEventDetails has the following members:
+* webcalurl: full url to webcal resource (if supported) e.g. webcal://mydomain/events/1.ics
+* icalurl: full url to iCal resource (if supported) e.g. http://mydomain/events/1.ics
+* vcalurl: full url to vCalendar resource (if supported) e.g. http://mydomain/events/1.vcs
+* start: start time of the event (javascript date object)
+* end: end time of the event (javascript date object)
+* title: event title text
+* details: event details text
+* location: event location text
+* url: full url to information about the event e.g. http://mydomain/events/1.html
+
+
+
== Source
For more information and source files, see the project's {github repository}[http://github.com/tardate/jquery.addtocalendar].
Feel free to fork and enhance!
View
@@ -44,8 +44,8 @@
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js'></script>
- <script type='text/javascript' src='libs/rfc3339date.js'></script>
- <script type='text/javascript' src='jquery.addtocal.js'></script>
+ <script type='text/javascript' src='libs/rfc3339date.js'></script>
+ <script type='text/javascript' src='jquery.addtocal.js'></script>
<script type='text/javascript'>
$(document).ready(function() {
@@ -83,6 +83,7 @@
title = title_element.length ? title_element.html() : element.attr('id');
details = details_element.length ? details_element.html() : element.html();
+ // return the required event structure
return {
webcalurl: null,
icalurl: null,
@@ -101,26 +102,26 @@
</script>
</head>
<body>
- <h1>jquery.addtocal Demo</h1>
- <p class="description">This demonstrates the basic add-to-calendar function.
- For more information and source files, see the project's <a href="http://github.com/tardate/jquery.addtocalendar">github repository</a>.</p>
-
- <div class="calendar-examples">
-
- <div id='event-1' class='addtocal'>Basic event holder (click me)</div>
+ <h1>jquery.addtocal Demo</h1>
+ <p class="description">This demonstrates the basic add-to-calendar function.
+ For more information and source files, see the project's <a href="http://github.com/tardate/jquery.addtocalendar">github repository</a>.</p>
+
+ <div class="calendar-examples">
- <div id='event-2' class='addtocal vevent'>
- <div class="summary">hCalendar annotated event</div>
- <span class="dtstart date" title="20100908T070000Z">8th Aug 2010</span>
+ <div id='event-1' class='addtocal'>Basic event holder (click me)</div>
+
+ <div id='event-2' class='addtocal vevent'>
+ <div class="summary">hCalendar annotated event</div>
+ <span class="dtstart date" title="20100908T070000Z">8th Aug 2010</span>
<span class="dtend date" title="20100908T080000Z">7-8am UTC</span>
- <div class="description">
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Sed quam sem, tincidunt sit amet blandit vitae, vehicula sit amet sem.
- Quisque aliquam commodo lorem vel facilisis. (click me)</div>
+ <div class="description">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+ Sed quam sem, tincidunt sit amet blandit vitae, vehicula sit amet sem.
+ Quisque aliquam commodo lorem vel facilisis. (click me)
+ </div>
</div>
-
+
</div>
-
-
+
</body>
</html>

0 comments on commit c143255

Please sign in to comment.