WB 2.08.x

    return {

        /**

        * This property is used to turn on global use of the shim element on all DragDrop instances, defaults to false for backcompat. (Use: YAHOO.util.DDM.useShim = true)

        */

        useShim: false,

        /**

        * This property is used to determine if the shim is active over the screen, default false.

        */

        _shimActive: false,

        /**

        * This property is used when useShim is set on a DragDrop object to store the current state of DDM.useShim so it can be reset when a drag operation is done.

        */

        _shimState: false,

        /**

        * This property is used when useShim is set to true, it will set the opacity on the shim to .5 for debugging. Use: (YAHOO.util.DDM._debugShim = true;)

        */

        _debugShim: false,

        /**

        * This method will create a shim element (giving it the id of yui-ddm-shim), it also attaches the mousemove and mouseup listeners to it and attaches a scroll listener on the window

        */

        _createShim: function() {

            YAHOO.log('Creating Shim Element', 'info', 'DragDropMgr');

        },

        /**

        * This method will size the shim, called from activate and on window scroll event

        */

        _sizeShim: function() {

            if (this._shimActive) {

        },

        /**

        * This method will create the shim element if needed, then show the shim element, size the element and set the _shimActive property to true

        */

        _activateShim: function() {

            if (this.useShim) {

        },

        /**

        * This method will hide the shim element and set the _shimActive property to false

        */

        _deactivateShim: function() {

            YAHOO.log('Deactivating Shim', 'info', 'DragDropMgr');

        },

        /**

        * The HTML element created to use as a shim over the document to track mouse movements

        */

        _shim: null,

        /**

         * Two dimensional Array of registered DragDrop objects.  The first 

         * dimension is the DragDrop item group, the second the DragDrop 

         * object.

         */

        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.

         */

        handleIds: {},

        /**

         * the DragDrop object that is currently being dragged

         **/

        dragCurrent: null,

        /**

         * the DragDrop object(s) that are being hovered over

         */

        dragOvers: {},

        /**

         * the X distance between the cursor and the object being dragged

         */

        deltaX: 0,

        /**

         * the Y distance between the cursor and the object being dragged

         */

        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)

         */

        preventDefault: true,

         * 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.

         */

        stopPropagation: true,

        /**

         * Internal flag that is set to true when drag and drop has been

         * initialized

         */

        initialized: false,

        /**

         * All drag and drop can be disabled.

         */

        locked: false,

         *       sourceRegion: The location of the source elemtn at the time

         *                     of the interaction

         *       validDrop: boolean

         */

        interactionInfo: null,

        /**

         * Called the first time an element is registered.

         */

        init: function() {

            this.initialized = true;

        /**

         * In point mode, drag and drop interaction is defined by the 

         * location of the cursor during the drag/drop

         */

        POINT: 0,

         * In intersect mode, drag and drop interaction is defined by the 

         * cursor position or the amount of overlap of two or more drag and 

         * drop objects.

         */

        INTERSECT: 1,

        /**

         * In intersect mode, drag and drop interaction is defined only by the 

         * overlap of two or more drag and drop objects.

         */

        STRICT_INTERSECT: 2,

        /**

         * The current drag and drop mode.  Default: POINT

         */

        mode: 0,

        /**

         * Runs method on all drag and drop objects

         */

        _execOnAll: function(sMethod, args) {

            for (var i in this.ids) {

        /**

         * Drag and drop initialization.  Sets up the global event handlers

         */

        _onLoad: function() {

        /**

         * Reset constraints on all drag and drop objs

         */

        _onResize: function(e) {

            YAHOO.log("window resize", "info", "DragDropMgr");

        /**

         * Lock all drag and drop functionality

         */

        lock: function() { this.locked = true; },

        /**

         * Unlock all drag and drop functionality

         */

        unlock: function() { this.locked = false; },

        /**

         * Is drag and drop locked?

         */

        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.

         */

        locationCache: {},

        /**

         * Set useCache to false if you want to force object the lookup of each

         * drag and drop linked element constantly during a drag.

         */

        useCache: true,

        /**

         * The number of pixels that the mouse needs to move after the 

         * mousedown before the drag is initiated.  Default=3;

         */

        clickPixelThresh: 3,

        /**

         * The number of milliseconds after the mousedown event to initiate the

         * drag if we don't get a mouseup event. Default=1000

         */

        clickTimeThresh: 1000,

        /**

         * Flag that indicates that either the drag pixel threshold or the 

         * mousdown time threshold has been met

         */

        dragThreshMet: false,

        /**

         * Timeout used for the click time threshold

         */

        clickTimeout: null,

        /**

         * The X position of the mousedown event stored for later use when a 

         * drag threshold is met.

         */

        startX: 0,

        /**

         * The Y position of the mousedown event stored for later use when a 

         * drag threshold is met.

         */

        startY: 0,

        /**

         * Flag to determine if the drag event was fired from the click timeout and

         * not the mouse move threshold.

         */

        fromTimeout: false,

        /**

         * Each DragDrop instance must be registered with the DragDropMgr.  

         * This is executed in DragDrop.init()

         */

        regDragDrop: function(oDD, sGroup) {

            if (!this.initialized) { this.init(); }

        /**

         * Removes the supplied dd instance from the supplied group. Executed

         * by DragDrop.removeFromGroup, so don't call this function directly.

         */

        removeDDFromGroup: function(oDD, sGroup) {

            if (!this.ids[sGroup]) {

        /**

         * Unregisters a drag and drop item.  This is executed in 

         * DragDrop.unreg, use that method instead of calling this directly.

         */

        _remove: function(oDD) {

            for (var g in oDD.groups) {

        /**

         * Each DragDrop handle element must be registered.  This is done

         * automatically when executing DragDrop.setHandleElId()

         * handle

         */

        regHandle: function(sDDId, sHandleId) {

            if (!this.handleIds[sDDId]) {

        /**

         * Utility function to determine if a given element has been 

         * registered as a drag drop item.

         * false otherwise

         */

        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.

         */

        getRelated: function(p_oDD, bTargetsOnly) {

            var oDDs = [];

        /**

         * Returns true if the specified dd target is a legal target for 

         * the specifice drag obj

         * dd obj

         */

        isLegalTarget: function (oDD, oTargetDD) {

            var targets = this.getRelated(oDD, true);

         * returns "object", oDD.constructor.toString() always returns

         * "DragDrop" and not the name of the subclass.  So for now it just

         * evaluates a well-known variable in DragDrop.

         */

        isTypeOfDD: function (oDD) {

            return (oDD && oDD.__ygDragDrop);

        /**

         * Utility function to determine if a given element has been 

         * registered as a drag drop handle for the given Drag Drop object.

         * otherwise

         */

        isHandle: function(sDDId, sHandleId) {

            return ( this.handleIds[sDDId] && 

        /**

         * Returns the DragDrop instance for a given id

         */

        getDDById: function(id) {

            for (var i in this.ids) {

        /**

         * Fired after a registered DragDrop object gets the mousedown event.

         * Sets up the events required to track the object being dragged

         */

        handleMouseDown: function(e, oDD) {

            //this._activateShim();

        /**

         * Fired when either the drag pixel threshold or the mousedown hold 

         * time threshold has been met.

         */

        startDrag: function(x, y) {

            if (this.dragCurrent && this.dragCurrent.useShim) {

        /**

         * Internal function to handle the mouseup event.  Will be invoked 

         * from the context of the document.

         */

        handleMouseUp: function(e) {

            if (this.dragCurrent) {

        /**

         * Utility to stop event propagation and event default, if these 

         * features are turned on.

         */

        stopEvent: function(e) {

            if (this.stopPropagation) {

         * for the silent parameter so that the endDrag and onMouseUp events

         * are skipped (so no event data is needed.)

         *

         *                  with pageX and pageY defined, or nothing if the 

         *                  silent parameter is true

         */

        stopDrag: function(e, silent) {

            // YAHOO.log("mouseup - removing event handlers");

         * Internal function to handle the mousemove event.  Will be invoked 

         * from the context of the html element.

         *

         * user drags objects beyond the window boundary.  Currently we can 

         * detect this in internet explorer by verifying that the mouse is 

         * down during the mousemove event.  Firefox doesn't give us the 

         * button state on the mousemove event.

         */

        handleMouseMove: function(e) {

            //YAHOO.log("handlemousemove");

        /**

         * Iterates over all of the DragDrop elements to find ones we are 

         * hovering over or dropping on

         */

        fireEvents: function(e, isDrop) {

            var dc = this.dragCurrent;

         * 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.

         * targeted

         */

        getBestMatch: function(dds) {

            var winner = null;

         * <code>

         * YAHOO.util.DragDropMgr.refreshCache({group1:true, group2:true});

         * </code>

         * method could accept both.

         */

        refreshCache: function(groups) {

            YAHOO.log("refreshing element location cache", "info", "DragDropMgr");

         * main purpose is to handle cases where innerHTML is used to remove

         * drag and drop objects from the DOM.  IE provides an 'unspecified

         * error' when trying to access the offsetParent of such an element

         */

        verifyEl: function(el) {

            try {

        /**

         * Returns a Region object containing the drag and drop element's position

         * and size, including the padding configured for it

         *                       location for

         *                             the element occupies, including any padding

         *                             the instance is configured for.

         */

        getLocation: function(oDD) {

            if (! this.isTypeOfDD(oDD)) {

        /**

         * Checks the cursor location to see if it over the target

         */

        isOverTarget: function(pt, oTarget, intersect, curRegion) {

            // use cache if available

        /**

         * unload event handler

         */

        _onUnload: function(e, me) {

            this.unregAll();

        /**

         * Cleans up the drag and drop events and objects.

         */

        unregAll: function() {

            YAHOO.log("unregister all", "info", "DragDropMgr");

        /**

         * A cache of DOM elements

         */

        elementCache: {},

        /**

         * Get the wrapper for the DOM element specified

         */

        getElWrapper: function(id) {

            var oWrapper = this.elementCache[id];

        /**

         * Returns the actual DOM element

         */

        getElement: function(id) {

            return YAHOO.util.Dom.get(id);

        /**

         * Returns the style property for the DOM element (i.e., 

         * document.getElById(id).style)

         */

        getCss: function(id) {

            var el = YAHOO.util.Dom.get(id);

        /**

         * Inner class for cached elements

         */

        ElementWrapper: function(el) {

                /**

                 * The element

                 */

                this.el = el || null;

                /**

                 * The element id

                 */

                this.id = this.el && el.id;

                /**

                 * A reference to the style property

                 */

                this.css = this.el && el.style;

            },

        /**

         * Returns the X position of an html element

         */

        getPosX: function(el) {

            return YAHOO.util.Dom.getX(el);

        /**

         * Returns the Y position of an html element

         */

        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

         */

        swapNode: function(n1, n2) {

            if (n1.swapNode) {

        /**

         * Returns the current scroll position

         */

        getScroll: function () {

            var t, l, dde=document.documentElement, db=document.body;

        /**

         * Returns the specified element style property

         */

        getStyle: function(el, styleProp) {

            return YAHOO.util.Dom.getStyle(el, styleProp);

        /**

         * Gets the scrollTop

         */

        getScrollTop: function () { return this.getScroll().top; },

        /**

         * Gets the scrollLeft

         */

        getScrollLeft: function () { return this.getScroll().left; },

        /**

         * Sets the x/y position of an element to the location of the

         * target element.

         */

        moveToEl: function (moveEl, targetEl) {

            var aCoord = YAHOO.util.Dom.getXY(targetEl);

        /**

         * Gets the client height

         */

        getClientHeight: function() {

            return YAHOO.util.Dom.getViewportHeight();

        /**

         * Gets the client width

         */

        getClientWidth: function() {

            return YAHOO.util.Dom.getViewportWidth();

        /**

         * Numeric array sort function

         */

        numericSort: function(a, b) { return (a - b); },

        /**

         * Internal counter

         */

        _timeoutCount: 0,

        /**

         * Trying to make the load order less important.  Without this we get

         * an error if this file is loaded before the Event Utility.

         */

        _addListeners: function() {

            var DDM = YAHOO.util.DDM;

         * Recursively searches the immediate parent and all child nodes for 

         * the handle element in order to determine wheter or not it was 

         * clicked.

         */

        handleWasClicked: function(node, id) {

            if (this.isHandle(id, node.id)) {

    /**

     * An Object Literal containing the events that we will be using: mouseDown, b4MouseDown, mouseUp, b4StartDrag, startDrag, b4EndDrag, endDrag, mouseUp, drag, b4Drag, invalidDrop, b4DragOut, dragOut, dragEnter, b4DragOver, dragOver, b4DragDrop, dragDrop

     * By setting any of these to false, then event will not be fired.

     */

    events: null,

    /**

    */

    on: function() {

        this.subscribe.apply(this, arguments);

     * 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.

     */

    id: null,

    /**

     * Configuration attributes passed into the constructor

     */

    config: 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

     */

    dragElId: null, 

     * 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.

     */

    handleElId: null, 

    /**

     * An associative array of HTML tags that will be ignored if clicked.

     */

    invalidHandleTypes: null, 

    /**

     * An associative array of ids for elements that will be ignored if clicked

     */

    invalidHandleIds: null, 

    /**

     * An indexted array of css class names for elements that will be ignored

     * if clicked.

     */

    invalidHandleClasses: null, 

    /**

     * The linked element's absolute X position at the time the drag was 

     * started

     */

    startPageX: 0,

    /**

     * The linked element's absolute X position at the time the drag was 

     * started

     */

    startPageY: 0,

     * 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.

     */

    locked: false,

    /**

     * Lock this instance

     */

    lock: function() { this.locked = true; },

    /**

     * Unlock this instace

     */

    unlock: function() { this.locked = false; },

    /**

     * By default, all instances can be a drop target.  This can be disabled by

     * setting isTarget to false.

     */

    isTarget: true,

    /**

     * The padding configured for this drag and drop object for calculating

     * the drop zone intersection with this object.

     */

    padding: null,

    /**

     * If this flag is true, do not fire drop events. The element is a drag only element (for movement not dropping)

     */

    dragOnly: false,

    /**

     * If this flag is true, a shim will be placed over the screen/viewable area to track mouse events. Should help with dragging elements over iframes and other controls.

     */

    useShim: false,

    /**

     * Cached reference to the linked element

     */

    _domRef: null,

    /**

     * Internal typeof flag

     */

    __ygDragDrop: true,

    /**

     * Set to true when horizontal contraints are applied

     */

    constrainX: false,

    /**

     * Set to true when vertical contraints are applied

     */

    constrainY: false,

    /**

     * The left constraint

     */

    minX: 0,

    /**

     * The right constraint

     */

    maxX: 0,

    /**

     * The up constraint