upgraded yui to 2.2.2 and yui-ext to 1.0.1a

www/extras/yui/examples/dragdrop/js/DDList.js

@@ -0,0 +1,172 @@
+
+(function() {
+
+var Dom = YAHOO.util.Dom;
+var Event = YAHOO.util.Event;
+var DDM = YAHOO.util.DragDropMgr;
+
+YAHOO.example.DDListItem = function(id, sGroup, config) {
+
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+        this.logger = this.logger || YAHOO;
+    }
+
+    var el = this.getDragEl();
+    Dom.setStyle(el, "opacity", 0.67);
+    this.host= config && config.hostId;
+
+    this.setPadding(-4);
+    this.goingUp = false;
+    this.lastY = 0;
+};
+
+YAHOO.extend(YAHOO.example.DDListItem, YAHOO.util.DDProxy, {
+
+    startDrag: function(x, y) {
+        this.logger.log(this.id + " startDrag");
+
+        var dragEl = this.getDragEl();
+        var clickEl = this.getEl();
+        Dom.setStyle(clickEl, "visibility", "hidden");
+
+        dragEl.innerHTML = clickEl.innerHTML;
+
+
+        Dom.setStyle(dragEl, "color", Dom.getStyle(clickEl, "color"));
+        Dom.setStyle(dragEl, "backgroundColor", Dom.getStyle(clickEl, "backgroundColor"));
+        Dom.setStyle(dragEl, "border", "2px solid gray");
+    },
+
+    endDrag: function(e) {
+
+        var srcEl = this.getEl();
+        var proxy = this.getDragEl();
+        Dom.setStyle(proxy, "visibility", "visible");
+
+        // animate the proxy element to the src element's location
+        var a = new YAHOO.util.Motion( 
+            proxy, { 
+                points: { 
+                    to: Dom.getXY(srcEl)
+                }
+            }, 
+            0.3, 
+            YAHOO.util.Easing.easeOut 
+        )
+        var proxyid = proxy.id;
+        var id = this.id;
+        a.onComplete.subscribe(function() {
+                Dom.setStyle(proxyid, "visibility", "hidden");
+                Dom.setStyle(id, "visibility", "");
+            });
+        a.animate();
+    },
+
+    onDragDrop: function(e, id) {
+        YAHOO.log("DROP: " + id, "warn");
+    },
+
+    onDrag: function(e, id) {
+
+        // figure out which direction we are moving
+        var y = Event.getPageY(e);
+
+        if (y < this.lastY) {
+            this.goingUp = true;
+        } else if (y > this.lastY) {
+            this.goingUp = false;
+        }
+
+        this.lastY = y;
+        
+    },
+
+    onDragOver: function(e, id) {
+
+        
+    
+        var srcEl = this.getEl();
+        var destEl;
+
+        if ("string" == typeof id) { // POINT mode
+            destEl = Dom.get(id);
+        } else { // INTERSECT mode
+            destEl= YAHOO.util.DDM.getBestMatch(id).getEl();
+        }
+
+        var destDD = DDM.getDDById(destEl.id);
+
+        if (destDD.isContainer) {
+
+            if (this.isEmpty) {
+                destEl.appendChild(this.getEl());
+                this.isEmpty = false;
+                DDM.refreshCache();
+            }
+
+        } else {
+
+            var orig_p = srcEl.parentNode;
+            var p = destEl.parentNode;
+
+            //YAHOO.log("destEl: " + destEl.id, "error");
+            //YAHOO.log("p: " + p.id, "error");
+
+            if (this.goingUp) {
+                p.insertBefore(srcEl, destEl);
+            } else {
+                p.insertBefore(srcEl, destEl.nextSibling);
+            }
+
+            if (p != orig_p) {
+
+                // set the new parent
+                this.hostId = p.id;
+
+                // check to se if the original parent is empty
+                if (orig_p.getElementsByTagName("li").length === 0) {
+                    // mark the list dd instance empty
+                    DDM.getDDById(orig_p.id).isEmpty = true;
+                }
+
+                // the new parent can't be empty if it was previously
+                DDM.getDDById(p.id).isEmpty = false;
+            }
+
+            DDM.refreshCache();
+        }
+    },
+
+    onDragEnter: function(e, id) {
+    },
+
+    onDragOut: function(e, id) {
+    },
+
+    toString: function() {
+        return "DDListItem " + this.id;
+    }
+
+});
+
+
+YAHOO.example.DDList = function(id, sGroup, config) {
+
+    if (id) {
+        this.initTarget(id, sGroup, config);
+        this.logger = this.logger || YAHOO;
+    }
+
+    this.isContainer = true;
+    this.isEmpty = false;
+
+};
+
+YAHOO.extend(YAHOO.example.DDList, YAHOO.util.DDProxy, {
+
+
+});
+
+})();

www/extras/yui/examples/dragdrop/js/DDMy.js

@@ -0,0 +1,48 @@
+
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+
+/**
+ * @class a ygDDFramed implementation where the frame only moves vertically, and
+ * the DOM elements are swapped when one is dropped on another
+ *
+ * @extends YAHOO.util.DDProxy
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop objects
+ */
+YAHOO.example.DDMy = function(id, sGroup, config) {
+
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+        this.logger = this.logger || YAHOO;
+    }
+
+    // The frame should only move vertically...  this makes it so the user can
+    // only move content channels up and down within a column
+    this.setXConstraint(0, 0);
+};
+
+// YAHOO.example.DDMy.prototype = new YAHOO.util.DDProxy();
+YAHOO.extend(YAHOO.example.DDMy, YAHOO.util.DDProxy);
+
+YAHOO.example.DDMy.prototype.onDragDrop = function(e, id) {
+    this.logger.log(this.id + " onDragDrop");
+
+    var el;
+
+    if ("string" == typeof id) {
+        el = YAHOO.util.DDM.getElement(id);
+    } else {
+        el = YAHOO.util.DDM.getBestMatch(id).getEl();
+    }
+
+    YAHOO.util.DDM.swapNode(this.getEl(), el);
+};
+
+YAHOO.example.DDMy.prototype.endDrag = function(e) {
+    // we default behavior is to move the element to the end point when
+    // the drag is ended.  In our case, we only want to move the element
+    // when it is dropped on another dd element.  To override the default,
+    // we simply need to create an empty endDrag function.
+};

www/extras/yui/examples/dragdrop/js/DDMy2.js

@@ -0,0 +1,62 @@
+
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+
+/**
+ * @class a YAHHO.util.DDProxy implementation like DDMy, but the content 
+ * channels are * not restricted to one column, and we drag a miniature 
+ * representation of the * content channel rather than a frame of the channel.
+ *
+ * @extends YAHOO.util.DDProxy
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop objects
+ */
+YAHOO.example.DDMy2 = function(id, sGroup, config) {
+
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+        this.logger = this.logger || YAHOO;
+    }
+
+    // Change the style of the frame to be a miniature representation of a
+    // content channel
+    var s = this.getDragEl().style;
+    s.background = "url(img/channel.png) 0 0 no-repeat";
+    s.height = "92px";
+    s.width = "100px";
+    // s.opacity = 0.66;
+    // s.filter = "alpha(opacity=66)";
+
+    // Specify that we do not want to resize the drag frame... we want to keep
+    // the drag frame the size of our miniature content channel image
+    //this.resizeFrame = false;
+
+    // Specify that we want the drag frame centered around the cursor rather 
+    // than relative to the click location so that the miniature content
+    // channel appears in the location that was clicked
+    // this.centerFrame = true;
+};
+
+// YAHOO.example.DDMy2.prototype = new YAHOO.util.DDProxy();
+YAHOO.extend(YAHOO.example.DDMy2, YAHOO.util.DDProxy);
+
+YAHOO.example.DDMy2.prototype.onDragDrop = function(e, id) {
+    this.logger.log(this.id + " onDragDrop");
+
+    var el;
+    if ("string" == typeof id) {
+        el = YAHOO.util.DDM.getElement(id);
+    } else {
+        el = YAHOO.util.DDM.getBestMatch(id).getEl();
+    }
+
+    YAHOO.util.DDM.swapNode(this.getEl(), el);
+};
+
+YAHOO.example.DDMy2.prototype.endDrag = function(e) {
+    // we default behavior is to move the element to the end point when
+    // the drag is ended.  In our case, we only want to move the element
+    // when it is dropped on another dd element.  To override the default,
+    // we simply need to create an empty endDrag function.
+};

www/extras/yui/examples/dragdrop/js/DDOnTop.js

@@ -0,0 +1,49 @@
+
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+
+/**
+ * @class a DragDrop implementation that moves the object as it is being dragged,
+ * and keeps the object being dragged on top.  This is a subclass of DD rather
+ * than DragDrop, and inherits the implementation of most of the event listeners
+ * from that class.
+ *
+ * @extends YAHOO.util.DD
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop items
+ */
+YAHOO.example.DDOnTop = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+        this.logger = this.logger || YAHOO;
+    }
+};
+
+// YAHOO.example.DDOnTop.prototype = new YAHOO.util.DD();
+YAHOO.extend(YAHOO.example.DDOnTop, YAHOO.util.DD);
+
+/**
+ * The inital z-index of the element, stored so we can restore it later
+ *
+ * @type int
+ */
+YAHOO.example.DDOnTop.prototype.origZ = 0;
+
+YAHOO.example.DDOnTop.prototype.startDrag = function(x, y) {
+    this.logger.log(this.id + " startDrag");
+
+    var style = this.getEl().style;
+
+    // store the original z-index
+    this.origZ = style.zIndex;
+
+    // The z-index needs to be set very high so the element will indeed be on top
+    style.zIndex = 999;
+};
+
+YAHOO.example.DDOnTop.prototype.endDrag = function(e) {
+    this.logger.log(this.id + " endDrag");
+
+    // restore the original z-index
+    this.getEl().style.zIndex = this.origZ;
+};

www/extras/yui/examples/dragdrop/js/DDPlayer.js

@@ -0,0 +1,164 @@
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+/////////////////////////////////////////////////////////////////////////
+
+/**
+ * @class a YAHOO.util.DDFramed implementation. During the drag over event, the
+ * dragged element is inserted before the dragged-over element.
+ *
+ * @extends YAHOO.util.DDProxy
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop objects
+ */
+YAHOO.example.DDPlayer = function(id, sGroup, config) {
+    this.initPlayer(id, sGroup, config);
+};
+
+// YAHOO.example.DDPlayer.prototype = new YAHOO.util.DDProxy();
+YAHOO.extend(YAHOO.example.DDPlayer, YAHOO.util.DDProxy);
+
+YAHOO.example.DDPlayer.TYPE = "DDPlayer";
+
+YAHOO.example.DDPlayer.prototype.initPlayer = function(id, sGroup, config) {
+    if (!id) { return; }
+
+    this.init(id, sGroup, config);
+    this.initFrame();
+
+    this.logger = this.logger || YAHOO;
+    var el = this.getDragEl()
+    YAHOO.util.Dom.setStyle(el, "borderColor", "transparent");
+    YAHOO.util.Dom.setStyle(el, "opacity", 0.76);
+
+    // specify that this is not currently a drop target
+    this.isTarget = false;
+
+    this.originalStyles = [];
+
+    this.type = YAHOO.example.DDPlayer.TYPE;
+    this.slot = null;
+
+    this.startPos = YAHOO.util.Dom.getXY( this.getEl() );
+    this.logger.log(id + " startpos: " + this.startPos);
+};
+
+YAHOO.example.DDPlayer.prototype.startDrag = function(x, y) {
+    this.logger.log(this.id + " startDrag");
+    var Dom = YAHOO.util.Dom;
+
+    var dragEl = this.getDragEl();
+    var clickEl = this.getEl();
+
+    dragEl.innerHTML = clickEl.innerHTML;
+    dragEl.className = clickEl.className;
+
+    Dom.setStyle(dragEl, "color",  Dom.getStyle(clickEl, "color"));
+    Dom.setStyle(dragEl, "backgroundColor", Dom.getStyle(clickEl, "backgroundColor"));
+
+    Dom.setStyle(clickEl, "opacity", 0.1);
+
+    var targets = YAHOO.util.DDM.getRelated(this, true);
+    this.logger.log(targets.length + " targets");
+    for (var i=0; i<targets.length; i++) {
+        
+        var targetEl = this.getTargetDomRef(targets[i]);
+
+        if (!this.originalStyles[targetEl.id]) {
+            this.originalStyles[targetEl.id] = targetEl.className;
+        }
+
+        targetEl.className = "target";
+    }
+};
+
+YAHOO.example.DDPlayer.prototype.getTargetDomRef = function(oDD) {
+    if (oDD.player) {
+        return oDD.player.getEl();
+    } else {
+        return oDD.getEl();
+    }
+};
+
+YAHOO.example.DDPlayer.prototype.endDrag = function(e) {
+    // reset the linked element styles
+    YAHOO.util.Dom.setStyle(this.getEl(), "opacity", 1);
+
+    this.resetTargets();
+};
+
+YAHOO.example.DDPlayer.prototype.resetTargets = function() {
+
+    // reset the target styles
+    var targets = YAHOO.util.DDM.getRelated(this, true);
+    for (var i=0; i<targets.length; i++) {
+        var targetEl = this.getTargetDomRef(targets[i]);
+        var oldStyle = this.originalStyles[targetEl.id];
+        if (oldStyle) {
+            targetEl.className = oldStyle;
+        }
+    }
+};
+
+YAHOO.example.DDPlayer.prototype.onDragDrop = function(e, id) {
+    // get the drag and drop object that was targeted
+    var oDD;
+    
+    if ("string" == typeof id) {
+        oDD = YAHOO.util.DDM.getDDById(id);
+    } else {
+        oDD = YAHOO.util.DDM.getBestMatch(id);
+    }
+
+    var el = this.getEl();
+
+    // check if the slot has a player in it already
+    if (oDD.player) {
+        // check if the dragged player was already in a slot
+        if (this.slot) {
+            // check to see if the player that is already in the
+            // slot can go to the slot the dragged player is in
+            // YAHOO.util.DDM.isLegalTarget is a new method
+            if ( YAHOO.util.DDM.isLegalTarget(oDD.player, this.slot) ) {
+                this.logger.log("swapping player positions");
+                YAHOO.util.DDM.moveToEl(oDD.player.getEl(), el);
+                this.slot.player = oDD.player;
+                oDD.player.slot = this.slot;
+            } else {
+                this.logger.log("moving player in slot back to start");
+                YAHOO.util.Dom.setXY(oDD.player.getEl(), oDD.player.startPos);
+                this.slot.player = null;
+                oDD.player.slot = null
+            }
+        } else {
+            // the player in the slot will be moved to the dragged
+            // players start position
+            oDD.player.slot = null;
+            YAHOO.util.DDM.moveToEl(oDD.player.getEl(), el);
+        }
+    } else {
+        // Move the player into the emply slot
+        // I may be moving off a slot so I need to clear the player ref
+        if (this.slot) {
+            this.slot.player = null;
+        }
+    }
+
+    YAHOO.util.DDM.moveToEl(el, oDD.getEl());
+    this.resetTargets();
+
+    this.slot = oDD;
+    this.slot.player = this;
+};
+
+YAHOO.example.DDPlayer.prototype.swap = function(el1, el2) {
+    var Dom = YAHOO.util.Dom;
+    var pos1 = Dom.getXY(el1);
+    var pos2 = Dom.getXY(el2);
+    Dom.setXY(el1, pos2);
+    Dom.setXY(el2, pos1);
+};
+
+YAHOO.example.DDPlayer.prototype.onDragOver = function(e, id) {};
+
+YAHOO.example.DDPlayer.prototype.onDrag = function(e, id) {};
+

www/extras/yui/examples/dragdrop/js/DDResize.js

@@ -0,0 +1,46 @@
+
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+
+/**
+ * @extends YAHOO.util.DragDrop
+ * @constructor
+ * @param {String} handle the id of the element that will cause the resize
+ * @param {String} panel id of the element to resize
+ * @param {String} sGroup the group of related DragDrop items
+ */
+YAHOO.example.DDResize = function(panelElId, handleElId, sGroup, config) {
+    if (panelElId) {
+        this.init(panelElId, sGroup, config);
+        this.handleElId = handleElId;
+        this.setHandleElId(handleElId);
+        this.logger = this.logger || YAHOO;
+    }
+};
+
+// YAHOO.example.DDResize.prototype = new YAHOO.util.DragDrop();
+YAHOO.extend(YAHOO.example.DDResize, YAHOO.util.DragDrop);
+
+YAHOO.example.DDResize.prototype.onMouseDown = function(e) {
+    var panel = this.getEl();
+    this.startWidth = panel.offsetWidth;
+    this.startHeight = panel.offsetHeight;
+
+    this.startPos = [YAHOO.util.Event.getPageX(e),
+                     YAHOO.util.Event.getPageY(e)];
+};
+
+YAHOO.example.DDResize.prototype.onDrag = function(e) {
+    var newPos = [YAHOO.util.Event.getPageX(e),
+                  YAHOO.util.Event.getPageY(e)];
+
+    var offsetX = newPos[0] - this.startPos[0];
+    var offsetY = newPos[1] - this.startPos[1];
+
+    var newWidth = Math.max(this.startWidth + offsetX, 10);
+    var newHeight = Math.max(this.startHeight + offsetY, 10);
+
+    var panel = this.getEl();
+    panel.style.width = newWidth + "px";
+    panel.style.height = newHeight + "px";
+};
+

www/extras/yui/examples/dragdrop/js/DDResize2.js

@@ -0,0 +1,106 @@
+
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+
+/**
+ * @extends YAHOO.util.DragDrop
+ * @constructor
+ * @param {String} handle the id of the element that will cause the resize
+ * @param {String} panel id of the element to resize
+ * @param {String} sGroup the group of related DragDrop items
+ */
+YAHOO.example.DDResize = function(panelElId, nwHandle, 
+        neHandle, seHandle, swHandle, sGroup, config) {
+    if (panelElId) {
+        this.init(panelElId, sGroup, config);
+        this.nwHandle = nwHandle;
+        this.neHandle = neHandle;
+        this.seHandle = seHandle;
+        this.swHandle = swHandle;
+        this.setHandleElId(nwHandle);
+        this.setHandleElId(neHandle);
+        this.setHandleElId(seHandle);
+        this.setHandleElId(swHandle);
+        this.logger = this.logger || YAHOO;
+    }
+};
+
+// YAHOO.example.DDResize.prototype = new YAHOO.util.DragDrop();
+YAHOO.extend(YAHOO.example.DDResize, YAHOO.util.DragDrop);
+
+YAHOO.example.DDResize.prototype.lockAspectRatio = false;
+
+YAHOO.example.DDResize.prototype.onMouseDown = function(e) {
+    var panel = this.getEl();
+    this.startWidth = panel.offsetWidth;
+    this.startHeight = panel.offsetHeight;
+    this.panelStartPos = YAHOO.util.Dom.getXY(panel);
+
+    this.aspectRatio = this.startWidth/this.startHeight;
+    this.direction = this.getDirection(YAHOO.util.Event.getTarget(e, true).id);
+    this.logger.log("direction " + this.direction);
+
+    this.startPos = [YAHOO.util.Event.getPageX(e),
+                     YAHOO.util.Event.getPageY(e)];
+};
+
+YAHOO.example.DDResize.prototype.onDrag = function(e) {
+    var newPos = [YAHOO.util.Event.getPageX(e),
+                  YAHOO.util.Event.getPageY(e)];
+
+    var offsetX = newPos[0] - this.startPos[0];
+    var offsetY = (this.lockAspectRatio) ? offsetX : newPos[1] - this.startPos[1];
+
+    var newWidth = Math.max(this.startWidth + offsetX, 10);
+    var newHeight = Math.max(this.startHeight + offsetY, 10);
+
+    var panel = this.getEl();
+
+
+    var panelPos = YAHOO.util.Dom.getXY(panel);
+    var movePos = [this.panelStartPos[0], this.panelStartPos[1]];
+    var doMove = false;
+
+    if (this.direction == "nw" || this.direction == "sw") {
+        movePos[0] = this.panelStartPos[0] + offsetX;
+        newWidth = Math.max(this.startWidth - offsetX, 10);
+        doMove = true;
+    }
+
+    if (this.direction == "ne" || this.direction == "nw") {
+        offsetY = newPos[1] - this.startPos[1];
+        offsetX = offsetY;
+        movePos[1] = this.panelStartPos[1] + offsetY;
+        newHeight = Math.max(this.startHeight - offsetY, 10);
+        newWidth = Math.max(this.startWidth - offsetX, 10);
+        doMove = true;
+    }
+
+
+    switch (this.direction) {
+        case "nw":
+            
+    }
+
+
+    if (doMove) {
+        YAHOO.util.Dom.setXY(panel, movePos);
+    }
+
+    panel.style.width = newWidth + "px";
+    panel.style.height = newHeight + "px";
+};
+
+YAHOO.example.DDResize.prototype.getDirection = function(handle) {
+    if (handle == this.nwHandle) {
+        return "nw";
+    } else if (handle == this.neHandle) {
+        return "ne";
+    } else if (handle == this.seHandle) {
+        return "se";
+    } else if (handle == this.swHandle) {
+        return "sw";
+    } else {
+        return null;
+    }
+}
+

www/extras/yui/examples/dragdrop/js/DDSwap.js

@@ -0,0 +1,170 @@
+
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+
+/**
+ * @class a YAHOO.util.DDProxy implementation that swaps positions with the 
+ * target when dropped
+ *
+ * @extends YAHOO.util.DDProxy
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop items
+ */
+YAHOO.example.DDSwap = function(id, sGroup, config) {
+    this.swapInit(id, sGroup, config);
+};
+
+YAHOO.extend(YAHOO.example.DDSwap, YAHOO.util.DDProxy);
+
+YAHOO.example.DDSwap.prototype.swapInit = function(id, sGroup, config) {
+    if (!id) { return; }
+
+    this.init(id, sGroup, config);
+    this.initFrame();
+    this.logger = this.logger || YAHOO;
+
+    /**
+     * css style to use when items are not being hovered over.
+     */
+    this.offClass = "testSquare";
+
+    /**
+     * css style to use when hovered over
+     */
+    this.onClass = "testSquareOn";
+
+    /**
+     * cache of the elements we have changed the style so we can restore it
+     * later
+     */
+    this.els = [];
+
+};
+
+YAHOO.example.DDSwap.prototype.onDragDrop = function(e, id) {
+    var dd = YAHOO.util.DDM.getDDById(id);
+    this.swap(this.getEl(), dd.getEl());
+    this.resetConstraints();
+    dd.resetConstraints();
+};
+
+YAHOO.example.DDSwap.prototype.swap = function(el1, el2) {
+    this.logger.log(this.id + " onDragDrop swap");
+
+    // Swap out the position of the two objects.  This only works for absolutely
+    // positioned elements.  See for an implementation that 
+    // works for relatively positioned elements
+    var s1 = el1.style;
+    var s2 = el2.style;
+
+    var l = s1.left;
+    var t = s1.top;
+
+    s1.left = s2.left;
+    s1.top = s2.top;
+
+    s2.left = l;
+    s2.top = t;
+};
+
+YAHOO.example.DDSwap.prototype.onDragEnter = function(e, id) {
+    this.logger.log(this.id + " dragEnter " + id);
+
+    // store a ref so we can restore the style later
+    this.els[id] = true;
+
+    // set the mouseover style
+    var el = YAHOO.util.DDM.getElement(id);
+    if (el.className != this.onClass) {
+        el.className = this.onClass;
+    }
+};
+
+YAHOO.example.DDSwap.prototype.onDragOut = function(e, id) {
+    this.logger.log(this.id + " dragOut " + id);
+
+    // restore the style
+    YAHOO.util.DDM.getElement(id).className = this.offClass;
+};
+
+YAHOO.example.DDSwap.prototype.endDrag = function(e) {
+    this.logger.log(this.id + " endDrag");
+    this.resetStyles();
+
+    /*
+        var el = this.getDragEl();
+    el.style.visibility = ""; // show the element first
+    var position = [100, 100];
+    var duration = 0.4;
+    var oAnim = new YAHOO.util.Motion( 
+           el, { points: { to: position } }, duration, YAHOO.util.Easing.easeOut );
+
+    oAnim.onComplete.subscribe( function() { el.style.visibility = "hidden" } );
+*/
+
+
+};
+
+YAHOO.example.DDSwap.prototype.resetStyles = function() {
+    // restore all element styles
+    for (var i in this.els) {
+        var el = YAHOO.util.DDM.getElement(i);
+        if (el) { el.className = this.offClass; }
+    }
+};
+
+YAHOO.example.DDSwap.prototype.onDrag = function(e) { };
+
+YAHOO.example.DDSwap.prototype.onDragOver = function(e) { };
+
+
+//-------------------------------------------------------------------------
+// Intersect mode
+//-------------------------------------------------------------------------
+
+
+
+YAHOO.example.DDSwap_i = function(id, sGroup, strict) {
+    this.swapInit(id, sGroup);
+};
+
+YAHOO.example.DDSwap_i.prototype = new YAHOO.example.DDSwap();
+
+YAHOO.example.DDSwap_i.prototype.onDragDrop = function(e, dds) {
+    // this.logger.log(this.id + " onDragDrop swap");
+    var dd = YAHOO.util.DDM.getBestMatch(dds, this.strict);
+    this.swap(this.getEl(), dd.getEl());
+
+    this.resetConstraints();
+    dd.resetConstraints();
+};
+
+YAHOO.example.DDSwap_i.prototype.onDragEnter = function(e, dds) { 
+  // this.logger.log(this.id + " dragEnter " + id);
+};
+
+YAHOO.example.DDSwap_i.prototype.onDragOver = function(e, dds) {
+ 
+    this.resetStyles();
+
+    var dd = YAHOO.util.DDM.getBestMatch(dds, this.strict);
+
+    this.els[dd.id] = true;
+
+    // set the mouseover style
+    var el = dd.getEl();
+    if (el.className != this.onClass) {
+        el.className = this.onClass;
+    }
+ 
+};
+
+YAHOO.example.DDSwap_i.prototype.onDragOut = function(e, dds) {
+    // this.logger.log(this.id + " dragOut " + id);
+
+    // restore the style
+    for (var i=0; i<dds.length; ++i) {
+        dds[i].getEl().className = this.offClass;
+    }
+};
+

www/extras/yui/examples/dragdrop/js/color.js

@@ -0,0 +1,2 @@
+
+

www/extras/yui/examples/dragdrop/js/key.js

@@ -0,0 +1,34 @@
+/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
+
+YAHOO.util.Key = new function() {
+	// this.logger	= new ygLogger("ygEventUtil");
+	// DOM key constants 
+	this.DOM_VK_UNDEFINED               = 0x0;
+	this.DOM_VK_RIGHT_ALT               = 0x12;
+	this.DOM_VK_LEFT_ALT                = 0x12;
+	this.DOM_VK_LEFT_CONTROL            = 0x11;
+	this.DOM_VK_RIGHT_CONTROL           = 0x11;
+	this.DOM_VK_LEFT_SHIFT              = 0x10;
+	this.DOM_VK_RIGHT_SHIFT             = 0x10;
+	this.DOM_VK_META                    = 0x9D;
+	this.DOM_VK_BACK_SPACE              = 0x08;
+	this.DOM_VK_CAPS_LOCK               = 0x14;
+	this.DOM_VK_DELETE                  = 0x7F;
+	this.DOM_VK_END                     = 0x23;
+	this.DOM_VK_ENTER                   = 0x0D;
+	this.DOM_VK_ESCAPE                  = 0x1B;
+	this.DOM_VK_HOME                    = 0x24;
+	this.DOM_VK_NUM_LOCK                = 0x90;
+	this.DOM_VK_PAUSE                   = 0x13;
+	this.DOM_VK_PRINTSCREEN             = 0x9A;
+	this.DOM_VK_SCROLL_LOCK             = 0x91;
+	this.DOM_VK_SPACE                   = 0x20;
+	this.DOM_VK_TAB                     = 0x09;
+	this.DOM_VK_LEFT                    = 0x25;
+	this.DOM_VK_RIGHT                   = 0x27;
+	this.DOM_VK_UP                      = 0x26;
+	this.DOM_VK_DOWN                    = 0x28;
+	this.DOM_VK_PAGE_DOWN               = 0x22;
+	this.DOM_VK_PAGE_UP                 = 0x21;
+};
+

www/extras/yui/examples/dragdrop/js/log.js

@@ -0,0 +1,20 @@
+// Adapter for YAHOO.widget.Logger
+
+var ygLogger = function(module) {
+    return new YAHOO.widget.LogWriter(module);
+};
+
+YAHOO.widget.LogWriter.prototype.debug = function() {
+    this.log.apply(this, arguments);
+};
+
+YAHOO.widget.LogWriter.prototype.setModuleName = function(source) {
+    this._source = source;
+};
+
+
+ygLogger.init = function(div) {
+   new YAHOO.widget.LogReader(div, { 
+            height: "400px" 
+        });
+};