CalendarWidget

From Request Tracker Wiki
Jump to: navigation, search

If you would like to use a Calendar widget with the date fields in RT, you can do the following. All of the file changes were done under the local RT3 Mason overlay, which is /usr/local/lib/rt3/html on my machine (Fedora Core 4). Note that this functionality is native in 3.8. Also note that this is NOT a calendar for Custom Fields.

  • Create a directory named NoAuth/js cd /usr/local/lib/rt3/html mkdir -p NoAuth/js
  • Download jscalendar from dynarch.com. (DynArch Calendar page)
  • Unpack the downloaded file in NoAuth/js, I also renamed it to remove the version number cd NoAuth/js unzip /tmp/jscalendar-1.0.zip mv jscalendar-1.0 jscalendar
  • Now, create a directory named Elements to modify the date selector cd /usr/local/lib/rt3/html mkdir -p Elements
  • I started by copying the contents of the Elements/SelectDate file distributed with RT and then modified it. Here's the final result: <INPUT ID="<%$Name%>" NAME="<%$Name%>" VALUE="<%$Default%>" size=<%$Size%>> <BUTTON TYPE="reset" id="<%$Name%>_date_button">Choose...</BUTTON> <SCRIPT TYPE="text/javascript"> Calendar.setup({ inputField: "<%$Name%>", ifFormat: "%Y-%m-%d %H:%M", showsTime: true, button: "<%$Name%>_date_button", }); </SCRIPT> <%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 </%args>

Now, all the date fields should have a "Choose..." button next to them that pops open a calendar widget. You may need to restart the web server to force Mason to refresh the code cache. You might also want to use a button with an image, but I leave that as an exercise for the reader.

COMMENTS:

10 Nov 2006

Opera 8.54 reported syntax error, fixed by removing the "," at the end of the argument list in SelectDate, as follows:

<SCRIPT TYPE="text/javascript">

Calendar.setup({
    inputField: "<%$Name%>",
    ifFormat:   "%Y-%m-%d %H:%M",
    showsTime:  true,
    button:     "<%$Name%>_date_button"
});
</SCRIPT>

Also, installing this on rt 3.4.6 I had to add some links to the head of Header

*** 55,60 **** --- 55,70 ---- <link media="all" rel="stylesheet" href="<%$RT::WebPath%>/NoAuth/webrt.css" type="text/css" /> <link media="print" rel="stylesheet" href="<%$RT::WebPath%>/NoAuth/printrt.css" type="text/css" /> <ul> <li>%#</li> <li>%# 10 Nov 2006, Additions for Calendar popup</li> <li>%#</li> <li><link rel="stylesheet" type="text/css"</li> <li>href="<%$RT::WebPath%>/NoAuth/js/jscalendar/calendar-system.css"</li> <li>title="calendar-system"></li> <li><script language="javascript" type="text/javascript" src="<%$RT::WebPath%>/NoAuth/js/jscalendar/calendar.js"></script></li> <li><script language="javascript" type="text/javascript" src="<%$RT::WebPath%>/NoAuth/js/jscalendar/lang/calendar-en.js"></script></li> <li><script language="javascript" type="text/javascript" src="<%$RT::WebPath%>/NoAuth/js/jscalendar/calendar-setup.js"></script></li> <li><script> function hideshow(num) { idstring = "element-" + num;

Which I did by copying Header to local/html/Elements/Header and then editing it.

Ian Goodacre