Index: openacs-4/packages/ajaxhelper/ajaxhelper.info =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/ajaxhelper.info,v diff -u -r1.2 -r1.3 --- openacs-4/packages/ajaxhelper/ajaxhelper.info 31 Mar 2006 08:15:35 -0000 1.2 +++ openacs-4/packages/ajaxhelper/ajaxhelper.info 5 Apr 2006 06:38:41 -0000 1.3 @@ -10,8 +10,8 @@ Hamilton Chua - Provides helper procs to generate javascript for XMHTTP calls and cinematic effects using the Scriptaculous javascript library (http://script.aculo.us/) - Solution Grove + Provides helper procs to generate javascript for Ajax and cinematic effects. + Solutiongrove 0 Index: openacs-4/packages/ajaxhelper/tcl/ajax-procs.tcl =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/tcl/ajax-procs.tcl,v diff -u -r1.2 -r1.3 --- openacs-4/packages/ajaxhelper/tcl/ajax-procs.tcl 15 Feb 2006 15:15:52 -0000 1.2 +++ openacs-4/packages/ajaxhelper/tcl/ajax-procs.tcl 5 Apr 2006 06:38:41 -0000 1.3 @@ -1,9 +1,11 @@ ad_library { Library for Ajax Helper Procs - based on + based on + Scriptaculous and Prototype for Ajax and Effects + OverlibMWS for Popups - @author Hamilton Chua (ham@soluiongrove.com) + @author Hamilton Chua (ham@solutiongrove.com) @creation-date 2006-01-16 } @@ -39,9 +41,22 @@ return [apm_package_url_from_id [ah::get_package_id]] } +ad_proc -private ah::isnot_js_var { + element +} { + Receives a string and surrounds it with single quotes. + This is a utility proc used to make a parameter passed to a proc a string. + The assumption is that an element passed as a parameter is a javascript variable. +} { + return "'$element'" +} + ad_proc -public ah::js_sources { {-default:boolean} {-source ""} + {-withbubble:boolean} + {-scrollable:boolean} + {-draggable:boolean} } { Generates the < script > syntax needed on the head @@ -57,20 +72,24 @@ @author Hamilton Chua (ham@solutiongrove.com) @creation-date 2006-01-16 + @param default Loads the prototype and scriptaculous javascript libraries. @param source The caller can specify which set of javascript source files to load. Valid values include "rounder" : to load the rico corner rounder functions only, use this if you are working primarily with scriptaculous, "rico" : to load the rico javascript library, "overlibws" : to load the overlibmws javascript files for dhtml callouts and popups. + @param withbubble Do we want to use the overlibmws plugin for bubble callouts ? + @param scrollable Do we want to use the overlibmws scrollable plugin ? + @param draggable Do we want to use the overlibmws draggable plugin ? + @return @error } { set ah_base_url [ah::get_url] set script "" - set loaded [list] if { $default_p } { # load prototype and scriptaculous js files @@ -86,15 +105,19 @@ "rounder" { append script " \n" } - "overlibmws" { - # put javascript here to link to overlibmws javascript files - # add code to initialize - append script "" + "overlibmws" { append script " \n" - append script "\n" append script "\n" - append script "\n" - append script "\n" + if { $withbubble_p } { + append script "\n" + append script "\n" + } + if { $scrollable_p } { + append script "\n" + } + if { $draggable_p } { + append script "\n" + } } default { # invalid value for source @@ -107,7 +130,7 @@ } -ad_proc -public ah::enclose_in_script { +ad_proc -private ah::enclose_in_script { -script:required } { Encloses whatever is passed to the script parameter in javascript tags. @@ -122,14 +145,63 @@ return $tag } +ad_proc -public ah::starteventwatch { + -element:required + -event:required + -obs_function:required + {-element_is_var:boolean} + {-useCapture "false"} +} { + Use prototype's Event object to watch/listen to a specific event from a specific html element. + Valid events include click, load, mouseover etc. + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-02-28 + + @param element the element you want to observe + @param event the event that the observer will wait for + @param obs_function the funcion that will be executed when the event is detected + +} { + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + set script "Event.observe(${element}, '${event}', ${obs_function}, $useCapture);" + return $script +} + +ad_proc -public ah::stopeventwatch { + -element:required + -event:required + -obs_function:required + {-useCapture "false"} + {-element_is_var:boolean} +} { + Use prototype's Event object to watch/listen to a specific event from a specific html element. + Valid events include click, load, mouseover etc. + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-02-28 + + @param element the element you want to observe + @param event the event that the observer will wait for + @param obs_function the funcion that will be executed when the event is detected + +} { + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + set script "Event.stopObserving(${element}, '${event}', ${obs_function}, $useCapture);" + return $script +} + + ad_proc -public ah::ajaxrequest { -url:required {-pars ""} {-options ""} } { Returns javascript that calls the prototype javascript library's ajax request (Ajax.Request) object. The Ajax.Request object will only perform an xmlhttp request to a url. - If you prefer to perform an xmlhttp request and then update the contents of a < div >, look at ajaxupdate. + If you prefer to perform an xmlhttp request and then update the contents of a < div >, look at ah::ajaxupdate. Parameters and options are case sensitive, refer to scriptaculous documentation. http://wiki.script.aculo.us/scriptaculous/show/Ajax.Request @@ -148,17 +220,20 @@ append preoptions ",parameters:$pars" } if { [exists_and_not_null options] } { append preoptions ",$options" } - set script "new Ajax.Request('$url',{$preoptions})" + set script "new Ajax.Request('$url',{$preoptions}); " + + return $script } ad_proc -public ah::ajaxupdate { -container:required -url:required {-pars ""} {-options ""} - {-effect "Appear"} + {-effect ""} {-effectopts ""} {-enclose:boolean} + {-container_is_var:boolean} } { Generate an Ajax.Updater javascript object. The parameters are passed directly to Ajax.Update script. @@ -189,23 +264,79 @@ @error } { + if { !$container_is_var_p } { + set container [ah::isnot_js_var $container] + } + set preoptions "asynchronous:'true',method:'post'" if { [exists_and_not_null pars] } { append preoptions ",parameters:$pars" } if { [exists_and_not_null options] } { append preoptions ",$options" } - set effects_script [ah::effects -element $container -effect $effect -options $effectopts] - append preoptions ",onSuccess: function(t) { $effects_script }" + if { [exists_and_not_null effect] } { + set effects_script [ah::effects -element $container -effect $effect -options $effectopts -element_is_var] + append preoptions ",onSuccess: function(t) { $effects_script }" + } - set script "new Ajax.Updater ('$container','$url',{$preoptions}); \n" + set script "new Ajax.Updater ($container,'$url',\{$preoptions\}); " if { $enclose_p } { set script [ah::enclose_in_script -script ${script} ] } return $script } +ad_proc -public ah::popup { + -content:required + {-options ""} +} { + This proc will generate javascript for an overlibmws popup. + This script has to go into a javscript event like onClick or onMouseover. + The ah::source must be executed with -source "overlibmws" + For more information about the options that you can pass + http://www.macridesweb.com/oltest/ + + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-02-12 + + @param content this is what the popup will contain or display. if content is text, enclose it in single quotes (' '). + @param options the options to pass to overlibmws + + @return + + @error + +} { + if { [exists_and_not_null options] } { + set overlibopt "," + append overlibopt $options + } else { + set overlibopt "" + } + set script "return overlib\(${content}${overlibopt}\);" + return $script +} + +ad_proc -public ah::clearpopup { + +} { + This proc will generate javascript for to clear a popup. + This script has to go into a javscript event like onClick or onMouseover. + The ah::source must be executed with -source "overlibmws" + + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-02-12 + + @return + + @error + +} { + set script "nd();" + return $script +} + ad_proc -public ah::bubblecallout { -text:required {-type "square"} @@ -215,20 +346,25 @@ This proc will generate mouseover and mouseout javascript for dhtml callout or popup using overlibmws and the overlibmws bubble plugin. + The ah::source must be called with -source "overlibmws" -withbubble @author Hamilton Chua (ham@solutiongrove.com) @creation-date 2006-01-16 @param type this is passed to the overlibmws script, refer to overlib documentation for possible values. @param text the text that will appear in the popup. - @param textsize teh size of the text in the popup + @param textsize the size of the text in the popup @return @error } { - set script "onmouseover=\"overlib('$text', BUBBLE, BUBBLETYPE, '$type', TEXTSIZE, '$textsize');\" onmouseout=\"nd();\"" + set script "onmouseover=\"" + append script [ah::popup -content "'$text'" -options "BUBBLE,BUBBLETYPE,'$type',TEXTSIZE,'$textsize'"] + append script "\" onmouseout=\"" + append script [ah::clearpopup] + append script "\"" return $script } @@ -251,7 +387,8 @@ @error } { - set request [ah::ajaxrequest -url $url -pars '$pars' -options "onSuccess: function(t) { overlib(t.responseText, BUBBLE, BUBBLETYPE, '$type', TEXTSIZE, '$textsize'); }" ] + set popup [ah::popup -content "t.responseText" -options "BUBBLE,BUBBLETYPE,'$type',TEXTSIZE,'$textsize'"] + set request [ah::ajaxrequest -url $url -pars '$pars' -options "onSuccess: function(t) { $popup }" ] set script "onmouseover=\"$request\" onmouseout=\"nd();\"" return $script } @@ -260,6 +397,7 @@ -element:required {-effect "Appear"} {-options ""} + {-element_is_var:boolean} } { Generates javascript for effects by scriptaculous. Refer to the scriptaculous documentaiton for a list of effects. @@ -280,38 +418,140 @@ @error } { + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + set script "new Effect.$effect\($element,\{$options\}\); " + return $script +} - set script "new Effect.$effect\('$element',\{$options\}\)" +ad_proc -public ah::toggle { + -element:required + {-effect "Appear"} + {-options ""} + {-element_is_var:boolean} +} { + Generates javascript that toggle the state of an element. + The parameters are passed directly to the scriptaculous toggle script. + Parameters and options are case sensitive, refer to scriptaculous documentation. + http://wiki.script.aculo.us/scriptaculous/show/Effect.toggle + + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-02-23 + + @param element the page element that you want to apply the effect to + @param effect specify one of the scriptaculous effects you want to toggle + + @return + + @error + +} { + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + set script "Effect.toggle\($element,'$effect',{$options}\)" return $script } ad_proc -public ah::draggable { -element:required - {-options "revert:'true'"} + {-options ""} + {-uid ""} + {-element_is_var:boolean} } { + Generates javascript to make the given element a draggable. The parameters are passed directly to the scriptaculous script. Parameters and options are case sensitive, refer to scriptaculous documentation. http://wiki.script.aculo.us/scriptaculous/show/Draggables @author Hamilton Chua (ham@solutiongrove.com) @creation-date 2006-01-24 - @param element the page element that you want to apply the effect to + @param element the page element that you want to make draggable @param options specify the scriptaculous options + @param uid provide a unique id that is used as a variable to associate with the draggable + @param element_is_var specify this parameter if the element you are passing is a javscript variable @return @error } { - set script "new Draggable \('$element',\{$options\}\)" + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + + set script "new Draggable \($element,\{$options\}\);" + return $script } +ad_proc -public ah::droppable { + -element:required + {-options ""} + {-uid ""} + {-element_is_var:boolean} +} { + Generates javascript to make the given element a droppable. + If a uid parameter is provided, the script will also check if the droppable with the same uid has already been created. + The parameters are passed directly to the scriptaculous script. + Parameters and options are case sensitive, refer to scriptaculous documentation. + http://wiki.script.aculo.us/scriptaculous/show/Droppables + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-02-24 + + @param element the page element that you want to be a droppable + @param element_is_var specify this parameter if the element you are passing is a javscript variable + @param uid provide a unique id that is used as a variable to associate with the droppable + @param options specify the scriptaculous options for droppables + + @return + + @error + +} { + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + + set script "Droppables.add (${element},{${options}});" + + return $script +} + +ad_proc -public ah::droppableremove { + -element:required + {-element_is_var:boolean} +} { + Generates javascript to remove a droppable. + The parameters are passed directly to the scriptaculous script. + Parameters and options are case sensitive, refer to scriptaculous documentation. + http://wiki.script.aculo.us/scriptaculous/show/Droppables + + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-02-24 + + @param element the page element that you want to be a droppable + + @return + + @error + +} { + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + set script "Droppables.remove \($element);" + return $script +} + + ad_proc -public ah::sortable { -element:required {-options ""} + {-element_is_var:boolean} } { Generates javascript for sortable elements. The parameters are passed directly to the scriptaculous sortable script. @@ -328,15 +568,21 @@ @error } { - set script "Sortable.create\('$element', \{$options\}\); \n" + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + set script "Sortable.destroy($element); " + append script "Sortable.create\($element, \{$options\}\); " return $script } ad_proc -public ah::rounder { -element:required {-options ""} + {-element_is_var:boolean} } { Generates javascript to round html div elements. + The ah::source must be executed with -source "rounder" Parameters are case sensitive. http://encytemedia.com/blog/articles/2005/12/01/rico-rounded-corners-without-all-of-rico @@ -347,6 +593,9 @@ @param options specify the options for rounding the element } { - set script "Rico.Corner.round('$element', \{$options\}); \n" + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + set script "Rico.Corner.round\($element, \{$options\}\); " return $script -} +} \ No newline at end of file Index: openacs-4/packages/ajaxhelper/tcl/ajax-yahoo-procs.tcl =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/tcl/ajax-yahoo-procs.tcl,v diff -u --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ openacs-4/packages/ajaxhelper/tcl/ajax-yahoo-procs.tcl 5 Apr 2006 06:38:41 -0000 1.1 @@ -0,0 +1,94 @@ +ad_library { + + Library for Ajax Helper Procs + based on Yahoo's User Interface Libraries + + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-01-16 +} + +namespace eval ah::yahoo { } + +ad_proc -public ah::yahoo::js_sources { + {-default:boolean} + {-source ""} +} { + + Generates the < script > syntax needed on the head + for Yahoo's User Interface Library + The code : + 
+		[ah::yahoo::js_sources -default]
+
+ will load the default YUI javascript library which includes the connections and doms js files + + @author Hamilton Chua (ham@solutiongrove.com) + @creation-date 2006-01-16 + + @param default Loads the prototype and scriptaculous javascript libraries. + @param source The caller can specify which set of javascript source files to load. + Valid values include + "animation" : loads animation.js + "event" : loads events.js + "treeview" : loads treeview.js + "calendar" : loads calendar.js + "dragdrop" : loads dragdrop.js + "slider" : loads slider.js + + @return + + @error + +} { + set ah_base_url [ah::get_url] + set script "" + + if { $default_p } { + append script " \n" + append script " \n" + } else { + if { [info exists source] } { + # load other js libraries + switch $source { + "animation" { + append script " \n" + } + "event" { + append script " \n" + } + "treeview" { + append script " \n" + } + "calendar" { + append script " \n" + } + "dragdrop" { + append script " \n" + } + "slider" { + append script " \n" + } + + default { + # invalid value for source + } + } + } + } + + return $script +} + +ad_proc -public ah::yahoo::addlistener { + -element:required + -event:required + {-callback ""} + {-element_is_var:boolean} +} { + Creates javascript for Yahoo's Event Listener. +} { + if { !$element_is_var_p } { + set element [ah::isnot_js_var $element] + } + return "YAHOO.util.Event.addListener($element,\"$event\",${callback});\n" +} \ No newline at end of file Index: openacs-4/packages/ajaxhelper/www/doc/index.html =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/doc/index.html,v diff -u -r1.1 -r1.2 --- openacs-4/packages/ajaxhelper/www/doc/index.html 9 Feb 2006 08:35:42 -0000 1.1 +++ openacs-4/packages/ajaxhelper/www/doc/index.html 5 Apr 2006 06:38:42 -0000 1.2 @@ -53,7 +53,7 @@     @ah_sources;noquote@

Compiled Template:
-
<script<script type="text/javascript" src="/ajax/prototype/prototype.js"></script> 
<scriptscript> 
<script type="text/javascript" src="/ajax/scriptaculous/slider.js"></script>
<scriptscript>
+
<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 Ajax Helper has support for overlibmws (DHTML callouts) and -RICO (other cinematic effects) in addition to scriptaculous.  -Scriptaculous is the default javascript library.
+effects. Ajax Helper has support for overlibmws (DHTML callouts) and +RICO (other cinematic effects) in addition to scriptaculous.

To generate the javascript sources for Rico :

@@ -97,7 +97,7 @@
NOTE :

-You can combine sources by doing this
+You can combine sources by doing something like this

    set ah_sources [ah::js_sources -default]
    append ah_sources [ah::js_sources -source @@ -112,140 +112,29 @@
Ajax Procedures :

-Prototype has a pair of javascript functions that alllow +Scriptaculous 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.
+for more informaiton about the scriptaculous functions.

The TCL API is used like this

-    set request [ah::ajaxrequest -url -"/url/to/call"  -\
-            -            -            -            -     -pars -"parameter1=parameter_value&parameter1=parameter_value"  ]
+    set request [ah::ajaxrequest -url "/url/to/call" +-pars "parameter1=parameter_value&parameter1=parameter_value" +-options "asynchronous:true" ]

The above api will generate an ajax.request javascript function that is -best placed in an  event like "onClick".
+best placed in a javascript event.

    <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.
-
-
-
-
-
-
-
+
Index: openacs-4/packages/ajaxhelper/www/overlibmws/iframecontentmws.js =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/overlibmws/Attic/iframecontentmws.js,v diff -u -r1.1 -r1.2 --- openacs-4/packages/ajaxhelper/www/overlibmws/iframecontentmws.js 9 Feb 2006 08:35:42 -0000 1.1 +++ openacs-4/packages/ajaxhelper/www/overlibmws/iframecontentmws.js 5 Apr 2006 06:38:42 -0000 1.2 @@ -1,20 +1,3 @@ -/* - iframecontentmws.js - Foteos Macrides - Initial: October 10, 2004 - Last Revised: May 9, 2005 - Simple script for using an HTML file as iframe content in overlibmws popups. - Include WRAP and TEXTPADDING,0 in the overlib call to ensure that the width - arg is respected (unless the CAPTION plus CLOSETEXT widths add up to more than - the width arg, in which case you should increase the width arg). The name arg - should be a unique string for each popup with iframe content in the document. - The frameborder arg should be 1 (browser default if omitted) or 0. - - See http://www.macridesweb.com/oltest/IFRAME.html for demonstration. -*/ - -function OLiframeContent(src, width, height, name, frameborder) { - return (''); -} +function OLiframeContent(src, width, height, name, frameborder) { + return (''); +} Index: openacs-4/packages/ajaxhelper/www/rico/rounder.js =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/rico/Attic/rounder.js,v diff -u -r1.1 -r1.2 --- openacs-4/packages/ajaxhelper/www/rico/rounder.js 9 Feb 2006 08:35:44 -0000 1.1 +++ openacs-4/packages/ajaxhelper/www/rico/rounder.js 5 Apr 2006 06:38:42 -0000 1.2 @@ -78,7 +78,11 @@ var slice = document.createElement("span"); var inStyle = slice.style; - inStyle.backgroundColor = color; + if(/MSIE/.test(navigator.userAgent)){ + inStyle.backgroundColor = '#fff'; + } else { + inStyle.backgroundColor = color; + } inStyle.display = "block"; inStyle.height = "1px"; inStyle.overflow = "hidden"; @@ -92,6 +96,9 @@ inStyle.borderRightWidth = "0px"; inStyle.borderBottomWidth = "0px"; inStyle.height = "0px"; // assumes css compliant box model + if(/MSIE/.test(navigator.userAgent)){ + inStyle.height = "1px"; // so make IE use 1px + } inStyle.borderColor = borderColor; } else if(borderColor) { @@ -473,4 +480,4 @@ } return { h : hue, s : saturation, b : brightness }; -} \ No newline at end of file +} Index: openacs-4/packages/ajaxhelper/www/yahoo/YAHOO.js =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/yahoo/Attic/YAHOO.js,v diff -u --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ openacs-4/packages/ajaxhelper/www/yahoo/YAHOO.js 5 Apr 2006 06:38:42 -0000 1.1 @@ -0,0 +1,63 @@ +/* +Copyright (c) 2006 Yahoo! Inc. All rights reserved. +version 0.9.0 +*/ + +/** + * @class The Yahoo global namespace + */ +var YAHOO = function() { + + return { + + /** + * Yahoo presentation platform utils namespace + */ + util: {}, + + /** + * Yahoo presentation platform widgets namespace + */ + widget: {}, + + /** + * Yahoo presentation platform examples namespace + */ + example: {}, + + /** + * Returns the namespace specified and creates it if it doesn't exist + * + * YAHOO.namespace("property.package"); + * YAHOO.namespace("YAHOO.property.package"); + * + * Either of the above would create YAHOO.property, then + * YAHOO.property.package + * + * @param {String} sNameSpace String representation of the desired + * namespace + * @return {Object} A reference to the namespace object + */ + namespace: function( sNameSpace ) { + + if (!sNameSpace || !sNameSpace.length) { + return null; + } + + var levels = sNameSpace.split("."); + + var currentNS = YAHOO; + + // YAHOO is implied, so it is ignored if it is included + for (var i=(levels[0] == "YAHOO") ? 1 : 0; i0){ + this.setHeader(o); + } + postData?o.conn.send(postData):o.conn.send(null); + + return o; + } + }, + + /** + * This method serves as a timer that polls the XHR object's readyState + * property during a transaction, instead of binding a callback to the + * onreadystatechange event. Upon readyState 4, handleTransactionResponse + * will process the response, and the timer will be cleared. + * + * @private + * @param {object} o The connection object + * @param callback User-defined callback object + * @param callbackArg User-defined arguments passed to the callback + * @return void + */ + handleReadyState:function(o, callback) + { + var oConn = this; + var poll = window.setInterval( + function(){ + if(o.conn.readyState==4){ + oConn.handleTransactionResponse(o, callback); + window.clearInterval(poll); + } + } + ,this._polling_interval); + }, + + /** + * This method attempts to interpret the server response and + * determine whether the transaction was successful, or if an error or + * exception was encountered. + * + * @private + * @param {object} o The connection object + * @param {function} callback - User-defined callback object + * @param {} callbackArg - User-defined arguments to be passed to the callback + * @return void + */ + handleTransactionResponse:function(o, callback) + { + var httpStatus; + var responseObject; + + try{ + httpStatus = o.conn.status; + } + catch(e){ + // 13030 is the custom code to indicate the condition -- in Mozilla/FF -- + // when the o object's status and statusText properties are + // unavailable, and a query attempt throws an exception. + httpStatus = 13030; + } + + if(httpStatus == 200){ + responseObject = this.createResponseObject(o, callback.argument); + if(callback.success){ + if(!callback.scope){ + callback.success(responseObject); + } + else{ + callback.success.apply(callback.scope, [responseObject]); + } + } + } + else{ + switch(httpStatus){ + // The following case labels are wininet.dll error codes that may be encountered. + // Server timeout + case 12002: + // 12029 to 12031 correspond to dropped connections. + case 12029: + case 12030: + case 12031: + // Connection closed by server. + case 12152: + // See above comments for variable status. + case 13030: + responseObject = this.createExceptionObject(o, callback.argument); + if(callback.failure){ + if(!callback.scope){ + callback.failure(responseObject); + } + else{ + callback.failure.apply(callback.scope,[responseObject]); + } + } + break; + default: + responseObject = this.createResponseObject(o, callback.argument); + if(callback.failure){ + if(!callback.scope){ + callback.failure(responseObject); + } + else{ + callback.failure.apply(callback.scope,[responseObject]); + } + } + } + } + + this.releaseObject(o); + }, + + /** + * This method evaluates the server response, creates and returns the results via + * its properties. Success and failure cases(and exceptions) will differ in their defined properties + * but property "type" will confirm the transaction's status. + * @private + * @param {object} o The connection object + * @param {} callbackArg User-defined arguments to be passed to the callback + * @param {boolean} isSuccess Indicates whether the transaction was successful or not. + * @return object + */ + createResponseObject:function(o, callbackArg) + { + var obj = {}; + + obj.tId = o.tId; + obj.status = o.conn.status; + obj.statusText = o.conn.statusText; + obj.allResponseHeaders = o.conn.getAllResponseHeaders(); + obj.responseText = o.conn.responseText; + obj.responseXML = o.conn.responseXML; + if(callbackArg){ + obj.argument = callbackArg; + } + + return obj; + }, + + /** + * If a transaction cannot be completed due to dropped or closed connections, + * there may be not be enough information to build a full response object. + * The object's property "type" value will be "failure", and two additional + * unique, properties are added - errorCode and errorText. + * @private + * @param {int} tId Transaction Id + * @param callbackArg The user-defined arguments + * @param {string} errorCode Error code associated with the exception. + * @param {string} errorText Error message describing the exception. + * @return object + */ + createExceptionObject:function(tId, callbackArg) + { + var COMM_CODE = 0; + var COMM_ERROR = 'communication failure'; + + var obj = {}; + + obj.tId = tId; + obj.status = COMM_CODE; + obj.statusText = COMM_ERROR; + if(callbackArg){ + obj.argument = callbackArg; + } + + return obj; + }, + + /** + * Accessor that stores the HTTP headers for each transaction. + * @public + * @param {string} label The HTTP header label + * @param {string} value The HTTP header value + * @return void + */ + initHeader:function(label,value) + { + var oHeader = [label,value]; + this._http_header.push(oHeader); + }, + + /** + * Accessor that sets the HTTP headers for each transaction. + * @private + * @param {object} o The connection object for the transaction. + * @return void + */ + setHeader:function(o) + { + var oHeader = this._http_header; + for(var i=0;i= this.left && + region.right <= this.right && + region.top >= this.top && + region.bottom <= this.bottom ); +}; + +/** + * Returns the area of the region + * + * @return {int} the region's area + */ +YAHOO.util.Region.prototype.getArea = function() { + return ( (this.bottom - this.top) * (this.right - this.left) ); +}; + +/** + * Returns the region where the passed in region overlaps with this one + * + * @param {Region} region The region that intersects + * @return {Region} The overlap region, or null if there is no overlap + */ +YAHOO.util.Region.prototype.intersect = function(region) { + var t = Math.max( this.top, region.top ); + var r = Math.min( this.right, region.right ); + var b = Math.min( this.bottom, region.bottom ); + var l = Math.max( this.left, region.left ); + + if (b >= t && r >= l) { + return new YAHOO.util.Region(t, r, b, l); + } else { + return null; + } +}; + +/** + * Returns the region representing the smallest region that can contain both + * the passed in region and this region. + * + * @param {Region} region The region that to create the union with + * @return {Region} The union region + */ +YAHOO.util.Region.prototype.union = function(region) { + var t = Math.min( this.top, region.top ); + var r = Math.max( this.right, region.right ); + var b = Math.max( this.bottom, region.bottom ); + var l = Math.min( this.left, region.left ); + + return new YAHOO.util.Region(t, r, b, l); +}; + +/** + * toString + * @return string the region properties + */ +YAHOO.util.Region.prototype.toString = function() { + return ( "Region {" + + " t: " + this.top + + ", r: " + this.right + + ", b: " + this.bottom + + ", l: " + this.left + + "}" ); +} + +/** + * Returns a region that is occupied by the DOM element + * + * @param {HTMLElement} el The element + * @return {Region} The region that the element occupies + * @static + */ +YAHOO.util.Region.getRegion = function(el) { + var p = YAHOO.util.Dom.getXY(el); + + var t = p[1]; + var r = p[0] + el.offsetWidth; + var b = p[1] + el.offsetHeight; + var l = p[0]; + + return new YAHOO.util.Region(t, r, b, l); +}; + +///////////////////////////////////////////////////////////////////////////// + + +/** + * @class + * + * A point is a region that is special in that it represents a single point on + * the grid. + * + * @param {int} x The X position of the point + * @param {int} y The Y position of the point + * @constructor + * @extends Region + */ +YAHOO.util.Point = function(x, y) { + /** + * The X position of the point + * @type int + */ + this.x = x; + + /** + * The Y position of the point + * @type int + */ + this.y = y; + + this.top = y; + this.right = x; + this.bottom = y; + this.left = x; +}; + +YAHOO.util.Point.prototype = new YAHOO.util.Region(); Index: openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/license.txt =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/Attic/license.txt,v diff -u --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/license.txt 5 Apr 2006 06:38:43 -0000 1.1 @@ -0,0 +1,35 @@ +Software License Agreement (BSD License) + +Copyright (c) 2006, Yahoo! Inc. +All rights reserved. + +Redistribution and use of this software in source and binary forms, with +or without modification, are permitted provided that the following +conditions are met: + +* Redistributions of source code must retain the above + copyright notice, this list of conditions and the + following disclaimer. + +* Redistributions in binary form must reproduce the above + copyright notice, this list of conditions and the + following disclaimer in the documentation and/or other + materials provided with the distribution. + +* Neither the name of Yahoo! Inc. nor the names of its + contributors may be used to endorse or promote products + derived from this software without specific prior + written permission of Yahoo! Inc. + +THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS +IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED +TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A +PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER +OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, +EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, +PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR +PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF +LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING +NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS +SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. + Index: openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/build/YAHOO.js =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/build/Attic/YAHOO.js,v diff -u --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/build/YAHOO.js 5 Apr 2006 06:38:43 -0000 1.1 @@ -0,0 +1,63 @@ +/* +Copyright (c) 2006 Yahoo! Inc. All rights reserved. +version 0.9.0 +*/ + +/** + * @class The Yahoo global namespace + */ +var YAHOO = function() { + + return { + + /** + * Yahoo presentation platform utils namespace + */ + util: {}, + + /** + * Yahoo presentation platform widgets namespace + */ + widget: {}, + + /** + * Yahoo presentation platform examples namespace + */ + example: {}, + + /** + * Returns the namespace specified and creates it if it doesn't exist + * + * YAHOO.namespace("property.package"); + * YAHOO.namespace("YAHOO.property.package"); + * + * Either of the above would create YAHOO.property, then + * YAHOO.property.package + * + * @param {String} sNameSpace String representation of the desired + * namespace + * @return {Object} A reference to the namespace object + */ + namespace: function( sNameSpace ) { + + if (!sNameSpace || !sNameSpace.length) { + return null; + } + + var levels = sNameSpace.split("."); + + var currentNS = YAHOO; + + // YAHOO is implied, so it is ignored if it is included + for (var i=(levels[0] == "YAHOO") ? 1 : 0; i + *
  • linked element: the element that is passed into the constructor. + * This is the element which defines the boundaries for interaction with + * other DragDrop objects.
    • + *
  • handle element(s): The drag operation only occurs if the element that + * was clicked matches a handle element. By default this is the linked + * element, but there are times that you will want only a portion of the + * linked element to initiate the drag operation, and the setHandleElId() + * method provides a way to define this.
    • + *
  • drag element: this represents an the element that would be moved along + * with the cursor during a drag operation. By default, this is the linked + * element itself as in {@link YAHOO.util.DD}. setDragElId() lets you define + * a separate element that would be moved, as in {@link YAHOO.util.DDProxy} + *
    • + * + * This class should not be instantiated until the onload event to ensure that + * the associated elements are available. + * The following would define a DragDrop obj that would interact with any + * other * DragDrop obj in the "group1" group: + * 
    + *  dd = new YAHOO.util.DragDrop("div1", "group1");
+ *
    + * Since none of the event handlers have been implemented, nothing would + * actually happen if you were to run the code above. Normally you would + * override this class or one of the default implementations, but you can + * also override the methods you want on an instance of the class... + * 
    + *  dd.onDragDrop = function(e, id) {
+ *   alert("dd was dropped on " + id);
+ *  }
+ *
    + * @constructor + * @param {String} id of the element that is linked to this instance + * @param {String} sGroup the group of related DragDrop objects + */ +YAHOO.util.DragDrop = function(id, sGroup) { + if (id) { + this.init(id, sGroup); + } +}; + +YAHOO.util.DragDrop.prototype = { + + /** + * The id of the element associated with this object. This is what we + * refer to as the "linked element" because the size and position of + * this element is used to determine when the drag and drop objects have + * interacted. + * + * @type String + */ + id: null, + + /** + * The id of the element that will be dragged. By default this is same + * as the linked element , but could be changed to another element. Ex: + * YAHOO.util.DDProxy + * + * @type String + * @private + */ + dragElId: null, + + /** + * the id of the element that initiates the drag operation. By default + * this is the linked element, but could be changed to be a child of this + * element. This lets us do things like only starting the drag when the + * header element within the linked html element is clicked. + * + * @type String + * @private + */ + handleElId: null, + + /** + * An array of HTML tags that will be ignored if clicked. + */ + invalidHandleTypes: null, + + /** + * The linked element's absolute X position at the time the drag was + * started + * + * @type int + * @private + */ + startPageX: 0, + + /** + * The linked element's absolute X position at the time the drag was + * started + * + * @type int + * @private + */ + startPageY: 0, + + /** + * The group defines a logical collection of DragDrop objects that are + * related. Instances only get events when interacting with other + * DragDrop object in the same group. This lets us define multiple + * groups using a single DragDrop subclass if we want. + * + */ + groups: null, + + /** + * Individual drag/drop instances can be locked. This will prevent + * onmousedown start drag. + * + * @type boolean + * @private + */ + locked: false, + + /** + * Lock this instance + */ + lock: function() { this.locked = true; }, + + /** + * Unlock this instace + */ + unlock: function() { this.locked = false; }, + + /** + * By default, all insances can be a drop target. This can be disabled by + * setting isTarget to false. + * + * @type boolean + */ + isTarget: true, + + /** + * The padding configured for this drag and drop object for calculating + * the drop zone intersection with this object. + */ + padding: null, + + /** + * @private + */ + _domRef: null, + + /** + * Internal typeof flag + * @private + */ + __ygDragDrop: true, + + /** + * Set to true when horizontal contraints are applied + * + * @type boolean + * @private + */ + constrainX: false, + + /** + * Set to true when vertical contraints are applied + * + * @type boolean + * @private + */ + constrainY: false, + + /** + * The left constraint + * + * @type int + * @private + */ + minX: 0, + + /** + * The right constraint + * + * @type int + * @private + */ + maxX: 0, + + /** + * The up constraint + * + * @type int + * @private + */ + minY: 0, + + /** + * The down constraint + * + * @type int + * @private + */ + maxY: 0, + + /** + * Maintain offsets when we resetconstraints. Used to maintain the + * slider thumb value, and this needs to be fixed. + * @type boolean + */ + maintainOffset: false, + + /** + * Array of pixel locations the element will snap to if we specified a + * horizontal graduation/interval. This array is generated automatically + * when you define a tick interval. + * @type int[] + */ + xTicks: null, + + /** + * Array of pixel locations the element will snap to if we specified a + * vertical graduation/interval. This array is generated automatically + * when you define a tick interval. + * @type int[] + */ + yTicks: null, + + /** + * By default the drag and drop instance will only respond to the primary + * button click (left button for a right-handed mouse). Set to true to + * allow drag and drop to start with any mouse click that is propogated + * by the browser + * @type boolean + */ + primaryButtonOnly: true, + + /** + * Code that executes immediately before the startDrag event + * @private + */ + b4StartDrag: function(x, y) { }, + + /** + * Abstract method called after a drag/drop object is clicked + * and the drag or mousedown time thresholds have beeen met. + * + * @param {int} X click location + * @param {int} Y click location + */ + startDrag: function(x, y) { /* override this */ }, + + /** + * Code that executes immediately before the onDrag event + * @private + */ + b4Drag: function(e) { }, + + /** + * Abstract method called during the onMouseMove event while dragging an + * object. + * + * @param {Event} e + */ + onDrag: function(e) { /* override this */ }, + + /** + * Code that executes immediately before the onDragEnter event + * @private + */ + // b4DragEnter: function(e) { }, + + /** + * Abstract method called when this element fist begins hovering over + * another DragDrop obj + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this is hovering over. In INTERSECT mode, an array of one or more + * dragdrop items being hovered over. + */ + onDragEnter: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the onDragOver event + * @private + */ + b4DragOver: function(e) { }, + + /** + * Abstract method called when this element is hovering over another + * DragDrop obj + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this is hovering over. In INTERSECT mode, an array of dd items + * being hovered over. + */ + onDragOver: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the onDragOut event + * @private + */ + b4DragOut: function(e) { }, + + /** + * Abstract method called when we are no longer hovering over an element + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this was hovering over. In INTERSECT mode, an array of dd items + * that the mouse is no longer over. + */ + onDragOut: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the onDragDrop event + * @private + */ + b4DragDrop: function(e) { }, + + /** + * Abstract method called when this item is dropped on another DragDrop + * obj + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this was dropped on. In INTERSECT mode, an array of dd items this + * was dropped on. + */ + onDragDrop: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the endDrag event + * @private + */ + b4EndDrag: function(e) { }, + + /** + * Fired when we are done dragging the object + * + * @param {Event} e + */ + endDrag: function(e) { /* override this */ }, + + /** + * Code executed immediately before the onMouseDown event + + * @param {Event} e + * @private + */ + b4MouseDown: function(e) { }, + + /** + * Event handler that fires when a drag/drop obj gets a mousedown + * @param {Event} e + */ + onMouseDown: function(e) { /* override this */ }, + + /** + * Event handler that fires when a drag/drop obj gets a mouseup + * @param {Event} e + */ + onMouseUp: function(e) { /* override this */ }, + + /** + * Returns a reference to the linked element + * + * @return {Object} the html element + */ + getEl: function() { + if (!this._domRef) { + this._domRef = this.DDM.getElement(this.id); + } + + return this._domRef; + }, + + /** + * Returns a reference to the actual element to drag. By default this is + * the same as the html element, but it can be assigned to another + * element. An example of this can be found in YAHOO.util.DDProxy + * + * @return {Object} the html element + */ + getDragEl: function() { + return this.DDM.getElement(this.dragElId); + }, + + /** + * Sets up the DragDrop object. Must be called in the constructor of any + * YAHOO.util.DragDrop subclass + * + * @param id the id of the linked element + * @param {String} sGroup the group of related items + * element is supposed to be a target only, set to false. + */ + init: function(id, sGroup) { + this.initTarget(id, sGroup); + YAHOO.util.Event.addListener(id, "mousedown", + this.handleMouseDown, this, true); + }, + + /** + * Initializes Targeting functionality only... the object does not + * get a mousedown handler. + * + * @param id the id of the linked element + * @param {String} sGroup the group of related items + * element is supposed to be a target only, set to false. + */ + initTarget: function(id, sGroup) { + + // create a local reference to the drag and drop manager + this.DDM = YAHOO.util.DDM; + + // create a logger instance + this.logger = new ygLogger("DragDrop"); + + // set the default padding + this.padding = [0, 0, 0, 0]; + + // initialize the groups array + this.groups = {}; + + // set the id + this.id = id; + + // the element is a drag handle by default + this.setDragElId(id); + + // by default, clicked anchors will not start drag operations + this.invalidHandleTypes = {a : "a"}; + + // We don't want to register this as the handle with the manager + // so we just set the id rather than calling the setter + this.handleElId = id; + + // cache the position of the element if we can + if (document && document.body) { + this.setInitPosition(); + } + + // add to an interaction group + this.addToGroup((sGroup) ? sGroup : "default"); + + }, + + /** + * Configures the padding for the target zone in px. Effectively expands + * (or reduces) the virtual object size for targeting calculations. + * Supports css-style shorthand; if only one parameter is passed, all sides + * will have that padding, and if only two are passed, the top and bottom + * will have the first param, the left and right the second. + * @param {int} iTop Top pad + * @param {int} iRight Right pad + * @param {int} iBot Bot pad + * @param {int} iLeft Left pad + */ + setPadding: function(iTop, iRight, iBot, iLeft) { + // this.padding = [iLeft, iRight, iTop, iBot]; + if (!iRight && 0 !== iRight) { + this.padding = [iTop, iTop, iTop, iTop]; + } else if (!iBot && 0 !== iBot) { + this.padding = [iTop, iRight, iTop, iRight]; + } else { + this.padding = [iTop, iRight, iBot, iLeft]; + } + }, + + /** + * Stores the initial placement of the dd element + */ + setInitPosition: function(diffX, diffY) { + var el = this.getEl(); + + if (!this.DDM.verifyEl(el)) { + this.logger.debug(this.id + " element is broken"); + return; + } + + var dx = diffX || 0; + var dy = diffY || 0; + + var p = YAHOO.util.Dom.getXY( el ); + + this.initPageX = p[0] - dx; + this.initPageY = p[1] - dy; + + this.lastPageX = p[0]; + this.lastPageY = p[1]; + + this.setStartPosition(p); + }, + + /** + * Sets the start position of the element. This is set when the obj + * is initialized, the reset when a drag is started. + * @param pos current position (from previous lookup) + * @private + */ + setStartPosition: function(pos) { + + var p = pos || YAHOO.util.Dom.getXY( this.getEl() ); + + this.startPageX = p[0]; + this.startPageY = p[1]; + }, + + /** + * Add this instance to a group of related drag/drop objects. All + * instances belong to at least one group, and can belong to as many + * groups as needed. + * + * @param sGroup {string} the name of the group + */ + addToGroup: function(sGroup) { + this.groups[sGroup] = true; + this.DDM.regDragDrop(this, sGroup); + }, + + /** + * Allows you to specify that an element other than the linked element + * will be moved with the cursor during a drag + * + * @param id the id of the element that will be used to initiate the drag + */ + setDragElId: function(id) { + this.dragElId = id; + }, + + /** + * Allows you to specify a child of the linked element that should be + * used to initiate the drag operation. An example of this would be if + * you have a content div with text and links. Clicking anywhere in the + * content area would normally start the drag operation. Use this method + * to specify that an element inside of the content div is the element + * that starts the drag operation. + * + * @param id the id of the element that will be used to initiate the drag + */ + setHandleElId: function(id) { + this.handleElId = id; + this.DDM.regHandle(this.id, id); + }, + + /** + * Allows you to set an element outside of the linked element as a drag + * handle + */ + setOuterHandleElId: function(id) { + this.logger.debug("Adding outer handle event: " + id); + YAHOO.util.Event.addListener(id, "mousedown", + this.handleMouseDown, this, true); + this.setHandleElId(id); + }, + + /** + * Remove all drag and drop hooks for this element + */ + unreg: function() { + this.logger.debug("DragDrop obj cleanup " + this.id); + YAHOO.util.Event.removeListener(this.id, "mousedown", + this.handleMouseDown); + this._domRef = null; + this.DDM._remove(this); + }, + + /** + * Returns true if this instance is locked, or the drag drop mgr is locked + * (meaning that all drag/drop is disabled on the page.) + * + * @return {boolean} true if this obj or all drag/drop is locked, else + * false + */ + isLocked: function() { + return (this.DDM.isLocked() || this.locked); + }, + + /** + * Fired when this object is clicked + * + * @param {Event} e + * @param {YAHOO.util.DragDrop} oDD the clicked dd object (this dd obj) + * @private + */ + handleMouseDown: function(e, oDD) { + + this.logger.debug("isLocked: " + this.isLocked()); + + var EU = YAHOO.util.Event; + + + var button = e.which || e.button; + this.logger.debug("button: " + button); + + if (this.primaryButtonOnly && button > 1) { + this.logger.debug("Mousedown was not produced by the primary button"); + return; + } + + if (this.isLocked()) { + this.logger.debug("Drag and drop is disabled, aborting"); + return; + } + + this.logger.debug("mousedown " + this.id); + + this.DDM.refreshCache(this.groups); + + // Only process the event if we really clicked within the linked + // element. The reason we make this check is that in the case that + // another element was moved between the clicked element and the + // cursor in the time between the mousedown and mouseup events. When + // this happens, the element gets the next mousedown event + // regardless of where on the screen it happened. + var pt = new YAHOO.util.Point(EU.getPageX(e), EU.getPageY(e)); + if ( this.DDM.isOverTarget(pt, this) ) { + + this.logger.debug("click is legit"); + + // check to see if the handle was clicked + var srcEl = EU.getTarget(e); + + if (this.isValidHandleChild(srcEl) && + (this.id == this.handleElId || + this.DDM.handleWasClicked(srcEl, this.id)) ) { + + // set the initial element position + this.setStartPosition(); + + this.logger.debug("firing onMouseDown events"); + + + this.b4MouseDown(e); + this.onMouseDown(e); + this.DDM.handleMouseDown(e, this); + + this.DDM.stopEvent(e); + } + } + }, + + /** + * Allows you to specify a tag name that should not start a drag operation + * when clicked. This is designed to facilitate embedding links within a + * drag handle that do something other than start the drag. + * + * @param {string} tagName the type of element to exclude + */ + addInvalidHandleType: function(tagName) { + var type = tagName.toUpperCase(); + this.invalidHandleTypes[type] = type; + }, + + /** + * Unsets an excluded tag name set by addInvalidHandleType + * + * @param {string} tagName the type of element to unexclude + */ + removeInvalidHandleType: function(tagName) { + var type = tagName.toUpperCase(); + this.invalidHandleTypes[type] = null; + }, + + /** + * Checks the tag exclusion list to see if this click should be ignored + * + * @param {ygNode} node + * @return {boolean} true if this is a valid tag type, false if not + */ + isValidHandleChild: function(node) { + var type = node.nodeName; + + if (type == "#text") { + // this.logger.debug("text node, getting parent node type"); + type = node.parentNode.nodeName; + } + + return (!this.invalidHandleTypes[type]); + }, + + /** + * Create the array of horizontal tick marks if an interval was specified + * in setXConstraint(). + * + * @private + */ + setXTicks: function(iStartX, iTickSize) { + this.xTicks = []; + this.xTickSize = iTickSize; + + var tickMap = {}; + + for (var i = this.initPageX; i >= this.minX; i = i - iTickSize) { + if (!tickMap[i]) { + this.xTicks[this.xTicks.length] = i; + tickMap[i] = true; + } + } + + for (i = this.initPageX; i <= this.maxX; i = i + iTickSize) { + if (!tickMap[i]) { + this.xTicks[this.xTicks.length] = i; + tickMap[i] = true; + } + } + + this.xTicks.sort(this.DDM.numericSort) ; + this.logger.debug("xTicks: " + this.xTicks.join()); + }, + + /** + * Create the array of vertical tick marks if an interval was specified in + * setYConstraint(). + * + * @private + */ + setYTicks: function(iStartY, iTickSize) { + this.yTicks = []; + this.yTickSize = iTickSize; + + var tickMap = {}; + + for (var i = this.initPageY; i >= this.minY; i = i - iTickSize) { + if (!tickMap[i]) { + this.yTicks[this.yTicks.length] = i; + tickMap[i] = true; + } + } + + for (i = this.initPageY; i <= this.maxY; i = i + iTickSize) { + if (!tickMap[i]) { + this.yTicks[this.yTicks.length] = i; + tickMap[i] = true; + } + } + + this.yTicks.sort(this.DDM.numericSort) ; + this.logger.debug("yTicks: " + this.yTicks.join()); + }, + + /** + * By default, the element can be dragged any place on the screen. Use + * this method to limit the horizontal travel of the element. Pass in + * 0,0 for the parameters if you want to lock the drag to the y axis. + * + * @param {int} iLeft the number of pixels the element can move to the left + * @param {int} iRight the number of pixels the element can move to the + * right + * @param {int} iTickSize optional parameter for specifying that the + * element + * should move iTickSize pixels at a time. + */ + setXConstraint: function(iLeft, iRight, iTickSize) { + this.leftConstraint = iLeft; + this.rightConstraint = iRight; + + this.minX = this.initPageX - iLeft; + this.maxX = this.initPageX + iRight; + if (iTickSize) { this.setXTicks(this.initPageX, iTickSize); } + + this.constrainX = true; + this.logger.debug("initPageX:" + this.initPageX + " minX:" + this.minX + + " maxX:" + this.maxX); + }, + + /** + * By default, the element can be dragged any place on the screen. Set + * this to limit the vertical travel of the element. Pass in 0,0 for the + * parameters if you want to lock the drag to the x axis. + * + * @param {int} iUp the number of pixels the element can move up + * @param {int} iDown the number of pixels the element can move down + * @param {int} iTickSize optional parameter for specifying that the + * element should move iTickSize pixels at a time. + */ + setYConstraint: function(iUp, iDown, iTickSize) { + this.topConstraint = iUp; + this.bottomConstraint = iDown; + + this.minY = this.initPageY - iUp; + this.maxY = this.initPageY + iDown; + if (iTickSize) { this.setYTicks(this.initPageY, iTickSize); } + + this.constrainY = true; + + this.logger.debug("initPageY:" + this.initPageY + " minY:" + this.minY + + " maxY:" + this.maxY); + }, + + /** + * resetConstraints must be called if you manually reposition a dd element. + * @param {boolean} maintainOffset + */ + resetConstraints: function() { + + // this.logger.debug("init pagexy: " + this.initPageX + ", " + + // this.initPageY); + // this.logger.debug("last pagexy: " + this.lastPageX + ", " + + // this.lastPageY); + + // figure out how much this thing has moved + var dx = (this.maintainOffset) ? this.lastPageX - this.initPageX : 0; + var dy = (this.maintainOffset) ? this.lastPageY - this.initPageY : 0; + + // this.logger.debug("diff: " + dx + ", " + dy); + + // reset the initial location + this.setInitPosition(dx, dy); + + if (this.constrainX) { + this.setXConstraint( this.leftConstraint, + this.rightConstraint, + this.xTickSize ); + } + + if (this.constrainY) { + this.setYConstraint( this.topConstraint, + this.bottomConstraint, + this.yTickSize ); + } + }, + + /** + * Normally the drag element is moved pixel by pixel, but we can specify + * that it move a number of pixels at a time. This method resolves the + * location when we have it set up like this. + * + * @param {int} val where we want to place the object + * @param {int[]} tickArray sorted array of valid points + * @return {int} the closest tick + * @private + */ + getTick: function(val, tickArray) { + + if (!tickArray) { + // If tick interval is not defined, it is effectively 1 pixel, + // so we return the value passed to us. + return val; + } else if (tickArray[0] >= val) { + // The value is lower than the first tick, so we return the first + // tick. + return tickArray[0]; + } else { + for (var i = 0; i < tickArray.length; ++i) { + var next = i + 1; + if (tickArray[next] && tickArray[next] >= val) { + var diff1 = val - tickArray[i]; + var diff2 = tickArray[next] - val; + return (diff2 > diff1) ? tickArray[i] : tickArray[next]; + } + } + + // The value is larger than the last tick, so we return the last + // tick. + return tickArray[tickArray.length - 1]; + } + }, + + /** + * toString method + * @return {string} string representation of the dd obj + */ + toString: function(val, tickArray) { + return ("YAHOO.util.DragDrop {" + this.id + "}"); + } + +}; + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +// Only load the library once. Rewriting the manager class would orphan +// existing drag and drop instances. +if (!YAHOO.util.DragDropMgr) { + + /** + * @class Handles the element interaction for all DragDrop items in the + * window. Generally, you will not call this class directly, but it does + * have helper methods that could be useful in your DragDrop + * implementations. This class should not be instantiated; all methods + * are are static. + * + * @constructor + */ + YAHOO.util.DragDropMgr = new function() { + + /** + * utility package shorthand + * @private + */ + var UTIL = YAHOO.util; + + /** + * Two dimensional Array of registered DragDrop objects. The first + * dimension is the DragDrop item group, the second the DragDrop + * object. + * + * @private + */ + this.ids = {}; + + /** + * Array of element ids defined as drag handles. Used to determine + * if the element that generated the mousedown event is actually the + * handle and not the html element itself. + * + * @private + */ + this.handleIds = {}; + + /** + * the DragDrop object that is currently being dragged + * + * @type DragDrop + * @private + **/ + this.dragCurrent = null; + + /** + * the DragDrop object(s) that are being hovered over + * + * @type Array + * @private + */ + this.dragOvers = {}; + + /** + * @private + */ + this.logger = null; + + /** + * the X distance between the cursor and the object being dragged + * + * @type int + * @private + */ + this.deltaX = 0; + + /** + * the Y distance between the cursor and the object being dragged + * + * @type int + * @private + */ + this.deltaY = 0; + + /** + * Flag to determine if we should prevent the default behavior of the + * events we define. By default this is true, but this can be set to + * false if you need the default behavior (not recommended) + * + * @type boolean + */ + this.preventDefault = true; + + /** + * Flag to determine if we should stop the propagation of the events + * we generate. This is true by default but you may want to set it to + * false if the html element contains other features that require the + * mouse click. + * + * @type boolean + */ + this.stopPropagation = true; + + /** + * @private + */ + this.initalized = false; + + /** + * All drag and drop can be disabled. + * + * @private + */ + this.locked = false; + + /** + * Called the first time an element is registered. + * + * @private + */ + this.init = function() { + this.logger = new ygLogger("DragDropMgr"); + }; + + /** + * In point mode, drag and drop interaction is defined by the + * location of the cursor during the drag/drop + * @type int + */ + this.POINT = 0; + + /** + * In intersect mode, drag and drop interactio nis defined by the + * overlap of two or more drag and drop objects. + * @type int + */ + this.INTERSECT = 1; + + /** + * The current drag and drop mode. Default it point mode + * @type int + */ + this.mode = this.POINT; + + /** + * Runs method on all drag and drop objects + * @private + */ + this._execOnAll = function(sMethod, args) { + for (var i in this.ids) { + for (var j in this.ids[i]) { + var oDD = this.ids[i][j]; + if (! this.isTypeOfDD(oDD)) { + continue; + } + oDD[sMethod].apply(oDD, args); + } + } + }; + + /** + * Drag and drop initialization. Sets up the global event handlers + * @private + */ + this._onLoad = function() { + + this._execOnAll("setInitPosition", []); + + this.logger = new ygLogger("DragDropMgr"); + this.logger.debug("DDM onload"); + + var EU = UTIL.Event; + + EU.addListener(document, "mouseup", this.handleMouseUp, this, true); + EU.addListener(document, "mousemove", this.handleMouseMove, this, true); + EU.addListener(window, "unload", this._onUnload, this, true); + EU.addListener(window, "resize", this._onResize, this, true); + // EU.addListener(window, "mouseout", this._test); + + this.initalized = true; + + }; + + /** + * Reset constraints on all drag and drop objs + * @private + */ + this._onResize = function(e) { + this.logger.debug("window resize"); + this._execOnAll("resetConstraints", []); + }; + + /** + * Lock all drag and drop functionality + */ + this.lock = function() { this.locked = true; }; + + /** + * Unlock all drag and drop functionality + */ + this.unlock = function() { this.locked = false; }; + + /** + * Is drag and drop locked? + * + * @return {boolean} True if drag and drop is locked, false otherwise. + */ + this.isLocked = function() { return this.locked; }; + + /** + * Location cache that is set for all drag drop objects when a drag is + * initiated, cleared when the drag is finished. + * + * @private + */ + this.locationCache = {}; + + /** + * Set useCache to false if you want to force object the lookup of each + * drag and drop linked element constantly during a drag. + * @type boolean + */ + this.useCache = true; + + /** + * The number of pixels that the mouse needs to move after the + * mousedown before the drag is initiated. Default=3; + * @type int + */ + this.clickPixelThresh = 3; + + /** + * The number of milliseconds after the mousedown event to initiate the + * drag if we don't get a mouseup event. Default=1000 + * @type int + */ + this.clickTimeThresh = 1000; + + /** + * Flag that indicates that either the drag pixel threshold or the + * mousdown time threshold has been met + * @type boolean + * @private + */ + this.dragThreshMet = false; + + /** + * Timeout used for the click time threshold + * @type Object + * @private + */ + this.clickTimeout = null; + + /** + * The X position of the mousedown event stored for later use when a + * drag threshold is met. + * @type int + * @private + */ + this.startX = 0; + + /** + * The Y position of the mousedown event stored for later use when a + * drag threshold is met. + * @type int + * @private + */ + this.startY = 0; + + /** + * Each DragDrop instance must be registered with the DragDropMgr. + * This is executed in ygDragDrop.init() + * + * @param {DragDrop} oDD the DragDrop object to register + * @param {String} sGroup the name of the group this element belongs to + */ + this.regDragDrop = function(oDD, sGroup) { + if (!this.initialized) { this.init(); } + + if (!this.ids[sGroup]) { + this.ids[sGroup] = {}; + } + this.ids[sGroup][oDD.id] = oDD; + }; + + /** + * Unregisters a drag and drop item. This is executed in + * ygDragDrop.unreg, use that method instead of calling this directly. + * @private + */ + this._remove = function(oDD) { + for (var g in oDD.groups) { + if (g && this.ids[g][oDD.id]) { + delete this.ids[g][oDD.id]; + } + } + delete this.handleIds[oDD.id]; + }; + + /** + * Each DragDrop handle element must be registered. This is done + * automatically when executing ygDragDrop.setHandleElId() + * + * @param {String} sDDId the DragDrop id this element is a handle for + * @param {String} sHandleId the id of the element that is the drag + * handle + */ + this.regHandle = function(sDDId, sHandleId) { + if (!this.handleIds[sDDId]) { + this.handleIds[sDDId] = {}; + } + this.handleIds[sDDId][sHandleId] = sHandleId; + }; + + /** + * Utility function to determine if a given element has been + * registered as a drag drop item. + * + * @param {String} id the element id to check + * @return {boolean} true if this element is a DragDrop item, + * false otherwise + */ + this.isDragDrop = function(id) { + return ( this.getDDById(id) ) ? true : false; + }; + + /** + * Returns the drag and drop instances that are in all groups the + * passed in instance belongs to. + * + * @param {ygDragDrop} p_oDD the obj to get related data for + * @param {boolean} bTargetsOnly if true, only return targetable objs + * @return {ygDragDrop[]} the related instances + */ + this.getRelated = function(p_oDD, bTargetsOnly) { + var oDDs = []; + for (var i in p_oDD.groups) { + for (j in this.ids[i]) { + var dd = this.ids[i][j]; + if (! this.isTypeOfDD(dd)) { + continue; + } + if (!bTargetsOnly || dd.isTarget) { + oDDs[oDDs.length] = dd; + } + } + } + + return oDDs; + }; + + /** + * Returns true if the specified dd target is a legal target for + * the specifice drag obj + * + * @param {ygDragDrop} the drag obj + * @param {ygDragDrop) the target + * @return {boolean} true if the target is a legal target for the + * dd obj + */ + this.isLegalTarget = function (oDD, oTargetDD) { + var targets = this.getRelated(oDD); + for (var i =0;i this.clickPixelThresh || + diffY > this.clickPixelThresh) { + this.logger.debug("pixel threshold met"); + this.startDrag(this.startX, this.startY); + } + } + + if (this.dragThreshMet) { + this.dragCurrent.b4Drag(e); + this.dragCurrent.onDrag(e); + this.fireEvents(e, false); + } + + this.stopEvent(e); + }; + + /** + * Iterates over all of the DragDrop elements to find ones we are + * hovering over or dropping on + * + * @param {Event} e the event + * @param {boolean} isDrop is this a drop op or a mouseover op? + * @private + */ + this.fireEvents = function(e, isDrop) { + var dc = this.dragCurrent; + + // If the user did the mouse up outside of the window, we could + // get here even though we have ended the drag. + if (!dc || dc.isLocked()) { + return; + } + + var x = UTIL.Event.getPageX(e); + var y = UTIL.Event.getPageY(e); + var pt = new YAHOO.util.Point(x,y); + + // cache the previous dragOver array + var oldOvers = []; + + var outEvts = []; + var overEvts = []; + var dropEvts = []; + var enterEvts = []; + + // Check to see if the object we were hovering over is no longer + // being hovered over so we can fire the onDragOut event + for (var i in this.dragOvers) { + + var ddo = this.dragOvers[i]; + + if (! this.isTypeOfDD(ddo)) { + continue; + } + + if (! this.isOverTarget(pt, ddo, this.mode)) { + outEvts.push( ddo ); + } + + oldOvers[i] = true; + delete this.dragOvers[i]; + } + + for (var sGroup in dc.groups) { + // this.logger.debug("Processing group " + sGroup); + + if ("string" != typeof sGroup) { + continue; + } + + for (i in this.ids[sGroup]) { + var oDD = this.ids[sGroup][i]; + if (! this.isTypeOfDD(oDD)) { + continue; + } + + if (oDD.isTarget && !oDD.isLocked() && oDD != dc) { + if (this.isOverTarget(pt, oDD, this.mode)) { + // look for drop interactions + if (isDrop) { + dropEvts.push( oDD ); + // look for drag enter and drag over interactions + } else { + + // initial drag over: dragEnter fires + if (!oldOvers[oDD.id]) { + enterEvts.push( oDD ); + // subsequent drag overs: dragOver fires + } else { + overEvts.push( oDD ); + } + + this.dragOvers[oDD.id] = oDD; + } + } + } + } + } + + if (this.mode) { + if (outEvts.length > 0) { + dc.b4DragOut(e, outEvts); + dc.onDragOut(e, outEvts); + } + + if (enterEvts.length > 0) { + dc.onDragEnter(e, enterEvts); + } + + if (overEvts.length > 0) { + dc.b4DragOver(e, overEvts); + dc.onDragOver(e, overEvts); + } + + if (dropEvts.length > 0) { + dc.b4DragDrop(e, dropEvts); + dc.onDragDrop(e, dropEvts); + } + + } else { + // fire dragout events + for (i=0; i < outEvts.length; ++i) { + this.logger.debug(dc.id+" onDragOut: " + outEvts[i].id); + dc.b4DragOut(e, outEvts[i].id); + dc.onDragOut(e, outEvts[i].id); + } + + // fire enter events + for (i=0; i < enterEvts.length; ++i) { + this.logger.debug(dc.id + " dragEnter " + enterEvts[i].id); + // dc.b4DragEnter(e, oDD.id); + dc.onDragEnter(e, enterEvts[i].id); + } + + // fire over events + for (i=0; i < overEvts.length; ++i) { + this.logger.debug(dc.id + " dragOver " + overEvts[i].id); + dc.b4DragOver(e, overEvts[i].id); + dc.onDragOver(e, overEvts[i].id); + } + + // fire drop events + for (i=0; i < dropEvts.length; ++i) { + this.logger.debug(dc.id + " dragDrop " + dropEvts[i].id); + dc.b4DragDrop(e, dropEvts[i].id); + dc.onDragDrop(e, dropEvts[i].id); + } + + } + + }; + + /** + * Helper function for getting the best match from the list of drag + * and drop objects returned by the drag and drop events when we are + * in INTERSECT mode. It returns either the first object that the + * cursor is over, or the object that has the greatest overlap with + * the dragged element. + * + * @param {ygDragDrop[]} dds The array of drag and drop objects + * targeted + * @return {ygDragDrop} The best single match + */ + this.getBestMatch = function(dds) { + var winner = null; + // Return null if the input is not what we expect + //if (!dds || !dds.length || dds.length == 0) { + // winner = null; + // If there is only one item, it wins + //} else if (dds.length == 1) { + + if (dds.length == 1) { + winner = dds[0]; + } else { + // Loop through the targeted items + for (var i=0; i= loc[3] && x <= loc[1] && y >= loc[0] && y <= loc[2]); + //oDDTarget.cursorIsOver = loc.contains( new YAHOO.util.Point(x, y) ); + oDDTarget.cursorIsOver = loc.contains( pt ); + oDDTarget.overlap = null; + + // if (this.INTERSECT == this.mode) { + if (intersect) { + + var curRegion = + YAHOO.util.Region.getRegion(this.dragCurrent.getDragEl()); + var overlap = curRegion.intersect(loc); + + if (overlap) { + oDDTarget.overlap = overlap; + return true; + } else { + return false; + } + + } else { + return oDDTarget.cursorIsOver; + } + }; + + /** + * @private + */ + this._onUnload = function(e, me) { + this.unregAll(); + }; + + /** + * Cleans up the drag and drop events and objects. + * + * @private + */ + this.unregAll = function() { + this.logger.debug("unregister all"); + + if (this.dragCurrent) { + this.stopDrag(); + this.dragCurrent = null; + } + + this._execOnAll("unreg", []); + + for (i in this.elementCache) { + delete this.elementCache[i]; + } + + this.elementCache = {}; + this.ids = {}; + }; + + /** + * A cache of DOM elements + * + * @private + */ + this.elementCache = {}; + + /** + * Get the wrapper for the DOM element specified + * + * @param {String} id the id of the elment to get + * @return {YAHOO.util.DDM.ElementWrapper} the wrapped element + * @private + */ + this.getElWrapper = function(id) { + var oWrapper = this.elementCache[id]; + if (!oWrapper || !oWrapper.el) { + // this.logger.debug("adding element cache: " + id); + oWrapper = this.elementCache[id] = + new this.ElementWrapper(document.getElementById(id)); + } + return oWrapper; + }; + + /** + * Returns the actual DOM element + * + * @param {String} id the id of the elment to get + * @return {Object} The element + */ + this.getElement = function(id) { + // return this.getElWrapper(id).el; + return document.getElementById(id); + }; + + /** + * Returns the style property for the DOM element (i.e., + * document.getElById(id).style) + * + * @param {String} id the id of the elment to get + * @return {Object} The style property of the element + */ + this.getCss = function(id) { + // return this.getElWrapper(id).css; + var css = null; + var el = document.getElementById(id); + if (el) { + css = el.style; + } + + return css; + }; + + /** + * Inner class for cached elements + */ + this.ElementWrapper = function(el) { + /** + * @private + */ + this.el = el || null; + /** + * @private + */ + this.id = this.el && el.id; + /** + * @private + */ + this.css = this.el && el.style; + }; + + /** + * Returns the X position of an html element + * @param el the element for which to get the position + * @return {int} the X coordinate + */ + this.getPosX = function(el) { + return YAHOO.util.Dom.getX(el); + }; + + /** + * Returns the Y position of an html element + * @param el the element for which to get the position + * @return {int} the Y coordinate + */ + this.getPosY = function(el) { + return YAHOO.util.Dom.getY(el); + }; + + /** + * Swap two nodes. In IE, we use the native method, for others we + * emulate the IE behavior + * + * @param n1 the first node to swap + * @param n2 the other node to swap + */ + this.swapNode = function(n1, n2) { + if (n1.swapNode) { + n1.swapNode(n2); + } else { + // the node reference order for the swap is a little tricky. + var p = n2.parentNode; + var s = n2.nextSibling; + n1.parentNode.replaceChild(n2,n1); + p.insertBefore(n1,s); + } + }; + + /** + * @private + */ + this.getScroll = function () { + var t, l; + if (document.documentElement && document.documentElement.scrollTop) { + t = document.documentElement.scrollTop; + l = document.documentElement.scrollLeft; + } else if (document.body) { + t = document.body.scrollTop; + l = document.body.scrollLeft; + } + return { top: t, left: l }; + }; + + /** + * Returns the specified element style property + * @param {HTMLElement} el the element + * @param {string} styleProp the style property + * @return {string} The value of the style property + */ + this.getStyle = function(el, styleProp) { + if (el.style.styleProp) { + return el.style.styleProp; + } else if (el.currentStyle) { + return el.currentStyle[styleProp]; + } else if (document.defaultView) { + return document.defaultView.getComputedStyle(el, null). + getPropertyValue(styleProp); + } + }; + + /** + * Gets the scrollTop + * + * @return {int} the document's scrollTop + */ + this.getScrollTop = function () { return this.getScroll().top; }; + + /** + * Gets the scrollLeft + * + * @return {int} the document's scrollTop + */ + this.getScrollLeft = function () { return this.getScroll().left; }; + + this.moveToEl = function (moveEl, targetEl) { + var aCoord = YAHOO.util.Dom.getXY(targetEl); + this.logger.debug("moveToEl: " + aCoord); + YAHOO.util.Dom.setXY(moveEl, aCoord); + }; + + /** + * Gets the client height + * + * @return {int} client height in px + */ + this.getClientHeight = function() { + return (window.innerHeight) ? window.innerHeight : + (document.documentElement && document.documentElement.clientHeight) ? + document.documentElement.clientHeight : document.body.offsetHeight; + }; + + /** + * Gets the client width + * + * @return {int} client width in px + */ + this.getClientWidth = function() { + return (window.innerWidth) ? window.innerWidth : + (document.documentElement && document.documentElement.clientWidth) ? + document.documentElement.clientWidth : document.body.offsetWidth; + }; + + /** + * numeric array sort function + */ + this.numericSort = function(a, b) { return (a - b); }; + + /** + * @private + */ + this._timeoutCount = 0; + + /** + * @private + * Trying to make the load order less important. Without this we get + * an error if this file is loaded before the Event Utility. + */ + this._addListeners = function() { + if ( UTIL.Event && + document && + document.body ) { + + this._onLoad(); + } else { + if (this._timeoutCount > 500) { + this.logger.debug("DragDrop requires the Event Utility"); + } else { + setTimeout("YAHOO.util.DDM._addListeners()", 10); + this._timeoutCount += 1; + } + } + + }; + + /** + * Recursively searches the immediate parent and all child nodes for + * the handle element in order to determine wheter or not it was + * clicked. + * + * @param node the html element to inspect + */ + this.handleWasClicked = function(node, id) { + if (this.isHandle(id, node.id)) { + this.logger.debug("clicked node is a handle"); + return true; + } else { + // check to see if this is a text node child of the one we want + var p = node.parentNode; + // this.logger.debug("p: " + p); + + while (p) { + if (this.isHandle(id, p.id)) { + return true; + } else { + this.logger.debug(p.id + " is not a handle"); + p = p.parentNode; + } + } + } + + return false; + }; + + }; + + // shorter alias, save a few bytes + YAHOO.util.DDM = YAHOO.util.DragDropMgr; + YAHOO.util.DDM._addListeners(); + +} + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +/** + * @class a DragDrop implementation where the linked element follows the + * mouse cursor. + * + * @extends DragDrop + * @constructor + * @param {String} id the id of the linked element + * @param {String} sGroup the group of related DragDrop items + */ +YAHOO.util.DD = function(id, sGroup) { + if (id) { + this.init(id, sGroup); + this.logger.setModuleName("DD"); + } +}; + +YAHOO.util.DD.prototype = new YAHOO.util.DragDrop(); + +/** + * Should we auto-scroll? Defaults to true + * + * @type boolean + */ +YAHOO.util.DD.prototype.scroll = true; + +/** + * Sets the pointer offset to the distance between the linked element's top + * left corner and the location the element was clicked + * + * @param {int} iPageX the X coordinate of the click + * @param {int} iPageY the Y coordinate of the click + */ +YAHOO.util.DD.prototype.autoOffset = function(iPageX, iPageY) { + var el = this.getEl(); + var aCoord = YAHOO.util.Dom.getXY(el); + var x = iPageX - aCoord[0]; + var y = iPageY - aCoord[1]; + this.setDelta(x, y); + this.logger.debug("autoOffset el pos: " + aCoord + ", delta: " + x + "," + y); +}; + +/** + * Sets the pointer offset. You can call this directly to force the offset to + * be in a particular location (e.g., pass in 0,0 to set it to the center of the + * object, as done in ygDDSliderBG) + * + * @param {int} iDeltaX the distance from the left + * @param {int} iDeltaY the distance from the top + */ +YAHOO.util.DD.prototype.setDelta = function(iDeltaX, iDeltaY) { + this.deltaX = iDeltaX; + this.deltaY = iDeltaY; + this.logger.debug("deltaX:" + this.deltaX + ", deltaY:" + this.deltaY); +}; + +/** + * Sets the drag element to the location of the mousedown or click event, + * maintaining the cursor location relative to the location on the element + * that was clicked. Override this if you want to place the element in a + * location other than where the cursor is. + * + * @param {int} iPageX the X coordinate of the mousedown or drag event + * @param {int} iPageY the Y coordinate of the mousedown or drag event + */ + +YAHOO.util.DD.prototype.setDragElPos = function(iPageX, iPageY) { + this.alignElWithMouse(this.getDragEl(), iPageX, iPageY); +}; + +/** + * Sets the element to the location of the mousedown or click event, + * maintaining the cursor location relative to the location on the element + * that was clicked. Override this if you want to place the element in a + * location other than where the cursor is. + * + * @param {HTMLElement} el the element to move + * @param {int} iPageX the X coordinate of the mousedown or drag event + * @param {int} iPageY the Y coordinate of the mousedown or drag event + */ +YAHOO.util.DD.prototype.alignElWithMouse = function(el, iPageX, iPageY) { + var oCoord = this.getTargetCoord(iPageX, iPageY); + var aCoord = [oCoord.x, oCoord.y]; + // this.logger.debug("****alignElWithMouse : " + el.id + ", " + aCoord + ", " + el.style.display); + YAHOO.util.Dom.setXY(el, aCoord); + + this.cachePosition(oCoord.x, oCoord.y); + + this.autoScroll(oCoord.x, oCoord.y, el.offsetHeight, el.offsetWidth); +}; + +/** + * Saves the most recent position so that we can reset the constraints and + * tick marks on-demand. We need to know this so that we can calculate the + * number of pixels the element is offset from its original position. + */ +YAHOO.util.DD.prototype.cachePosition = function(iPageX, iPageY) { + if (iPageX) { + this.lastPageX = iPageX; + this.lastPageY = iPageY; + } else { + var aCoord = YAHOO.util.Dom.getXY(this.getEl()); + this.lastPageX = aCoord[0]; + this.lastPageY = aCoord[1]; + } +}; + +/** + * Auto-scroll the window if the dragged object has been moved beyond the + * visible window boundary. + * + * @param {int} x the drag element's x position + * @param {int} y the drag element's y position + * @param {int} h the height of the drag element + * @param {int} w the width of the drag element + * @private + */ +YAHOO.util.DD.prototype.autoScroll = function(x, y, h, w) { + + if (this.scroll) { + // The client height + var clientH = this.DDM.getClientHeight(); + + // The client width + var clientW = this.DDM.getClientWidth(); + + // The amt scrolled down + var st = this.DDM.getScrollTop(); + + // The amt scrolled right + var sl = this.DDM.getScrollLeft(); + + // Location of the bottom of the element + var bot = h + y; + + // Location of the right of the element + var right = w + x; + + // The distance from the cursor to the bottom of the visible area, + // adjusted so that we don't scroll if the cursor is beyond the + // element drag constraints + var toBot = (clientH + st - y - this.deltaY); + + // The distance from the cursor to the right of the visible area + var toRight = (clientW + sl - x - this.deltaX); + + // this.logger.debug( " x: " + x + " y: " + y + " h: " + h + + // " clientH: " + clientH + " clientW: " + clientW + + // " st: " + st + " sl: " + sl + " bot: " + bot + + // " right: " + right + " toBot: " + toBot + " toRight: " + toRight); + + // How close to the edge the cursor must be before we scroll + // var thresh = (document.all) ? 100 : 40; + var thresh = 40; + + // How many pixels to scroll per autoscroll op. This helps to reduce + // clunky scrolling. IE is more sensitive about this ... it needs this + // value to be higher. + var scrAmt = (document.all) ? 80 : 30; + + // Scroll down if we are near the bottom of the visible page and the + // obj extends below the crease + if ( bot > clientH && toBot < thresh ) { + window.scrollTo(sl, st + scrAmt); + } + + // Scroll up if the window is scrolled down and the top of the object + // goes above the top border + if ( y < st && st > 0 && y - st < thresh ) { + window.scrollTo(sl, st - scrAmt); + } + + // Scroll right if the obj is beyond the right border and the cursor is + // near the border. + if ( right > clientW && toRight < thresh ) { + window.scrollTo(sl + scrAmt, st); + } + + // Scroll left if the window has been scrolled to the right and the obj + // extends past the left border + if ( x < sl && sl > 0 && x - sl < thresh ) { + window.scrollTo(sl - scrAmt, st); + } + } +}; + +/** + * Finds the location the element should be placed if we want to move + * it to where the mouse location less the click offset would place us. + * + * @param {int} iPageX the X coordinate of the click + * @param {int} iPageY the Y coordinate of the click + * @return an object that contains the coordinates (Object.x and Object.y) + * @private + */ +YAHOO.util.DD.prototype.getTargetCoord = function(iPageX, iPageY) { + + // this.logger.debug("getTargetCoord: " + iPageX + ", " + iPageY); + + var x = iPageX - this.deltaX; + var y = iPageY - this.deltaY; + + if (this.constrainX) { + if (x < this.minX) { x = this.minX; } + if (x > this.maxX) { x = this.maxX; } + } + + if (this.constrainY) { + if (y < this.minY) { y = this.minY; } + if (y > this.maxY) { y = this.maxY; } + } + + x = this.getTick(x, this.xTicks); + y = this.getTick(y, this.yTicks); + + // this.logger.debug("getTargetCoord " + + // " iPageX: " + iPageX + + // " iPageY: " + iPageY + + // " x: " + x + ", y: " + y); + + return {x:x, y:y}; +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DD.prototype.b4MouseDown = function(e) { + // this.resetConstraints(); + this.autoOffset(YAHOO.util.Event.getPageX(e), + YAHOO.util.Event.getPageY(e)); +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DD.prototype.b4Drag = function(e) { + this.setDragElPos(YAHOO.util.Event.getPageX(e), + YAHOO.util.Event.getPageY(e)); +}; + + +/////////////////////////////////////////////////////////////////////////////// +// Debugging ygDragDrop events that can be overridden +/////////////////////////////////////////////////////////////////////////////// +/* +YAHOO.util.DD.prototype.startDrag = function(x, y) { + this.logger.debug(this.id.toString() + " startDrag"); +}; + +YAHOO.util.DD.prototype.onDrag = function(e) { + this.logger.debug(this.id.toString() + " onDrag"); +}; + +YAHOO.util.DD.prototype.onDragEnter = function(e, id) { + this.logger.debug(this.id.toString() + " onDragEnter: " + id); +}; + +YAHOO.util.DD.prototype.onDragOver = function(e, id) { + this.logger.debug(this.id.toString() + " onDragOver: " + id); +}; + +YAHOO.util.DD.prototype.onDragOut = function(e, id) { + this.logger.debug(this.id.toString() + " onDragOut: " + id); +}; + +YAHOO.util.DD.prototype.onDragDrop = function(e, id) { + this.logger.debug(this.id.toString() + " onDragDrop: " + id); +}; + +YAHOO.util.DD.prototype.endDrag = function(e) { + this.logger.debug(this.id.toString() + " endDrag"); +}; +*/ + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +/** + * @class a DragDrop implementation that inserts an empty, bordered div into + * the document that follows the cursor during drag operations. At the time of + * the click, the frame div is resized to the dimensions of the linked html + * element, and moved to the exact location of the linked element. + * + * @extends YAHOO.util.DD + * @constructor + * @param {String} id the id of the linked html element + * @param {String} sGroup the group of related DragDrop objects + */ +YAHOO.util.DDProxy = function(id, sGroup) { + if (id) { + this.init(id, sGroup); + this.initFrame(); + this.logger.setModuleName("DDProxy"); + } +}; + +YAHOO.util.DDProxy.prototype = new YAHOO.util.DD(); + +/** + * A reference to the one div element we create for all instances of this class + * + * @type Object + */ +YAHOO.util.DDProxy.frameDiv = null; + +/** + * the drag frame div id + * + * @type String + */ +YAHOO.util.DDProxy.dragElId = "ygddfdiv"; + +/** + * The border width of the frame. This is used when we resize the frame to + * the size of the linked element. We substract the border width to make + * the div the correct size. + * + * @TODO find a better way to handle this + * + * @type int + */ +YAHOO.util.DDProxy.prototype.borderWidth = 2; + +/** + * By default we resize the drag frame to be the same size as the element + * we want to drag (this is to get the frame effect). We can turn it off + * if we want a different behavior (ex: ygDDMy2) + * + * @type boolean + */ +YAHOO.util.DDProxy.prototype.resizeFrame = true; + +/** + * By default the frame is positioned exactly where the drag element is, so + * we use the cursor offset provided by YAHOO.util.DD. Another option that works only if + * you do not have constraints on the obj is to have the drag frame centered + * around the cursor. Set centerFrame to true for this effect. Ex: + * ygDDMy2 + * + * @type boolean + */ +YAHOO.util.DDProxy.prototype.centerFrame = false; + +/** + * Create the drag frame if needed + */ +YAHOO.util.DDProxy.createFrame = function() { + var THIS = YAHOO.util.DDProxy; + + if (!document || !document.body) { + setTimeout(THIS.createFrame, 50); + return; + } + + if (!THIS.frameDiv) { + THIS.frameDiv = document.createElement("div"); + THIS.frameDiv.id = THIS.dragElId; + var s = THIS.frameDiv.style; + s.position = "absolute"; + s.visibility = "hidden"; + s.cursor = "move"; + s.border = "2px solid #aaa"; + s.zIndex = 999; + + document.body.appendChild(THIS.frameDiv); + } +}; + +/** + * Initialization for the drag frame element. Must be called in the + * constructor of all subclasses + */ +YAHOO.util.DDProxy.prototype.initFrame = function() { + YAHOO.util.DDProxy.createFrame(); + this.setDragElId(YAHOO.util.DDProxy.dragElId); + this.useAbsMath = true; +}; + +/** + * Resizes the drag frame to the dimensions of the clicked object, positions + * it over the object, and finally displays it + * + * @param {int} iPageX X click position + * @param {int} iPageY Y click position + * @private + */ +YAHOO.util.DDProxy.prototype.showFrame = function(iPageX, iPageY) { + var el = this.getEl(); + + var s = this.getDragEl().style; + + if (this.resizeFrame) { + s.width = (parseInt(el.offsetWidth) - (2*this.borderWidth)) + "px"; + s.height = (parseInt(el.offsetHeight) - (2*this.borderWidth)) + "px"; + } + + if (this.centerFrame) { + this.setDelta(Math.round(parseInt(s.width)/2), + Math.round(parseInt(s.width)/2)); + } + + this.setDragElPos(iPageX, iPageY); + + s.visibility = ""; +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DDProxy.prototype.b4MouseDown = function(e) { + var x = YAHOO.util.Event.getPageX(e); + var y = YAHOO.util.Event.getPageY(e); + this.autoOffset(x, y); + this.setDragElPos(x, y); +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DDProxy.prototype.b4StartDrag = function(x, y) { + // show the drag frame + this.logger.debug("start drag show frame, x: " + x + ", y: " + y); + this.showFrame(x, y); +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DDProxy.prototype.b4EndDrag = function(e) { + this.logger.debug(this.id + " b4EndDrag"); + + // hide the drag frame + var s = this.getDragEl().style; + s.visibility = "hidden"; +}; + +// overrides YAHOO.util.DragDrop +// By default we try to move the element to the last location of the frame. +// This is so that the default behavior mirrors that of YAHOO.util.DD. +YAHOO.util.DDProxy.prototype.endDrag = function(e) { + this.logger.debug(this.id + " endDrag"); + var lel = this.getEl(); + var del = this.getDragEl(); + + // Show the drag frame briefly so we can get its position + del.style.visibility = ""; + + // Hide the linked element before the move to get around a Safari + // rendering bug. + lel.style.visibility = "hidden"; + YAHOO.util.DDM.moveToEl(lel, del); + del.style.visibility = "hidden"; + lel.style.visibility = ""; +}; + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +/** + * @class a DragDrop implementation that does not move, but can be a drop + * target. You would get the same result by simply omitting implementation + * for the event callbacks, but this way we reduce the processing cost of the + * event listener and the callbacks. + * + * @extends YAHOO.util.DragDrop + * @constructor + * @param {String} id the id of the element that is a drop target + * @param {String} sGroup the group of related DragDrop objects + */ + +YAHOO.util.DDTarget = function(id, sGroup) { + if (id) { + this.initTarget(id, sGroup); + this.logger.setModuleName("DDTarget"); + } +}; + +YAHOO.util.DDTarget.prototype = new YAHOO.util.DragDrop(); + Index: openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/build/dragdrop.js =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/build/Attic/dragdrop.js,v diff -u --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ openacs-4/packages/ajaxhelper/www/yahoo/dragdrop/build/dragdrop.js 5 Apr 2006 06:38:43 -0000 1.1 @@ -0,0 +1,2426 @@ +/* +Copyright (c) 2006 Yahoo! Inc. All rights reserved. +version 0.9.0 +*/ + +/** + * @class Defines the interface and base operation of items that that can be + * dragged or can be drop targets. It was designed to be extended, overriding + * the event handlers for startDrag, onDrag, onDragOver, onDragOut. + * Up to three html elements can be associated with a DragDrop instance: + *
      + *
    • linked element: the element that is passed into the constructor. + * This is the element which defines the boundaries for interaction with + * other DragDrop objects.
      • + *
    • handle element(s): The drag operation only occurs if the element that + * was clicked matches a handle element. By default this is the linked + * element, but there are times that you will want only a portion of the + * linked element to initiate the drag operation, and the setHandleElId() + * method provides a way to define this.
      • + *
    • drag element: this represents an the element that would be moved along + * with the cursor during a drag operation. By default, this is the linked + * element itself as in {@link YAHOO.util.DD}. setDragElId() lets you define + * a separate element that would be moved, as in {@link YAHOO.util.DDProxy} + *
      • + *
    + * This class should not be instantiated until the onload event to ensure that + * the associated elements are available. + * The following would define a DragDrop obj that would interact with any + * other * DragDrop obj in the "group1" group: + * 
    + *  dd = new YAHOO.util.DragDrop("div1", "group1");
+ *
    + * Since none of the event handlers have been implemented, nothing would + * actually happen if you were to run the code above. Normally you would + * override this class or one of the default implementations, but you can + * also override the methods you want on an instance of the class... + * 
    + *  dd.onDragDrop = function(e, id) {
+ *   alert("dd was dropped on " + id);
+ *  }
+ *
    + * @constructor + * @param {String} id of the element that is linked to this instance + * @param {String} sGroup the group of related DragDrop objects + */ +YAHOO.util.DragDrop = function(id, sGroup) { + if (id) { + this.init(id, sGroup); + } +}; + +YAHOO.util.DragDrop.prototype = { + + /** + * The id of the element associated with this object. This is what we + * refer to as the "linked element" because the size and position of + * this element is used to determine when the drag and drop objects have + * interacted. + * + * @type String + */ + id: null, + + /** + * The id of the element that will be dragged. By default this is same + * as the linked element , but could be changed to another element. Ex: + * YAHOO.util.DDProxy + * + * @type String + * @private + */ + dragElId: null, + + /** + * the id of the element that initiates the drag operation. By default + * this is the linked element, but could be changed to be a child of this + * element. This lets us do things like only starting the drag when the + * header element within the linked html element is clicked. + * + * @type String + * @private + */ + handleElId: null, + + /** + * An array of HTML tags that will be ignored if clicked. + */ + invalidHandleTypes: null, + + /** + * The linked element's absolute X position at the time the drag was + * started + * + * @type int + * @private + */ + startPageX: 0, + + /** + * The linked element's absolute X position at the time the drag was + * started + * + * @type int + * @private + */ + startPageY: 0, + + /** + * The group defines a logical collection of DragDrop objects that are + * related. Instances only get events when interacting with other + * DragDrop object in the same group. This lets us define multiple + * groups using a single DragDrop subclass if we want. + * + */ + groups: null, + + /** + * Individual drag/drop instances can be locked. This will prevent + * onmousedown start drag. + * + * @type boolean + * @private + */ + locked: false, + + /** + * Lock this instance + */ + lock: function() { this.locked = true; }, + + /** + * Unlock this instace + */ + unlock: function() { this.locked = false; }, + + /** + * By default, all insances can be a drop target. This can be disabled by + * setting isTarget to false. + * + * @type boolean + */ + isTarget: true, + + /** + * The padding configured for this drag and drop object for calculating + * the drop zone intersection with this object. + */ + padding: null, + + /** + * @private + */ + _domRef: null, + + /** + * Internal typeof flag + * @private + */ + __ygDragDrop: true, + + /** + * Set to true when horizontal contraints are applied + * + * @type boolean + * @private + */ + constrainX: false, + + /** + * Set to true when vertical contraints are applied + * + * @type boolean + * @private + */ + constrainY: false, + + /** + * The left constraint + * + * @type int + * @private + */ + minX: 0, + + /** + * The right constraint + * + * @type int + * @private + */ + maxX: 0, + + /** + * The up constraint + * + * @type int + * @private + */ + minY: 0, + + /** + * The down constraint + * + * @type int + * @private + */ + maxY: 0, + + /** + * Maintain offsets when we resetconstraints. Used to maintain the + * slider thumb value, and this needs to be fixed. + * @type boolean + */ + maintainOffset: false, + + /** + * Array of pixel locations the element will snap to if we specified a + * horizontal graduation/interval. This array is generated automatically + * when you define a tick interval. + * @type int[] + */ + xTicks: null, + + /** + * Array of pixel locations the element will snap to if we specified a + * vertical graduation/interval. This array is generated automatically + * when you define a tick interval. + * @type int[] + */ + yTicks: null, + + /** + * By default the drag and drop instance will only respond to the primary + * button click (left button for a right-handed mouse). Set to true to + * allow drag and drop to start with any mouse click that is propogated + * by the browser + * @type boolean + */ + primaryButtonOnly: true, + + /** + * Code that executes immediately before the startDrag event + * @private + */ + b4StartDrag: function(x, y) { }, + + /** + * Abstract method called after a drag/drop object is clicked + * and the drag or mousedown time thresholds have beeen met. + * + * @param {int} X click location + * @param {int} Y click location + */ + startDrag: function(x, y) { /* override this */ }, + + /** + * Code that executes immediately before the onDrag event + * @private + */ + b4Drag: function(e) { }, + + /** + * Abstract method called during the onMouseMove event while dragging an + * object. + * + * @param {Event} e + */ + onDrag: function(e) { /* override this */ }, + + /** + * Code that executes immediately before the onDragEnter event + * @private + */ + // b4DragEnter: function(e) { }, + + /** + * Abstract method called when this element fist begins hovering over + * another DragDrop obj + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this is hovering over. In INTERSECT mode, an array of one or more + * dragdrop items being hovered over. + */ + onDragEnter: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the onDragOver event + * @private + */ + b4DragOver: function(e) { }, + + /** + * Abstract method called when this element is hovering over another + * DragDrop obj + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this is hovering over. In INTERSECT mode, an array of dd items + * being hovered over. + */ + onDragOver: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the onDragOut event + * @private + */ + b4DragOut: function(e) { }, + + /** + * Abstract method called when we are no longer hovering over an element + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this was hovering over. In INTERSECT mode, an array of dd items + * that the mouse is no longer over. + */ + onDragOut: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the onDragDrop event + * @private + */ + b4DragDrop: function(e) { }, + + /** + * Abstract method called when this item is dropped on another DragDrop + * obj + * + * @param {Event} e + * @param {String || YAHOO.util.DragDrop[]} id In POINT mode, the element + * id this was dropped on. In INTERSECT mode, an array of dd items this + * was dropped on. + */ + onDragDrop: function(e, id) { /* override this */ }, + + /** + * Code that executes immediately before the endDrag event + * @private + */ + b4EndDrag: function(e) { }, + + /** + * Fired when we are done dragging the object + * + * @param {Event} e + */ + endDrag: function(e) { /* override this */ }, + + /** + * Code executed immediately before the onMouseDown event + + * @param {Event} e + * @private + */ + b4MouseDown: function(e) { }, + + /** + * Event handler that fires when a drag/drop obj gets a mousedown + * @param {Event} e + */ + onMouseDown: function(e) { /* override this */ }, + + /** + * Event handler that fires when a drag/drop obj gets a mouseup + * @param {Event} e + */ + onMouseUp: function(e) { /* override this */ }, + + /** + * Returns a reference to the linked element + * + * @return {Object} the html element + */ + getEl: function() { + if (!this._domRef) { + this._domRef = this.DDM.getElement(this.id); + } + + return this._domRef; + }, + + /** + * Returns a reference to the actual element to drag. By default this is + * the same as the html element, but it can be assigned to another + * element. An example of this can be found in YAHOO.util.DDProxy + * + * @return {Object} the html element + */ + getDragEl: function() { + return this.DDM.getElement(this.dragElId); + }, + + /** + * Sets up the DragDrop object. Must be called in the constructor of any + * YAHOO.util.DragDrop subclass + * + * @param id the id of the linked element + * @param {String} sGroup the group of related items + * element is supposed to be a target only, set to false. + */ + init: function(id, sGroup) { + this.initTarget(id, sGroup); + YAHOO.util.Event.addListener(id, "mousedown", + this.handleMouseDown, this, true); + }, + + /** + * Initializes Targeting functionality only... the object does not + * get a mousedown handler. + * + * @param id the id of the linked element + * @param {String} sGroup the group of related items + * element is supposed to be a target only, set to false. + */ + initTarget: function(id, sGroup) { + + // create a local reference to the drag and drop manager + this.DDM = YAHOO.util.DDM; + + + // set the default padding + this.padding = [0, 0, 0, 0]; + + // initialize the groups array + this.groups = {}; + + // set the id + this.id = id; + + // the element is a drag handle by default + this.setDragElId(id); + + // by default, clicked anchors will not start drag operations + this.invalidHandleTypes = {a : "a"}; + + // We don't want to register this as the handle with the manager + // so we just set the id rather than calling the setter + this.handleElId = id; + + // cache the position of the element if we can + if (document && document.body) { + this.setInitPosition(); + } + + // add to an interaction group + this.addToGroup((sGroup) ? sGroup : "default"); + + }, + + /** + * Configures the padding for the target zone in px. Effectively expands + * (or reduces) the virtual object size for targeting calculations. + * Supports css-style shorthand; if only one parameter is passed, all sides + * will have that padding, and if only two are passed, the top and bottom + * will have the first param, the left and right the second. + * @param {int} iTop Top pad + * @param {int} iRight Right pad + * @param {int} iBot Bot pad + * @param {int} iLeft Left pad + */ + setPadding: function(iTop, iRight, iBot, iLeft) { + // this.padding = [iLeft, iRight, iTop, iBot]; + if (!iRight && 0 !== iRight) { + this.padding = [iTop, iTop, iTop, iTop]; + } else if (!iBot && 0 !== iBot) { + this.padding = [iTop, iRight, iTop, iRight]; + } else { + this.padding = [iTop, iRight, iBot, iLeft]; + } + }, + + /** + * Stores the initial placement of the dd element + */ + setInitPosition: function(diffX, diffY) { + var el = this.getEl(); + + if (!this.DDM.verifyEl(el)) { + return; + } + + var dx = diffX || 0; + var dy = diffY || 0; + + var p = YAHOO.util.Dom.getXY( el ); + + this.initPageX = p[0] - dx; + this.initPageY = p[1] - dy; + + this.lastPageX = p[0]; + this.lastPageY = p[1]; + + this.setStartPosition(p); + }, + + /** + * Sets the start position of the element. This is set when the obj + * is initialized, the reset when a drag is started. + * @param pos current position (from previous lookup) + * @private + */ + setStartPosition: function(pos) { + + var p = pos || YAHOO.util.Dom.getXY( this.getEl() ); + + this.startPageX = p[0]; + this.startPageY = p[1]; + }, + + /** + * Add this instance to a group of related drag/drop objects. All + * instances belong to at least one group, and can belong to as many + * groups as needed. + * + * @param sGroup {string} the name of the group + */ + addToGroup: function(sGroup) { + this.groups[sGroup] = true; + this.DDM.regDragDrop(this, sGroup); + }, + + /** + * Allows you to specify that an element other than the linked element + * will be moved with the cursor during a drag + * + * @param id the id of the element that will be used to initiate the drag + */ + setDragElId: function(id) { + this.dragElId = id; + }, + + /** + * Allows you to specify a child of the linked element that should be + * used to initiate the drag operation. An example of this would be if + * you have a content div with text and links. Clicking anywhere in the + * content area would normally start the drag operation. Use this method + * to specify that an element inside of the content div is the element + * that starts the drag operation. + * + * @param id the id of the element that will be used to initiate the drag + */ + setHandleElId: function(id) { + this.handleElId = id; + this.DDM.regHandle(this.id, id); + }, + + /** + * Allows you to set an element outside of the linked element as a drag + * handle + */ + setOuterHandleElId: function(id) { + YAHOO.util.Event.addListener(id, "mousedown", + this.handleMouseDown, this, true); + this.setHandleElId(id); + }, + + /** + * Remove all drag and drop hooks for this element + */ + unreg: function() { + YAHOO.util.Event.removeListener(this.id, "mousedown", + this.handleMouseDown); + this._domRef = null; + this.DDM._remove(this); + }, + + /** + * Returns true if this instance is locked, or the drag drop mgr is locked + * (meaning that all drag/drop is disabled on the page.) + * + * @return {boolean} true if this obj or all drag/drop is locked, else + * false + */ + isLocked: function() { + return (this.DDM.isLocked() || this.locked); + }, + + /** + * Fired when this object is clicked + * + * @param {Event} e + * @param {YAHOO.util.DragDrop} oDD the clicked dd object (this dd obj) + * @private + */ + handleMouseDown: function(e, oDD) { + + + var EU = YAHOO.util.Event; + + + var button = e.which || e.button; + + if (this.primaryButtonOnly && button > 1) { + return; + } + + if (this.isLocked()) { + return; + } + + + this.DDM.refreshCache(this.groups); + + // Only process the event if we really clicked within the linked + // element. The reason we make this check is that in the case that + // another element was moved between the clicked element and the + // cursor in the time between the mousedown and mouseup events. When + // this happens, the element gets the next mousedown event + // regardless of where on the screen it happened. + var pt = new YAHOO.util.Point(EU.getPageX(e), EU.getPageY(e)); + if ( this.DDM.isOverTarget(pt, this) ) { + + + // check to see if the handle was clicked + var srcEl = EU.getTarget(e); + + if (this.isValidHandleChild(srcEl) && + (this.id == this.handleElId || + this.DDM.handleWasClicked(srcEl, this.id)) ) { + + // set the initial element position + this.setStartPosition(); + + + this.b4MouseDown(e); + this.onMouseDown(e); + this.DDM.handleMouseDown(e, this); + + this.DDM.stopEvent(e); + } + } + }, + + /** + * Allows you to specify a tag name that should not start a drag operation + * when clicked. This is designed to facilitate embedding links within a + * drag handle that do something other than start the drag. + * + * @param {string} tagName the type of element to exclude + */ + addInvalidHandleType: function(tagName) { + var type = tagName.toUpperCase(); + this.invalidHandleTypes[type] = type; + }, + + /** + * Unsets an excluded tag name set by addInvalidHandleType + * + * @param {string} tagName the type of element to unexclude + */ + removeInvalidHandleType: function(tagName) { + var type = tagName.toUpperCase(); + this.invalidHandleTypes[type] = null; + }, + + /** + * Checks the tag exclusion list to see if this click should be ignored + * + * @param {ygNode} node + * @return {boolean} true if this is a valid tag type, false if not + */ + isValidHandleChild: function(node) { + var type = node.nodeName; + + if (type == "#text") { + type = node.parentNode.nodeName; + } + + return (!this.invalidHandleTypes[type]); + }, + + /** + * Create the array of horizontal tick marks if an interval was specified + * in setXConstraint(). + * + * @private + */ + setXTicks: function(iStartX, iTickSize) { + this.xTicks = []; + this.xTickSize = iTickSize; + + var tickMap = {}; + + for (var i = this.initPageX; i >= this.minX; i = i - iTickSize) { + if (!tickMap[i]) { + this.xTicks[this.xTicks.length] = i; + tickMap[i] = true; + } + } + + for (i = this.initPageX; i <= this.maxX; i = i + iTickSize) { + if (!tickMap[i]) { + this.xTicks[this.xTicks.length] = i; + tickMap[i] = true; + } + } + + this.xTicks.sort(this.DDM.numericSort) ; + }, + + /** + * Create the array of vertical tick marks if an interval was specified in + * setYConstraint(). + * + * @private + */ + setYTicks: function(iStartY, iTickSize) { + this.yTicks = []; + this.yTickSize = iTickSize; + + var tickMap = {}; + + for (var i = this.initPageY; i >= this.minY; i = i - iTickSize) { + if (!tickMap[i]) { + this.yTicks[this.yTicks.length] = i; + tickMap[i] = true; + } + } + + for (i = this.initPageY; i <= this.maxY; i = i + iTickSize) { + if (!tickMap[i]) { + this.yTicks[this.yTicks.length] = i; + tickMap[i] = true; + } + } + + this.yTicks.sort(this.DDM.numericSort) ; + }, + + /** + * By default, the element can be dragged any place on the screen. Use + * this method to limit the horizontal travel of the element. Pass in + * 0,0 for the parameters if you want to lock the drag to the y axis. + * + * @param {int} iLeft the number of pixels the element can move to the left + * @param {int} iRight the number of pixels the element can move to the + * right + * @param {int} iTickSize optional parameter for specifying that the + * element + * should move iTickSize pixels at a time. + */ + setXConstraint: function(iLeft, iRight, iTickSize) { + this.leftConstraint = iLeft; + this.rightConstraint = iRight; + + this.minX = this.initPageX - iLeft; + this.maxX = this.initPageX + iRight; + if (iTickSize) { this.setXTicks(this.initPageX, iTickSize); } + + this.constrainX = true; + }, + + /** + * By default, the element can be dragged any place on the screen. Set + * this to limit the vertical travel of the element. Pass in 0,0 for the + * parameters if you want to lock the drag to the x axis. + * + * @param {int} iUp the number of pixels the element can move up + * @param {int} iDown the number of pixels the element can move down + * @param {int} iTickSize optional parameter for specifying that the + * element should move iTickSize pixels at a time. + */ + setYConstraint: function(iUp, iDown, iTickSize) { + this.topConstraint = iUp; + this.bottomConstraint = iDown; + + this.minY = this.initPageY - iUp; + this.maxY = this.initPageY + iDown; + if (iTickSize) { this.setYTicks(this.initPageY, iTickSize); } + + this.constrainY = true; + + }, + + /** + * resetConstraints must be called if you manually reposition a dd element. + * @param {boolean} maintainOffset + */ + resetConstraints: function() { + + + // figure out how much this thing has moved + var dx = (this.maintainOffset) ? this.lastPageX - this.initPageX : 0; + var dy = (this.maintainOffset) ? this.lastPageY - this.initPageY : 0; + + + // reset the initial location + this.setInitPosition(dx, dy); + + if (this.constrainX) { + this.setXConstraint( this.leftConstraint, + this.rightConstraint, + this.xTickSize ); + } + + if (this.constrainY) { + this.setYConstraint( this.topConstraint, + this.bottomConstraint, + this.yTickSize ); + } + }, + + /** + * Normally the drag element is moved pixel by pixel, but we can specify + * that it move a number of pixels at a time. This method resolves the + * location when we have it set up like this. + * + * @param {int} val where we want to place the object + * @param {int[]} tickArray sorted array of valid points + * @return {int} the closest tick + * @private + */ + getTick: function(val, tickArray) { + + if (!tickArray) { + // If tick interval is not defined, it is effectively 1 pixel, + // so we return the value passed to us. + return val; + } else if (tickArray[0] >= val) { + // The value is lower than the first tick, so we return the first + // tick. + return tickArray[0]; + } else { + for (var i = 0; i < tickArray.length; ++i) { + var next = i + 1; + if (tickArray[next] && tickArray[next] >= val) { + var diff1 = val - tickArray[i]; + var diff2 = tickArray[next] - val; + return (diff2 > diff1) ? tickArray[i] : tickArray[next]; + } + } + + // The value is larger than the last tick, so we return the last + // tick. + return tickArray[tickArray.length - 1]; + } + }, + + /** + * toString method + * @return {string} string representation of the dd obj + */ + toString: function(val, tickArray) { + return ("YAHOO.util.DragDrop {" + this.id + "}"); + } + +}; + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +// Only load the library once. Rewriting the manager class would orphan +// existing drag and drop instances. +if (!YAHOO.util.DragDropMgr) { + + /** + * @class Handles the element interaction for all DragDrop items in the + * window. Generally, you will not call this class directly, but it does + * have helper methods that could be useful in your DragDrop + * implementations. This class should not be instantiated; all methods + * are are static. + * + * @constructor + */ + YAHOO.util.DragDropMgr = new function() { + + /** + * utility package shorthand + * @private + */ + var UTIL = YAHOO.util; + + /** + * Two dimensional Array of registered DragDrop objects. The first + * dimension is the DragDrop item group, the second the DragDrop + * object. + * + * @private + */ + this.ids = {}; + + /** + * Array of element ids defined as drag handles. Used to determine + * if the element that generated the mousedown event is actually the + * handle and not the html element itself. + * + * @private + */ + this.handleIds = {}; + + /** + * the DragDrop object that is currently being dragged + * + * @type DragDrop + * @private + **/ + this.dragCurrent = null; + + /** + * the DragDrop object(s) that are being hovered over + * + * @type Array + * @private + */ + this.dragOvers = {}; + + /** + * @private + */ + + /** + * the X distance between the cursor and the object being dragged + * + * @type int + * @private + */ + this.deltaX = 0; + + /** + * the Y distance between the cursor and the object being dragged + * + * @type int + * @private + */ + this.deltaY = 0; + + /** + * Flag to determine if we should prevent the default behavior of the + * events we define. By default this is true, but this can be set to + * false if you need the default behavior (not recommended) + * + * @type boolean + */ + this.preventDefault = true; + + /** + * Flag to determine if we should stop the propagation of the events + * we generate. This is true by default but you may want to set it to + * false if the html element contains other features that require the + * mouse click. + * + * @type boolean + */ + this.stopPropagation = true; + + /** + * @private + */ + this.initalized = false; + + /** + * All drag and drop can be disabled. + * + * @private + */ + this.locked = false; + + /** + * Called the first time an element is registered. + * + * @private + */ + this.init = function() { + }; + + /** + * In point mode, drag and drop interaction is defined by the + * location of the cursor during the drag/drop + * @type int + */ + this.POINT = 0; + + /** + * In intersect mode, drag and drop interactio nis defined by the + * overlap of two or more drag and drop objects. + * @type int + */ + this.INTERSECT = 1; + + /** + * The current drag and drop mode. Default it point mode + * @type int + */ + this.mode = this.POINT; + + /** + * Runs method on all drag and drop objects + * @private + */ + this._execOnAll = function(sMethod, args) { + for (var i in this.ids) { + for (var j in this.ids[i]) { + var oDD = this.ids[i][j]; + if (! this.isTypeOfDD(oDD)) { + continue; + } + oDD[sMethod].apply(oDD, args); + } + } + }; + + /** + * Drag and drop initialization. Sets up the global event handlers + * @private + */ + this._onLoad = function() { + + this._execOnAll("setInitPosition", []); + + + var EU = UTIL.Event; + + EU.addListener(document, "mouseup", this.handleMouseUp, this, true); + EU.addListener(document, "mousemove", this.handleMouseMove, this, true); + EU.addListener(window, "unload", this._onUnload, this, true); + EU.addListener(window, "resize", this._onResize, this, true); + // EU.addListener(window, "mouseout", this._test); + + this.initalized = true; + + }; + + /** + * Reset constraints on all drag and drop objs + * @private + */ + this._onResize = function(e) { + this._execOnAll("resetConstraints", []); + }; + + /** + * Lock all drag and drop functionality + */ + this.lock = function() { this.locked = true; }; + + /** + * Unlock all drag and drop functionality + */ + this.unlock = function() { this.locked = false; }; + + /** + * Is drag and drop locked? + * + * @return {boolean} True if drag and drop is locked, false otherwise. + */ + this.isLocked = function() { return this.locked; }; + + /** + * Location cache that is set for all drag drop objects when a drag is + * initiated, cleared when the drag is finished. + * + * @private + */ + this.locationCache = {}; + + /** + * Set useCache to false if you want to force object the lookup of each + * drag and drop linked element constantly during a drag. + * @type boolean + */ + this.useCache = true; + + /** + * The number of pixels that the mouse needs to move after the + * mousedown before the drag is initiated. Default=3; + * @type int + */ + this.clickPixelThresh = 3; + + /** + * The number of milliseconds after the mousedown event to initiate the + * drag if we don't get a mouseup event. Default=1000 + * @type int + */ + this.clickTimeThresh = 1000; + + /** + * Flag that indicates that either the drag pixel threshold or the + * mousdown time threshold has been met + * @type boolean + * @private + */ + this.dragThreshMet = false; + + /** + * Timeout used for the click time threshold + * @type Object + * @private + */ + this.clickTimeout = null; + + /** + * The X position of the mousedown event stored for later use when a + * drag threshold is met. + * @type int + * @private + */ + this.startX = 0; + + /** + * The Y position of the mousedown event stored for later use when a + * drag threshold is met. + * @type int + * @private + */ + this.startY = 0; + + /** + * Each DragDrop instance must be registered with the DragDropMgr. + * This is executed in ygDragDrop.init() + * + * @param {DragDrop} oDD the DragDrop object to register + * @param {String} sGroup the name of the group this element belongs to + */ + this.regDragDrop = function(oDD, sGroup) { + if (!this.initialized) { this.init(); } + + if (!this.ids[sGroup]) { + this.ids[sGroup] = {}; + } + this.ids[sGroup][oDD.id] = oDD; + }; + + /** + * Unregisters a drag and drop item. This is executed in + * ygDragDrop.unreg, use that method instead of calling this directly. + * @private + */ + this._remove = function(oDD) { + for (var g in oDD.groups) { + if (g && this.ids[g][oDD.id]) { + delete this.ids[g][oDD.id]; + } + } + delete this.handleIds[oDD.id]; + }; + + /** + * Each DragDrop handle element must be registered. This is done + * automatically when executing ygDragDrop.setHandleElId() + * + * @param {String} sDDId the DragDrop id this element is a handle for + * @param {String} sHandleId the id of the element that is the drag + * handle + */ + this.regHandle = function(sDDId, sHandleId) { + if (!this.handleIds[sDDId]) { + this.handleIds[sDDId] = {}; + } + this.handleIds[sDDId][sHandleId] = sHandleId; + }; + + /** + * Utility function to determine if a given element has been + * registered as a drag drop item. + * + * @param {String} id the element id to check + * @return {boolean} true if this element is a DragDrop item, + * false otherwise + */ + this.isDragDrop = function(id) { + return ( this.getDDById(id) ) ? true : false; + }; + + /** + * Returns the drag and drop instances that are in all groups the + * passed in instance belongs to. + * + * @param {ygDragDrop} p_oDD the obj to get related data for + * @param {boolean} bTargetsOnly if true, only return targetable objs + * @return {ygDragDrop[]} the related instances + */ + this.getRelated = function(p_oDD, bTargetsOnly) { + var oDDs = []; + for (var i in p_oDD.groups) { + for (j in this.ids[i]) { + var dd = this.ids[i][j]; + if (! this.isTypeOfDD(dd)) { + continue; + } + if (!bTargetsOnly || dd.isTarget) { + oDDs[oDDs.length] = dd; + } + } + } + + return oDDs; + }; + + /** + * Returns true if the specified dd target is a legal target for + * the specifice drag obj + * + * @param {ygDragDrop} the drag obj + * @param {ygDragDrop) the target + * @return {boolean} true if the target is a legal target for the + * dd obj + */ + this.isLegalTarget = function (oDD, oTargetDD) { + var targets = this.getRelated(oDD); + for (var i =0;i this.clickPixelThresh || + diffY > this.clickPixelThresh) { + this.startDrag(this.startX, this.startY); + } + } + + if (this.dragThreshMet) { + this.dragCurrent.b4Drag(e); + this.dragCurrent.onDrag(e); + this.fireEvents(e, false); + } + + this.stopEvent(e); + }; + + /** + * Iterates over all of the DragDrop elements to find ones we are + * hovering over or dropping on + * + * @param {Event} e the event + * @param {boolean} isDrop is this a drop op or a mouseover op? + * @private + */ + this.fireEvents = function(e, isDrop) { + var dc = this.dragCurrent; + + // If the user did the mouse up outside of the window, we could + // get here even though we have ended the drag. + if (!dc || dc.isLocked()) { + return; + } + + var x = UTIL.Event.getPageX(e); + var y = UTIL.Event.getPageY(e); + var pt = new YAHOO.util.Point(x,y); + + // cache the previous dragOver array + var oldOvers = []; + + var outEvts = []; + var overEvts = []; + var dropEvts = []; + var enterEvts = []; + + // Check to see if the object we were hovering over is no longer + // being hovered over so we can fire the onDragOut event + for (var i in this.dragOvers) { + + var ddo = this.dragOvers[i]; + + if (! this.isTypeOfDD(ddo)) { + continue; + } + + if (! this.isOverTarget(pt, ddo, this.mode)) { + outEvts.push( ddo ); + } + + oldOvers[i] = true; + delete this.dragOvers[i]; + } + + for (var sGroup in dc.groups) { + + if ("string" != typeof sGroup) { + continue; + } + + for (i in this.ids[sGroup]) { + var oDD = this.ids[sGroup][i]; + if (! this.isTypeOfDD(oDD)) { + continue; + } + + if (oDD.isTarget && !oDD.isLocked() && oDD != dc) { + if (this.isOverTarget(pt, oDD, this.mode)) { + // look for drop interactions + if (isDrop) { + dropEvts.push( oDD ); + // look for drag enter and drag over interactions + } else { + + // initial drag over: dragEnter fires + if (!oldOvers[oDD.id]) { + enterEvts.push( oDD ); + // subsequent drag overs: dragOver fires + } else { + overEvts.push( oDD ); + } + + this.dragOvers[oDD.id] = oDD; + } + } + } + } + } + + if (this.mode) { + if (outEvts.length > 0) { + dc.b4DragOut(e, outEvts); + dc.onDragOut(e, outEvts); + } + + if (enterEvts.length > 0) { + dc.onDragEnter(e, enterEvts); + } + + if (overEvts.length > 0) { + dc.b4DragOver(e, overEvts); + dc.onDragOver(e, overEvts); + } + + if (dropEvts.length > 0) { + dc.b4DragDrop(e, dropEvts); + dc.onDragDrop(e, dropEvts); + } + + } else { + // fire dragout events + for (i=0; i < outEvts.length; ++i) { + dc.b4DragOut(e, outEvts[i].id); + dc.onDragOut(e, outEvts[i].id); + } + + // fire enter events + for (i=0; i < enterEvts.length; ++i) { + // dc.b4DragEnter(e, oDD.id); + dc.onDragEnter(e, enterEvts[i].id); + } + + // fire over events + for (i=0; i < overEvts.length; ++i) { + dc.b4DragOver(e, overEvts[i].id); + dc.onDragOver(e, overEvts[i].id); + } + + // fire drop events + for (i=0; i < dropEvts.length; ++i) { + dc.b4DragDrop(e, dropEvts[i].id); + dc.onDragDrop(e, dropEvts[i].id); + } + + } + + }; + + /** + * Helper function for getting the best match from the list of drag + * and drop objects returned by the drag and drop events when we are + * in INTERSECT mode. It returns either the first object that the + * cursor is over, or the object that has the greatest overlap with + * the dragged element. + * + * @param {ygDragDrop[]} dds The array of drag and drop objects + * targeted + * @return {ygDragDrop} The best single match + */ + this.getBestMatch = function(dds) { + var winner = null; + // Return null if the input is not what we expect + //if (!dds || !dds.length || dds.length == 0) { + // winner = null; + // If there is only one item, it wins + //} else if (dds.length == 1) { + + if (dds.length == 1) { + winner = dds[0]; + } else { + // Loop through the targeted items + for (var i=0; i= loc[3] && x <= loc[1] && y >= loc[0] && y <= loc[2]); + //oDDTarget.cursorIsOver = loc.contains( new YAHOO.util.Point(x, y) ); + oDDTarget.cursorIsOver = loc.contains( pt ); + oDDTarget.overlap = null; + + // if (this.INTERSECT == this.mode) { + if (intersect) { + + var curRegion = + YAHOO.util.Region.getRegion(this.dragCurrent.getDragEl()); + var overlap = curRegion.intersect(loc); + + if (overlap) { + oDDTarget.overlap = overlap; + return true; + } else { + return false; + } + + } else { + return oDDTarget.cursorIsOver; + } + }; + + /** + * @private + */ + this._onUnload = function(e, me) { + this.unregAll(); + }; + + /** + * Cleans up the drag and drop events and objects. + * + * @private + */ + this.unregAll = function() { + + if (this.dragCurrent) { + this.stopDrag(); + this.dragCurrent = null; + } + + this._execOnAll("unreg", []); + + for (i in this.elementCache) { + delete this.elementCache[i]; + } + + this.elementCache = {}; + this.ids = {}; + }; + + /** + * A cache of DOM elements + * + * @private + */ + this.elementCache = {}; + + /** + * Get the wrapper for the DOM element specified + * + * @param {String} id the id of the elment to get + * @return {YAHOO.util.DDM.ElementWrapper} the wrapped element + * @private + */ + this.getElWrapper = function(id) { + var oWrapper = this.elementCache[id]; + if (!oWrapper || !oWrapper.el) { + oWrapper = this.elementCache[id] = + new this.ElementWrapper(document.getElementById(id)); + } + return oWrapper; + }; + + /** + * Returns the actual DOM element + * + * @param {String} id the id of the elment to get + * @return {Object} The element + */ + this.getElement = function(id) { + // return this.getElWrapper(id).el; + return document.getElementById(id); + }; + + /** + * Returns the style property for the DOM element (i.e., + * document.getElById(id).style) + * + * @param {String} id the id of the elment to get + * @return {Object} The style property of the element + */ + this.getCss = function(id) { + // return this.getElWrapper(id).css; + var css = null; + var el = document.getElementById(id); + if (el) { + css = el.style; + } + + return css; + }; + + /** + * Inner class for cached elements + */ + this.ElementWrapper = function(el) { + /** + * @private + */ + this.el = el || null; + /** + * @private + */ + this.id = this.el && el.id; + /** + * @private + */ + this.css = this.el && el.style; + }; + + /** + * Returns the X position of an html element + * @param el the element for which to get the position + * @return {int} the X coordinate + */ + this.getPosX = function(el) { + return YAHOO.util.Dom.getX(el); + }; + + /** + * Returns the Y position of an html element + * @param el the element for which to get the position + * @return {int} the Y coordinate + */ + this.getPosY = function(el) { + return YAHOO.util.Dom.getY(el); + }; + + /** + * Swap two nodes. In IE, we use the native method, for others we + * emulate the IE behavior + * + * @param n1 the first node to swap + * @param n2 the other node to swap + */ + this.swapNode = function(n1, n2) { + if (n1.swapNode) { + n1.swapNode(n2); + } else { + // the node reference order for the swap is a little tricky. + var p = n2.parentNode; + var s = n2.nextSibling; + n1.parentNode.replaceChild(n2,n1); + p.insertBefore(n1,s); + } + }; + + /** + * @private + */ + this.getScroll = function () { + var t, l; + if (document.documentElement && document.documentElement.scrollTop) { + t = document.documentElement.scrollTop; + l = document.documentElement.scrollLeft; + } else if (document.body) { + t = document.body.scrollTop; + l = document.body.scrollLeft; + } + return { top: t, left: l }; + }; + + /** + * Returns the specified element style property + * @param {HTMLElement} el the element + * @param {string} styleProp the style property + * @return {string} The value of the style property + */ + this.getStyle = function(el, styleProp) { + if (el.style.styleProp) { + return el.style.styleProp; + } else if (el.currentStyle) { + return el.currentStyle[styleProp]; + } else if (document.defaultView) { + return document.defaultView.getComputedStyle(el, null). + getPropertyValue(styleProp); + } + }; + + /** + * Gets the scrollTop + * + * @return {int} the document's scrollTop + */ + this.getScrollTop = function () { return this.getScroll().top; }; + + /** + * Gets the scrollLeft + * + * @return {int} the document's scrollTop + */ + this.getScrollLeft = function () { return this.getScroll().left; }; + + this.moveToEl = function (moveEl, targetEl) { + var aCoord = YAHOO.util.Dom.getXY(targetEl); + YAHOO.util.Dom.setXY(moveEl, aCoord); + }; + + /** + * Gets the client height + * + * @return {int} client height in px + */ + this.getClientHeight = function() { + return (window.innerHeight) ? window.innerHeight : + (document.documentElement && document.documentElement.clientHeight) ? + document.documentElement.clientHeight : document.body.offsetHeight; + }; + + /** + * Gets the client width + * + * @return {int} client width in px + */ + this.getClientWidth = function() { + return (window.innerWidth) ? window.innerWidth : + (document.documentElement && document.documentElement.clientWidth) ? + document.documentElement.clientWidth : document.body.offsetWidth; + }; + + /** + * numeric array sort function + */ + this.numericSort = function(a, b) { return (a - b); }; + + /** + * @private + */ + this._timeoutCount = 0; + + /** + * @private + * Trying to make the load order less important. Without this we get + * an error if this file is loaded before the Event Utility. + */ + this._addListeners = function() { + if ( UTIL.Event && + document && + document.body ) { + + this._onLoad(); + } else { + if (this._timeoutCount > 500) { + } else { + setTimeout("YAHOO.util.DDM._addListeners()", 10); + this._timeoutCount += 1; + } + } + + }; + + /** + * Recursively searches the immediate parent and all child nodes for + * the handle element in order to determine wheter or not it was + * clicked. + * + * @param node the html element to inspect + */ + this.handleWasClicked = function(node, id) { + if (this.isHandle(id, node.id)) { + return true; + } else { + // check to see if this is a text node child of the one we want + var p = node.parentNode; + + while (p) { + if (this.isHandle(id, p.id)) { + return true; + } else { + p = p.parentNode; + } + } + } + + return false; + }; + + }; + + // shorter alias, save a few bytes + YAHOO.util.DDM = YAHOO.util.DragDropMgr; + YAHOO.util.DDM._addListeners(); + +} + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +/** + * @class a DragDrop implementation where the linked element follows the + * mouse cursor. + * + * @extends DragDrop + * @constructor + * @param {String} id the id of the linked element + * @param {String} sGroup the group of related DragDrop items + */ +YAHOO.util.DD = function(id, sGroup) { + if (id) { + this.init(id, sGroup); + } +}; + +YAHOO.util.DD.prototype = new YAHOO.util.DragDrop(); + +/** + * Should we auto-scroll? Defaults to true + * + * @type boolean + */ +YAHOO.util.DD.prototype.scroll = true; + +/** + * Sets the pointer offset to the distance between the linked element's top + * left corner and the location the element was clicked + * + * @param {int} iPageX the X coordinate of the click + * @param {int} iPageY the Y coordinate of the click + */ +YAHOO.util.DD.prototype.autoOffset = function(iPageX, iPageY) { + var el = this.getEl(); + var aCoord = YAHOO.util.Dom.getXY(el); + var x = iPageX - aCoord[0]; + var y = iPageY - aCoord[1]; + this.setDelta(x, y); +}; + +/** + * Sets the pointer offset. You can call this directly to force the offset to + * be in a particular location (e.g., pass in 0,0 to set it to the center of the + * object, as done in ygDDSliderBG) + * + * @param {int} iDeltaX the distance from the left + * @param {int} iDeltaY the distance from the top + */ +YAHOO.util.DD.prototype.setDelta = function(iDeltaX, iDeltaY) { + this.deltaX = iDeltaX; + this.deltaY = iDeltaY; +}; + +/** + * Sets the drag element to the location of the mousedown or click event, + * maintaining the cursor location relative to the location on the element + * that was clicked. Override this if you want to place the element in a + * location other than where the cursor is. + * + * @param {int} iPageX the X coordinate of the mousedown or drag event + * @param {int} iPageY the Y coordinate of the mousedown or drag event + */ + +YAHOO.util.DD.prototype.setDragElPos = function(iPageX, iPageY) { + this.alignElWithMouse(this.getDragEl(), iPageX, iPageY); +}; + +/** + * Sets the element to the location of the mousedown or click event, + * maintaining the cursor location relative to the location on the element + * that was clicked. Override this if you want to place the element in a + * location other than where the cursor is. + * + * @param {HTMLElement} el the element to move + * @param {int} iPageX the X coordinate of the mousedown or drag event + * @param {int} iPageY the Y coordinate of the mousedown or drag event + */ +YAHOO.util.DD.prototype.alignElWithMouse = function(el, iPageX, iPageY) { + var oCoord = this.getTargetCoord(iPageX, iPageY); + var aCoord = [oCoord.x, oCoord.y]; + YAHOO.util.Dom.setXY(el, aCoord); + + this.cachePosition(oCoord.x, oCoord.y); + + this.autoScroll(oCoord.x, oCoord.y, el.offsetHeight, el.offsetWidth); +}; + +/** + * Saves the most recent position so that we can reset the constraints and + * tick marks on-demand. We need to know this so that we can calculate the + * number of pixels the element is offset from its original position. + */ +YAHOO.util.DD.prototype.cachePosition = function(iPageX, iPageY) { + if (iPageX) { + this.lastPageX = iPageX; + this.lastPageY = iPageY; + } else { + var aCoord = YAHOO.util.Dom.getXY(this.getEl()); + this.lastPageX = aCoord[0]; + this.lastPageY = aCoord[1]; + } +}; + +/** + * Auto-scroll the window if the dragged object has been moved beyond the + * visible window boundary. + * + * @param {int} x the drag element's x position + * @param {int} y the drag element's y position + * @param {int} h the height of the drag element + * @param {int} w the width of the drag element + * @private + */ +YAHOO.util.DD.prototype.autoScroll = function(x, y, h, w) { + + if (this.scroll) { + // The client height + var clientH = this.DDM.getClientHeight(); + + // The client width + var clientW = this.DDM.getClientWidth(); + + // The amt scrolled down + var st = this.DDM.getScrollTop(); + + // The amt scrolled right + var sl = this.DDM.getScrollLeft(); + + // Location of the bottom of the element + var bot = h + y; + + // Location of the right of the element + var right = w + x; + + // The distance from the cursor to the bottom of the visible area, + // adjusted so that we don't scroll if the cursor is beyond the + // element drag constraints + var toBot = (clientH + st - y - this.deltaY); + + // The distance from the cursor to the right of the visible area + var toRight = (clientW + sl - x - this.deltaX); + + + // How close to the edge the cursor must be before we scroll + // var thresh = (document.all) ? 100 : 40; + var thresh = 40; + + // How many pixels to scroll per autoscroll op. This helps to reduce + // clunky scrolling. IE is more sensitive about this ... it needs this + // value to be higher. + var scrAmt = (document.all) ? 80 : 30; + + // Scroll down if we are near the bottom of the visible page and the + // obj extends below the crease + if ( bot > clientH && toBot < thresh ) { + window.scrollTo(sl, st + scrAmt); + } + + // Scroll up if the window is scrolled down and the top of the object + // goes above the top border + if ( y < st && st > 0 && y - st < thresh ) { + window.scrollTo(sl, st - scrAmt); + } + + // Scroll right if the obj is beyond the right border and the cursor is + // near the border. + if ( right > clientW && toRight < thresh ) { + window.scrollTo(sl + scrAmt, st); + } + + // Scroll left if the window has been scrolled to the right and the obj + // extends past the left border + if ( x < sl && sl > 0 && x - sl < thresh ) { + window.scrollTo(sl - scrAmt, st); + } + } +}; + +/** + * Finds the location the element should be placed if we want to move + * it to where the mouse location less the click offset would place us. + * + * @param {int} iPageX the X coordinate of the click + * @param {int} iPageY the Y coordinate of the click + * @return an object that contains the coordinates (Object.x and Object.y) + * @private + */ +YAHOO.util.DD.prototype.getTargetCoord = function(iPageX, iPageY) { + + + var x = iPageX - this.deltaX; + var y = iPageY - this.deltaY; + + if (this.constrainX) { + if (x < this.minX) { x = this.minX; } + if (x > this.maxX) { x = this.maxX; } + } + + if (this.constrainY) { + if (y < this.minY) { y = this.minY; } + if (y > this.maxY) { y = this.maxY; } + } + + x = this.getTick(x, this.xTicks); + y = this.getTick(y, this.yTicks); + + + return {x:x, y:y}; +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DD.prototype.b4MouseDown = function(e) { + // this.resetConstraints(); + this.autoOffset(YAHOO.util.Event.getPageX(e), + YAHOO.util.Event.getPageY(e)); +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DD.prototype.b4Drag = function(e) { + this.setDragElPos(YAHOO.util.Event.getPageX(e), + YAHOO.util.Event.getPageY(e)); +}; + +/////////////////////////////////////////////////////////////////////////////// +// Debugging ygDragDrop events that can be overridden +/////////////////////////////////////////////////////////////////////////////// +/* +YAHOO.util.DD.prototype.startDrag = function(x, y) { +}; + +YAHOO.util.DD.prototype.onDrag = function(e) { +}; + +YAHOO.util.DD.prototype.onDragEnter = function(e, id) { +}; + +YAHOO.util.DD.prototype.onDragOver = function(e, id) { +}; + +YAHOO.util.DD.prototype.onDragOut = function(e, id) { +}; + +YAHOO.util.DD.prototype.onDragDrop = function(e, id) { +}; + +YAHOO.util.DD.prototype.endDrag = function(e) { +}; +*/ + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +/** + * @class a DragDrop implementation that inserts an empty, bordered div into + * the document that follows the cursor during drag operations. At the time of + * the click, the frame div is resized to the dimensions of the linked html + * element, and moved to the exact location of the linked element. + * + * @extends YAHOO.util.DD + * @constructor + * @param {String} id the id of the linked html element + * @param {String} sGroup the group of related DragDrop objects + */ +YAHOO.util.DDProxy = function(id, sGroup) { + if (id) { + this.init(id, sGroup); + this.initFrame(); + } +}; + +YAHOO.util.DDProxy.prototype = new YAHOO.util.DD(); + +/** + * A reference to the one div element we create for all instances of this class + * + * @type Object + */ +YAHOO.util.DDProxy.frameDiv = null; + +/** + * the drag frame div id + * + * @type String + */ +YAHOO.util.DDProxy.dragElId = "ygddfdiv"; + +/** + * The border width of the frame. This is used when we resize the frame to + * the size of the linked element. We substract the border width to make + * the div the correct size. + * + * @TODO find a better way to handle this + * + * @type int + */ +YAHOO.util.DDProxy.prototype.borderWidth = 2; + +/** + * By default we resize the drag frame to be the same size as the element + * we want to drag (this is to get the frame effect). We can turn it off + * if we want a different behavior (ex: ygDDMy2) + * + * @type boolean + */ +YAHOO.util.DDProxy.prototype.resizeFrame = true; + +/** + * By default the frame is positioned exactly where the drag element is, so + * we use the cursor offset provided by YAHOO.util.DD. Another option that works only if + * you do not have constraints on the obj is to have the drag frame centered + * around the cursor. Set centerFrame to true for this effect. Ex: + * ygDDMy2 + * + * @type boolean + */ +YAHOO.util.DDProxy.prototype.centerFrame = false; + +/** + * Create the drag frame if needed + */ +YAHOO.util.DDProxy.createFrame = function() { + var THIS = YAHOO.util.DDProxy; + + if (!document || !document.body) { + setTimeout(THIS.createFrame, 50); + return; + } + + if (!THIS.frameDiv) { + THIS.frameDiv = document.createElement("div"); + THIS.frameDiv.id = THIS.dragElId; + var s = THIS.frameDiv.style; + s.position = "absolute"; + s.visibility = "hidden"; + s.cursor = "move"; + s.border = "2px solid #aaa"; + s.zIndex = 999; + + document.body.appendChild(THIS.frameDiv); + } +}; + +/** + * Initialization for the drag frame element. Must be called in the + * constructor of all subclasses + */ +YAHOO.util.DDProxy.prototype.initFrame = function() { + YAHOO.util.DDProxy.createFrame(); + this.setDragElId(YAHOO.util.DDProxy.dragElId); + this.useAbsMath = true; +}; + +/** + * Resizes the drag frame to the dimensions of the clicked object, positions + * it over the object, and finally displays it + * + * @param {int} iPageX X click position + * @param {int} iPageY Y click position + * @private + */ +YAHOO.util.DDProxy.prototype.showFrame = function(iPageX, iPageY) { + var el = this.getEl(); + + var s = this.getDragEl().style; + + if (this.resizeFrame) { + s.width = (parseInt(el.offsetWidth) - (2*this.borderWidth)) + "px"; + s.height = (parseInt(el.offsetHeight) - (2*this.borderWidth)) + "px"; + } + + if (this.centerFrame) { + this.setDelta(Math.round(parseInt(s.width)/2), + Math.round(parseInt(s.width)/2)); + } + + this.setDragElPos(iPageX, iPageY); + + s.visibility = ""; +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DDProxy.prototype.b4MouseDown = function(e) { + var x = YAHOO.util.Event.getPageX(e); + var y = YAHOO.util.Event.getPageY(e); + this.autoOffset(x, y); + this.setDragElPos(x, y); +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DDProxy.prototype.b4StartDrag = function(x, y) { + // show the drag frame + this.showFrame(x, y); +}; + +// overrides YAHOO.util.DragDrop +YAHOO.util.DDProxy.prototype.b4EndDrag = function(e) { + + // hide the drag frame + var s = this.getDragEl().style; + s.visibility = "hidden"; +}; + +// overrides YAHOO.util.DragDrop +// By default we try to move the element to the last location of the frame. +// This is so that the default behavior mirrors that of YAHOO.util.DD. +YAHOO.util.DDProxy.prototype.endDrag = function(e) { + var lel = this.getEl(); + var del = this.getDragEl(); + + // Show the drag frame briefly so we can get its position + del.style.visibility = ""; + + // Hide the linked element before the move to get around a Safari + // rendering bug. + lel.style.visibility = "hidden"; + YAHOO.util.DDM.moveToEl(lel, del); + del.style.visibility = "hidden"; + lel.style.visibility = ""; +}; + +/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */ + +/** + * @class a DragDrop implementation that does not move, but can be a drop + * target. You would get the same result by simply omitting implementation + * for the event callbacks, but this way we reduce the processing cost of the + * event listener and the callbacks. + * + * @extends YAHOO.util.DragDrop + * @constructor + * @param {String} id the id of the element that is a drop target + * @param {String} sGroup the group of related DragDrop objects + */ + +YAHOO.util.DDTarget = function(id, sGroup) { + if (id) { + this.initTarget(id, sGroup); + } +}; + +YAHOO.util.DDTarget.prototype = new YAHOO.util.DragDrop(); + Index: openacs-4/packages/ajaxhelper/www/yahoo/event/license.txt =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/yahoo/event/Attic/license.txt,v diff -u --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ openacs-4/packages/ajaxhelper/www/yahoo/event/license.txt 5 Apr 2006 06:38:43 -0000 1.1 @@ -0,0 +1,35 @@ +Software License Agreement (BSD License) + +Copyright (c) 2006, Yahoo! Inc. +All rights reserved. + +Redistribution and use of this software in source and binary forms, with +or without modification, are permitted provided that the following +conditions are met: + +* Redistributions of source code must retain the above + copyright notice, this list of conditions and the + following disclaimer. + +* Redistributions in binary form must reproduce the above + copyright notice, this list of conditions and the + following disclaimer in the documentation and/or other + materials provided with the distribution. + +* Neither the name of Yahoo! Inc. nor the names of its + contributors may be used to endorse or promote products + derived from this software without specific prior + written permission of Yahoo! Inc. + +THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS +IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED +TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A +PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER +OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, +EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, +PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR +PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF +LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING +NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS +SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. + Index: openacs-4/packages/ajaxhelper/www/yahoo/event/build/YAHOO.js =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/yahoo/event/build/Attic/YAHOO.js,v diff -u --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ openacs-4/packages/ajaxhelper/www/yahoo/event/build/YAHOO.js 5 Apr 2006 06:38:43 -0000 1.1 @@ -0,0 +1,63 @@ +/* +Copyright (c) 2006 Yahoo! Inc. All rights reserved. +version 0.9.0 +*/ + +/** + * @class The Yahoo global namespace + */ +var YAHOO = function() { + + return { + + /** + * Yahoo presentation platform utils namespace + */ + util: {}, + + /** + * Yahoo presentation platform widgets namespace + */ + widget: {}, + + /** + * Yahoo presentation platform examples namespace + */ + example: {}, + + /** + * Returns the namespace specified and creates it if it doesn't exist + * + * YAHOO.namespace("property.package"); + * YAHOO.namespace("YAHOO.property.package"); + * + * Either of the above would create YAHOO.property, then + * YAHOO.property.package + * + * @param {String} sNameSpace String representation of the desired + * namespace + * @return {Object} A reference to the namespace object + */ + namespace: function( sNameSpace ) { + + if (!sNameSpace || !sNameSpace.length) { + return null; + } + + var levels = sNameSpace.split("."); + + var currentNS = YAHOO; + + // YAHOO is implied, so it is ignored if it is included + for (var i=(levels[0] == "YAHOO") ? 1 : 0; i + * - The type of event + * - All of the arguments fire() was executed with as an array + * - The custom object (if any) that was passed into the subscribe() method + * + * + * @param {Array} an arbitrary set of parameters to pass to the handler + */ + fire: function() { + for (var i=0; i= 0) { + cacheItem = listeners[index]; + } + + if (!el || !cacheItem) { + return false; + } + + + if (el.removeEventListener) { + el.removeEventListener(sType, cacheItem[this.WFN], false); + // alert("adsf"); + } else if (el.detachEvent) { + el.detachEvent("on" + sType, cacheItem[this.WFN]); + } + + // removed the wrapped handler + delete listeners[index][this.WFN]; + delete listeners[index][this.FN]; + delete listeners[index]; + + return true; + + }, + + /** + * Returns the event's target element + * @param {Event} ev the event + * @param {boolean} resolveTextNode when set to true the target's + * parent will be returned if the target is a + * text node + * @return {HTMLElement} the event's target + */ + getTarget: function(ev, resolveTextNode) { + var t = ev.target || ev.srcElement; + + if (resolveTextNode && t && "#text" == t.nodeName) { + return t.parentNode; + } else { + return t; + } + }, + + /** + * Returns the event's pageX + * @param {Event} ev the event + * @return {int} the event's pageX + */ + getPageX: function(ev) { + var x = ev.pageX; + if (!x && 0 !== x) { + x = ev.clientX || 0; + + if ( this.isIE ) { + x += this._getScrollLeft(); + } + } + + return x; + }, + + /** + * Returns the event's pageY + * @param {Event} ev the event + * @return {int} the event's pageY + */ + getPageY: function(ev) { + var y = ev.pageY; + if (!y && 0 !== y) { + y = ev.clientY || 0; + + if ( this.isIE ) { + y += this._getScrollTop(); + } + } + + return y; + }, + + /** + * Returns the event's related target + * @param {Event} ev the event + * @return {HTMLElement} the event's relatedTarget + */ + getRelatedTarget: function(ev) { + var t = ev.relatedTarget; + if (!t) { + if (ev.type == "mouseout") { + t = ev.toElement; + } else if (ev.type == "mouseover") { + t = ev.fromElement; + } + } + + return t; + }, + + /** + * Returns the time of the event. If the time is not included, the + * event is modified using the current time. + * @param {Event} ev the event + * @return {Date} the time of the event + */ + getTime: function(ev) { + if (!ev.time) { + var t = new Date().getTime(); + try { + ev.time = t; + } catch(e) { + // can't set the time property + return t; + } + } + + return ev.time; + }, + + /** + * Convenience method for stopPropagation + preventDefault + * @param {Event} ev the event + */ + stopEvent: function(ev) { + this.stopPropagation(ev); + this.preventDefault(ev); + }, + + /** + * Stops event propagation + * @param {Event} ev the event + */ + stopPropagation: function(ev) { + if (ev.stopPropagation) { + ev.stopPropagation(); + } else { + ev.cancelBubble = true; + } + }, + + /** + * Prevents the default behavior of the event + * @param {Event} ev the event + */ + preventDefault: function(ev) { + if (ev.preventDefault) { + ev.preventDefault(); + } else { + ev.returnValue = false; + } + }, + + /** + * Returns the event, should not be necessary for user to call + * @param {Event} the event parameter from the handler + * @return {Event} the event + */ + getEvent: function(e) { + var ev = e || window.event; + + if (!ev) { + var c = this.getEvent.caller; + while (c) { + ev = c.arguments[0]; + if (ev && Event == ev.constructor) { + break; + } + c = c.caller; + } + } + + return ev; + }, + + /** + * Returns the charcode for an event + * @param {Event} ev the event + * @return {int} the event's charCode + */ + getCharCode: function(ev) { + return ev.charCode || (ev.type == "keypress") ? ev.keyCode : 0; + }, + + /** + * @private + * Locating the saved event handler data by function ref + */ + _getCacheIndex: function(el, sType, fn) { + for (var i=0; i< listeners.length; ++i) { + var li = listeners[i]; + if ( li && + li[this.FN] == fn && + li[this.EL] == el && + li[this.TYPE] == sType ) { + return i; + } + } + + return -1; + }, + + /** + * We want to be able to use getElementsByTagName as a collection + * to attach a group of events to. Unfortunately, different + * browsers return different types of collections. This function + * tests to determine if the object is array-like. It will also + * fail if the object is an array, but is empty. + * @param o the object to test + * @return {boolean} true if the object is array-like and populated + */ + _isValidCollection: function(o) { + // alert(o.constructor.toString()) + // alert(typeof o) + + return ( o && // o is something + o.length && // o is indexed + typeof o != "string" && // o is not a string + !o.tagName && // o is not an HTML element + !o.alert && // o is not a window + typeof o[0] != "undefined" ); + + }, + + /** + * @private + * DOM element cache + */ + elCache: {}, + + /** + * We cache elements bound by id because when the unload event + * fires, we can no longer use document.getElementById + * @private + */ + getEl: function(id) { + /* + // this is a problem when replaced via document.getElementById + if (! this.elCache[id]) { + try { + var el = document.getElementById(id); + if (el) { + this.elCache[id] = el; + } + } catch (er) { + } + } + return this.elCache[id]; + */ + + return document.getElementById(id); + }, + + /** + * Clears the element cache + */ + clearCache: function() { + for (i in this.elCache) { + delete this.elCache[i]; + } + }, + + /** + * Called by CustomEvent instances to provide a handle to the + * event * that can be removed later on. Should be package + * protected. + * @private + */ + regCE: function(ce) { + customEvents.push(ce); + }, + + /** + * @private + * hook up any deferred listeners + */ + _load: function(e) { + loadComplete = true; + }, + + /** + * Polling function that runs before the onload event fires, + * attempting * to attach to DOM Nodes as soon as they are + * available + * @private + */ + _tryPreloadAttach: function() { + + // keep trying until after the page is loaded. We need to + // check the page load state prior to trying to bind the + // elements so that we can be certain all elements have been + // tested appropriately + var tryAgain = !loadComplete; + + for (var i=0; i < delayedListeners.length; ++i) { + var d = delayedListeners[i]; + // There may be a race condition here, so we need to + // verify the array element is usable. + if (d) { + + // el will be null if document.getElementById did not + // work + var el = this.getEl(d[this.EL]); + + if (el) { + this.on(el, d[this.TYPE], d[this.FN], + d[this.SCOPE], d[this.ADJ_SCOPE]); + delete delayedListeners[i]; + } + } + } + + if (tryAgain) { + setTimeout("YAHOO.util.Event._tryPreloadAttach()", 50); + } + }, + + /** + * Removes all listeners registered by pe.event. Called + * automatically during the unload event. + */ + _unload: function(e, me) { + for (var i=0; i < unloadListeners.length; ++i) { + var l = unloadListeners[i]; + if (l) { + var scope = (l[this.ADJ_SCOPE]) ? l[this.SCOPE]: window; + l[this.FN].call(scope, this.getEvent(e), l[this.SCOPE] ); + } + } + + if (listeners && listeners.length > 0) { + for (i = 0; i < listeners.length; ++i) { + l = listeners[i]; + if (l) { + this.removeListener(l[this.EL], l[this.TYPE], + l[this.FN]); + } + } + + this.clearCache(); + } + + for (i = 0; i < customEvents.length; ++i) { + customEvents[i].unsubscribeAll(); + delete customEvents[i]; + } + + for (i = 0; i < legacyEvents.length; ++i) { + // dereference the element + delete legacyEvents[i][0]; + // delete the array item + delete legacyEvents[i]; + } + }, + + /** + * Returns scrollLeft + * @private + */ + _getScrollLeft: function() { + return this._getScroll()[1]; + }, + + /** + * Returns scrollTop + * @private + */ + _getScrollTop: function() { + return this._getScroll()[0]; + }, + + /** + * Returns the scrollTop and scrollLeft. Used to calculate the + * pageX and pageY in Internet Explorer + * @private + */ + _getScroll: function() { + var dd = document.documentElement; db = document.body; + if (dd && dd.scrollTop) { + return [dd.scrollTop, dd.scrollLeft]; + } else if (db) { + return [db.scrollTop, db.scrollLeft]; + } else { + return [0, 0]; + } + } + }; + } (); + + YAHOO.util.Event.on = YAHOO.util.Event.addListener; + + if (document && document.body) { + YAHOO.util.Event._load(); + } else { + YAHOO.util.Event.on(window, "load", YAHOO.util.Event._load, + YAHOO.util.Event, true); + } + + YAHOO.util.Event.on(window, "unload", YAHOO.util.Event._unload, + YAHOO.util.Event, true); + + YAHOO.util.Event._tryPreloadAttach(); + +} +