Calendar Widget?

Has anyone incorporated a calendar widget (such as the java
’jscalendar-1.0’) for working with date fields in the on-line interfaces?
Using something like that would certainly be a welcome enhancement for
users…

Has anyone incorporated a calendar widget (such as the java
’jscalendar-1.0’) for working with date fields in the on-line interfaces?
Using something like that would certainly be a welcome enhancement for
users…

There’s a first draft of this in RT 3.5. I’d love to incorporate
something like what orbitz.com is using if anyone feels like whipping
one up.

Jesse

I have integrated jscalendar-1.0 into RT. I followed the help files
provided with the download and use a small calendar image to click on
and open a flat calendar.
Here is what I did:

Add jscalendar files to ‘/share/html/NoAuth’ and add the appropriate
javascript and css links to ‘/local/html/Elements/Header’.
For Example

Use this code for ‘/Elements/SelectDate’
<INPUT NAME="<%$Name%>" VALUE="<%$Default%>" size=<%$Size%>
id="<%$ID%>">

<%init>
unless ((defined $Default) or
($current <= 0)) {
my ($sec,$min,$hour,$mday,$mon,$year,$wday,$yday,$isdst) =
localtime($current);
$Default = sprintf("%04d-%02d-%02d %02d:%02d",

                       $year+1900,$mon+1,$mday,

                       $hour,$min);   

}

unless ($Name) {
$Name = $menu_prefix. “_Date”;
}
</%init>
<%args>
$ShowTime => undef
$menu_prefix=>’’
$current=>time
$Default => undef
$Name => undef
$Size => 16
$ID => ‘’
</%args>

Then whenever the ‘SelectDate’ component is called, add the appropriate
’Name’ and ‘ID’ arguments. Something like this (from
’/Ticket/Create.html’).
<& /Elements/SelectDate, Name => ‘Due’, ID =>‘Due’, current => 0,
Default => $ARGS{Due} &>

This should get you up and running. It is a very nice feature that makes
it easy to set dates.

** Adam MyersFrom: rt-users-bounces@lists.bestpractical.com
[mailto:rt-users-bounces@lists.bestpractical.com] On Behalf Of Sam
Crosby
Sent: Thursday, January 05, 2006 9:34 AM
To: rt-users@lists.bestpractical.com
Subject: [rt-users] Calendar Widget?

Has anyone incorporated a calendar widget (such as the java
’jscalendar-1.0’) for working with date fields in the on-line
interfaces? Using something like that would certainly be a welcome
enhancement for users…

Wow. That is fantastic. I cant wait to try it.

I think I follow your email… let me ask a question or two (ill add a
page to the wiki based on this when im said and done)

  1. Download JSCalendar v 1.0, and place it in share/html/NoAuth

  2. Add appropriate javascript and CSS links to
    local/html/Elements/Header
    (What are appropriate files/links? Im not sure I understand the scope
    of what this means. Does it that mean add the full “Example” html to
    each page/template you want the JS Calendar to show up on? Do you have
    a list of templates that you might expect one to place them on for docu
    purposes?)

  3. Create Elements/SelectDate and use the supplied code.

  4. I really didn’t follow the last step. "Then whenever the
    ’SelectDate’ component is called, add the appropriate ‘Name’ and 'ID’
    arguments. Something like this (from ‘/Ticket/Create.html’).
    <& /Elements/SelectDate, Name => ‘Due’, ID =>‘Due’, current => 0,
    Default => $ARGS{Due} &>
    Can you explain that more? What is SelectDate component and what does
    adding the Name and ID args? Where will it be appropriate to add them?

Lastly, just to be certain, this is the calendar you are talking about
right? (http://www.dynarch.com/projects/calendar/)

Sorry about the questions, I think its REALLY cool you added the
calendar. I’d like to use the dates, but users really seem to stumble on
them.

Again, if you will work work with me on getting this setup, ill create a
how-to on the wiki.

duncan

Here is a more detailed way to add a calendar widget.

  1. Download the files from http://www.dynarch.com/projects/calendar/.
    There are a lot of files included such as different skins and languages,
    etc. Place this folder in /share/html/NoAuth. The files I used are:

calendar-setup.js
calendar.js
lang/calendar-en.js
calendar-system.css (css “skin”, there are many choices)

  1. Since jscalendar is a javascript widget, you need to link RT to these
    .js files. So add these lines to /Elements/Header near the other
    javascript code.

--------/Elements/Header-----------

  • <link rel="stylesheet" type="text/css"

href="<%$RT::WebPath%>/NoAuth/jscalendar/calendar-system.css"
title=“calendar-system”>

  • <script language="javascript" type="text/javascript"

src="<%$RT::WebPath%>/NoAuth/jscalendar/calendar.js">

  • <script language="javascript" type="text/javascript"

src="<%$RT::WebPath%>/NoAuth/jscalendar/lang/calendar-en.js">

  • <script language="javascript" type="text/javascript"

src="<%$RT::WebPath%>/NoAuth/jscalendar/calendar-setup.js">

$Size => 16

  • $ID => ‘’
    </%args>
  1. Now whenever you want the calendar widget to be used, like in
    /Ticket/Elements/EditDates, add the ‘ID’ argument to the component call.
    (I would use the same value as your ‘Name’ argument). Here is a couple
    examples as this could be used anywhere:

-----------/Ticket/Elements/EditDates----------

<&|/l&>Starts: - <& /Elements/SelectDate, menu_prefix => 'Starts', current => 0 &>(<% $TicketObj->StartsObj->AsString %>) + <& /Elements/SelectDate, menu_prefix => 'Starts', ID =>'starts', current => 0 &>(<% $TicketObj->StartsObj->AsString %>) <&|/l&>Due: - <& /Elements/SelectDate, menu_prefix => 'Due', current => 0 &> (<% $TicketObj->DueObj->AsString %>) + <& /Elements/SelectDate, menu_prefix => 'Due', ID => 'due', current => 0 &> (<% $TicketObj->DueObj->AsString %>)

For further reference on how to use jscalendar in other ways such as a
popup or button triggered, read the documentation provided with the
calendar.

Have fun!

Adam