<script type="text/javascript" src="/ajax/prototype/prototype.js"></script>-The above TCL API generates the default -sources that must be declared for you to be able to use the javascript -libraries Ajax Helper has support for overlibmws (DHTML callouts) and -RICO (other cinematic effects) in addition to scriptaculous. -Scriptaculous is the default javascript library.
<script type="text/javascript" src="/ajax/scriptaculous/builder.js"></script>
<script type="text/javascript" src="/ajax/scriptaculous/controls.js"></script>
<script type="text/javascript" src="/ajax/scriptaculous/dragdrop.js"></script>
<script type="text/javascript" src="/ajax/scriptaculous/effects.js"></script>
<script type="text/javascript" src="/ajax/scriptaculous/slider.js"></script>
<script type="text/javascript" src="/ajax/scriptaculous/scriptaculous.js"></script>
Hamilton G. Chua (ham@solutiongrove.com)
+ November 2006
+ v0.8d
+
+ Components :
+ Prototype v1.5.0_rc_1 (http://prototype.conio.net/)
+ Scriptaculous v1.6.4 (http://script.aculo.us/)
+
+Overlibmws (http://www.macridesweb.com/oltest/)
+Curvey Corners (http://www.curvycorners.net/)
+Yahoo User Interface Library 0.11.4 (http://developer.yahoo.com/yui/)
+Dojo Toolkit
+ 0.4 (http://dojotoolkit.com)
+
+
+ Introduction :
+
+ The Ajax Helper package provides TCL API to generate the
+ javascript from the above components to enable their various features
+ for use in OpenACS applications.
+ The motivation for this package is to easily enable Web 2.0 like
+ features in OpenACS applications using the most popular javascript
+ libraries.
+
+ Prerequisites :
+
+ The ajax helper package must be installed and mounted in /ajax
+ to be able ot use these features. The installer should automatically
+ mount the ajax helper in /ajax upon installation of the package.
+
+Javascript Sources :
As of version 0.8d, required javascript sources will be loaded automatically depending on the wrapper function used. The following piece of code must be present in the blank-master.tcl template file to make this automated loading of javascript source files possible.
+TCL File (blank-master.tcl) :
++if { ![info exists header_stuff] } { + set header_stuff {} +} + +# HAM : lets check ajaxhelper globals *********************** + +global ajax_helper_js_sources +global ajax_helper_yui_js_sources +global ajax_helper_dojo_js_sources +set js_sources "" + +if { [info exists ajax_helper_js_sources] || [info exists ajax_helper_yui_js_sources] || [info exists ajax_helper_dojo_js_sources] } { + + # if we're using ajax, let's use doc_type strict so we can get + # consistent results accross standards compliant browsers + set doc_type { < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > } + + if { [info exists ajax_helper_js_sources] } { + append js_sources [ah::load_js_sources -source_list $ajax_helper_js_sources] + } + + if { [info exists ajax_helper_yui_js_sources] } { + append js_sources [ah::yui::load_js_sources -source_list $ajax_helper_yui_js_sources] + } + + if { [info exists ajax_helper_dojo_js_sources] } { + append js_sources [ah::dojo::load_js_sources -source_list $ajax_helper_dojo_js_sources] + } +} + +# *********************************************************** + +# Attributes + +multirow create attribute key value +set onload {} ++
ADP File (blank-master.adp):
+ @js_sources;noquote@
+ @header_stuff;noquote@
Automated loading will work only if you are using a wrapper script.
+Alternatively if you wish to have more control of what javascript sources are loaded, you can still use the ah::js_sources procedure.
+ To have the ajax helper generate
+ the javascript declaration ....
+
+ TCL File (e.g blank-master.tcl) :
+
+ set ah_sources [ah::js_sources -default]
+
+ ADP File (eg. blank-master.adp):
+
+ @ah_sources;noquote@
+
+ Compiled Template:
+
+ <script type="text/javascript" src="/ajax/prototype/prototype.js"></script>
+ <script type="text/javascript" src="/ajax/scriptaculous/builder.js"></script>
+ <script type="text/javascript" src="/ajax/scriptaculous/controls.js"></script>
+ <script type="text/javascript" src="/ajax/scriptaculous/dragdrop.js"></script>
+ <script type="text/javascript" src="/ajax/scriptaculous/effects.js"></script>
+ <script type="text/javascript" src="/ajax/scriptaculous/slider.js"></script>
+ <script type="text/javascript" src="/ajax/scriptaculous/scriptaculous.js"></script>
+
The above TCL API generates the default
+sources that must be declared for you to be able to use the javascript
+libraries
+
+
+To generate the javscript sources for Overlibmws :
+
+ set ah_sources [ah::js_sources -source "overlibmws"]
+
+The functions that are responsible for rounded corners has been
+extracted into rounded.js to work with scriptaculous.
+
+
+ set ah_sources [ah::js_sources -source "rounder"]
+
+NOTE :
+
+You can combine sources by specifying them in the source parameter separated by commas.
+
+
+ set ah_sources [ah::js_sources -source
+"default,overlibmws"]
+
+The above code will generate the overlibmws javascript source
+declaration with the default declarations.
+
+
+Ajax Procedures :
+
+Prototype has a pair of javascript functions that alllow
+programmers to use XMLHTTP. The ajax.updater and ajax.request
+functions. See http://wiki.script.aculo.us/scriptaculous/show/Ajax.Updater
+and http://wiki.script.aculo.us/scriptaculous/show/Ajax.Request
+for more information about these javascript functions.
+
+The TCL API is used like this
+
+ set request [ah::ajaxrequest -url
+"/url/to/call" \
+
+
+
+
+ -pars
+"parameter1=parameter_value¶meter1=parameter_value" ]
+
+The above api will generate an ajax.request javascript function that is
+best placed in an event like "onClick".
+
+ <a href="#" onClick="@request;noquote@">
+
+Consult the api-doc for more information about other parameters you can
+pass on to the ah::ajaxrequest proc.
+
+The ah::ajaxrequest will make an xmlhttp call but does not do anything
+about the response. To update content based on the response from an
+xmlhttp request, use ah::ajaxupdate. This procedure will not only make
+an xmlhttp call but update the contents of a div or layer with the
+response text of the xmlhttp request.
+
+Here's an example :
+
+ set js_update_connections
+[ah::ajaxupdate -container "connections" \
+
+ -url "/url/to/call" \
+
+ -enclose \
+
+ -pars
+"'effects=$effects&limit_n=$limit_n'" \
+
+-effect "Fade" \
+
+ -effectopts "duration: 0.5"]
+
+On the adp side, you can just put
+
+ @js_update_connections;noquote@
+
+The "-enclose" parameter tells the procedure to enclose the resulting
+script in script tags <script></script>. This is another
+option in addition to putting the scripts in html event attributes like
+onClick, onMouseover or onChange.
+
+The "-pars" parameter is where you pass the querystring that you want
+to send along with the xmlhttp request. Notice that it takes the form
+of a querystring that you normally see in the address bar of your
+browser. Use this to pass values to the URL you are making an xmlhttp
+request to.
+
+The "-effect" parameter is an optional parameter that allows you to
+specify the effect you want to execute after the container's content
+has been updated.
+
+Cinematic Effects :
+
+Use ah::effects to generate javascript that allows you to
+implement transitional and cinematic effects to html elements. You will
+need to consult the scriptaculous documentation
+http://wiki.script.aculo.us/scriptaculous/tags/effects to know what
+kinds of
+effects and what kinds of options you can pass to the effect script.
+
+The procedure is called in this manner :
+
+ set effect [ah::effect -element "container"
+
+
+
+-effect "Fade"
+
+
+
+ -options "duration: 1.5"]
+NOTE :
+The Effect name and the options are case sensitive.
+
+
+DHTML Callouts :
+
+There is currently basic support for overlibmws. Right now we
+are able to create bubble type call outs.
+
+In your tcl file ...
+
+ set onmouseover [ah::bubblecallout -text " Contents of My
+Popup" ]
+
+The adp file should have something like this ....
+
+ <a href="#" @onmouseover;noquote@ >Link with
+Popup</a>
+
+Drag and Drop Sortables :
+
+Sortables are documented in the scriptaculous wiki http://wiki.script.aculo.us/scriptaculous/show/Sortables.
+For sortables to work you will need to define a container which will
+hold the elements you want to be sortable.
+
+Here is what the script looks like
+
+ append scripts [ah::sortable -element "container"
+
+
+
+
+ -options
+"tag:'div',only:'portlet',overlap:'horizontal',constraint:false,ghosting:false"]
+
+You adp page should contain a div with id attribute container. This "container" should have subcontainers which the above script will make
+sortable.