Online Group Calendar and Calendar Software Tools Log In to Your Online Calendar online calendar
Online Group Calendar online calendar online calendar online calendar online calendar online calendar CONTACT US:
1.888.207.9329
online calendar

online calendar CALibrate Mini Month Widget


online calendar
online calendar HTML Widgets online calendar
online calendar Desktop Widgets
online calendar View Current
HTML Widgets
online calendar Example - Put an
HTML calendar widget
on your on web page
online calendar Read the FAQ
about Calendar
Widgets
online calendar
Integrating the Mini Month Event Finder widget into your web page is easy! Just follow the the 4 easy steps below. You can cut and paste each section into your web page or you can download the HTML and CSS below.
  • CSS for the Mini Month Event Finder Widget
  • HTML for the Mini Month Event Finder Widget
You also will need the name of your calendars from the CALibrate API. Here is the help on that issue.


online calendar  

Include the CSS and JavaScript files for the widget
The CSS file can be local, so you can customize it. The JavaScript files should be remote to so you
can always have the latest version.

   
<link type="text/css" rel="stylesheet" href="http://www.happyjacksoftware.com/downloads/widgets/mm_widget/widget_mm.css" media="all"></link>

<script language="Javascript" src="http://www.happyjacksoftware.com/downloads/widgets/mm_widget/events_api.js"></script>
<script language="Javascript" src="http://www.happyjacksoftware.com/downloads/widgets/mm_widget/widget_mm.js"></script>

                                
online calendar  

Create a JavaScript function that will invoke the CALibrate API
This function creates the widget. Give it the names of the calendars you want information from and
give it the IDs of the divs that will host the widget. Then set the time column on or off by setting
the "timeColumnP" property. Finally, ask the widget to get data from CALibrate.

   
<script language="Javascript">

function get_my_events() {
    cals = new Array ("C/UWCS/Julija Zommere/UW Computer Science",
                      "C/UWCS/Ruben Gamboa/Personal",
                      "C/UWCS/Ruben Gamboa/UWyo",
                      "C/Ruben Gamboa/MyAppointments",
                      "C/UWCS/Paula Sircin/2006-07 Academic Year Calendar");

    var w = new CalibrateMonthWidget ("schedule",     // ID of div to hold month
                                      "details",      // ID of div to hold details
                                      null              // ID of div to hold debug info
                                     );
                                     
    w.setTimeColumnP (false);

    w.getEventsFromCalibrate (null, // username
                              null, // password
                              null, // timezone
                              cals);
}
</script>

online calendar  

Call your JavaScript function
From the onLoad method of the body tag, call your JavaScript function

   
<body onLoad="get_my_events()">

online calendar  

Place the divs on your web page.
Place the divs for your widget where you want them on the HTML page. You can use CSS to style the
divs, e.g. to specify the size. Make sure that the name of ids are the same as in Step2!

   
<div id="widget" style="width:200px; float: right;">

    <div id="schedule">
    </div>
    <div id="details">
        Downloading calendar events from <a href="http://www.happyjacksoftware.com">CALibrate Groups</a>...
    </div>

</div>

<div style="clear: both"></div>


Online Group Calendar
Home :: Products :: Support :: About Us :: Your Privacy :: Sitemap
© 2004-2008 Happy Jack Software, LLC. ALL RIGHTS RESERVED.
Contact us toll free: (888)207-9329