Yes, the combination of Domino and javascript is great!! Imagine having a
database with planning information, what would be better then having a view
which dynamically shows the planning for a given period in a grafical way? This
can be done with domino using javascript. A great tip of which I am quite proud
and probably worth at least three t-shirts ;-)
I described the principle in the attached code section and also included the
html output page of a working example (in an intranet). That is all for free.
When the tip will be published, I can put the working example on the web. The
source of that example will be available for just USD 100.
The trick is to define a view whith columns generating javascript. In my
example I use the following formula for the column:
root := @Date( 1998 ; 1 ; 1 ) ;
day := @Date( 1998 ; 1 ; 2 ) - root ;
from := ( DateFrom - root ) / day ;
period := ( DateUntil - DateFrom ) / day ;
ref := "0/" + @Text( @DocumentUniqueID ) + "?OpenDocument" ;
"plot( " + @Text( from ) + ", " + @Text( period)
+ @If( Status = "Option" ; ", \'ff2222\', \'" ; ", \'44ff44\',
\'" )
+ ref + "\', \'" + Activity + "\' ) ; "
+ @NewLine
The result is a line of javascript calling the function "plot" with parameters
about the activity.
The view is embedded in a form which defines the function
Requires Free Membership to View
Register today to access targeted resources from our editorial writers and independent industry experts focused on Lotus Domino, Notes, Workplace and other related technologies.
plot plus somesurrounding javascript to capture the view output. Something like:
<script><!--
function plot(start,duration,color,ref,name) {
// javascript code which draws a bar on the screen at the given position with
the given color
}
function plotall() {
// initialization stuff
<embedded view, resulting in a sequence of calls of the plot function>
// finalization stuf
}
//plot all lines
plotall( ) ;
//--></script>
The next part is the html example of an output from a more sofisticated example
which also has input fields with which the user can select a scale and a period
and browse through the time dimension. It works with IE 5.0 browser and has not
been tested with netscape.
====== start of page =========
<HTML>
<!-- Lotus-Domino (Release 5.0a (Intl) - 4 May 1999 on Windows NT/Intel) -->
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
document._domino_target = "_self";
function _doClick(v, o, t, h) {
var form = document._PlotPlanning;
if (form.onsubmit) {
var retVal = form.onsubmit();
if (typeof retVal == "boolean" && retVal == false)
return false;
}
var target = document._domino_target;
if (o.href != null) {
if (o.target != null)
target = o.target;
} else {
if (t != null)
target = t;
}
form.target = target;
form.__Click.value = v;
if (h != null)
form.action += h;
form.submit();
return false;
}
// -->
</SCRIPT>
</HEAD>
<BODY TEXT="000000" BGCOLOR="FFFFFF" vlink="000000" link="000000"
alink="000000">
<FORM METHOD=post ACTION="/tip.nsf/plotplanning?OpenForm&Seq=1"
NAME="_PlotPlanning">
<INPUT TYPE=hidden NAME="__Click" VALUE="0">
<TABLE WIDTH="100%" BORDER=0 CELLSPACING=0 CELLPADDING=0>
<TR VALIGN=top><TD WIDTH="65%"> <A NAME="_RefreshKW_Type"></A>
<INPUT TYPE=radio NAME="Type" VALUE="Week" onClick="_doClick('$Refresh', this,
'_self', '#_RefreshKW_Type')">Week
<INPUT TYPE=radio NAME="Type" VALUE="4 weken" onClick="_doClick('$Refresh',
this, '_self', '#_RefreshKW_Type')">4 weken
<INPUT TYPE=radio NAME="Type" VALUE="Kwartaal" CHECKED
onClick="_doClick('$Refresh', this, '_self', '#_RefreshKW_Type')">Kwartaal
<INPUT TYPE=radio NAME="Type" VALUE="Half jaar" onClick="_doClick('$Refresh',
this, '_self', '#_RefreshKW_Type')">Half jaar
<INPUT TYPE=radio NAME="Type" VALUE="Jaar" onClick="_doClick('$Refresh', this,
'_self', '#_RefreshKW_Type')">Jaar </TD><TD WIDTH="35%">
<INPUT TYPE=button VALUE="<<" onClick="return
_doClick('0a7d408955f5abfec12567b3007883a2/$Body/0.532', this, null)">
<INPUT TYPE=button VALUE="<" onClick="return
_doClick('0a7d408955f5abfec12567b3007883a2/$Body/0.63A', this, null)">
<INPUT NAME="StartDate" VALUE="12-10-1999" size=10>
<INPUT TYPE=button VALUE=">" onClick="return
_doClick('0a7d408955f5abfec12567b3007883a2/$Body/0.7F6', this, null)">
<INPUT TYPE=button VALUE=">>" onClick="return
_doClick('0a7d408955f5abfec12567b3007883a2/$Body/0.8E0', this, null)"></TD></TR>
</TABLE>
<BR>
<INPUT NAME="Periodes" VALUE="4" type=hidden>
<INPUT NAME="Duration" VALUE="30" type=hidden>
<hr color=009900 width=96%>
<BR>
<script languag
This was first published in November 2000