michael@0: /***
michael@0: MochiKit.DragAndDrop 1.4
michael@0: 
michael@0: See <http://mochikit.com/> for documentation, downloads, license, etc.
michael@0: 
michael@0: Copyright (c) 2005 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
michael@0:     Mochi-ized By Thomas Herve (_firstname_@nimail.org)
michael@0: 
michael@0: ***/
michael@0: 
michael@0: if (typeof(dojo) != 'undefined') {
michael@0:     dojo.provide('MochiKit.DragAndDrop');
michael@0:     dojo.require('MochiKit.Base');
michael@0:     dojo.require('MochiKit.DOM');
michael@0:     dojo.require('MochiKit.Iter');
michael@0:     dojo.require('MochiKit.Visual');
michael@0:     dojo.require('MochiKit.Signal');
michael@0: }
michael@0: 
michael@0: if (typeof(JSAN) != 'undefined') {
michael@0:     JSAN.use("MochiKit.Base", []);
michael@0:     JSAN.use("MochiKit.DOM", []);
michael@0:     JSAN.use("MochiKit.Visual", []);
michael@0:     JSAN.use("MochiKit.Iter", []);
michael@0:     JSAN.use("MochiKit.Signal", []);
michael@0: }
michael@0: 
michael@0: try {
michael@0:     if (typeof(MochiKit.Base) == 'undefined' ||
michael@0:         typeof(MochiKit.DOM) == 'undefined' ||
michael@0:         typeof(MochiKit.Visual) == 'undefined' ||
michael@0:         typeof(MochiKit.Signal) == 'undefined' ||
michael@0:         typeof(MochiKit.Iter) == 'undefined') {
michael@0:         throw "";
michael@0:     }
michael@0: } catch (e) {
michael@0:     throw "MochiKit.DragAndDrop depends on MochiKit.Base, MochiKit.DOM, MochiKit.Visual, MochiKit.Signal and MochiKit.Iter!";
michael@0: }
michael@0: 
michael@0: if (typeof(MochiKit.DragAndDrop) == 'undefined') {
michael@0:     MochiKit.DragAndDrop = {};
michael@0: }
michael@0: 
michael@0: MochiKit.DragAndDrop.NAME = 'MochiKit.DragAndDrop';
michael@0: MochiKit.DragAndDrop.VERSION = '1.4';
michael@0: 
michael@0: MochiKit.DragAndDrop.__repr__ = function () {
michael@0:     return '[' + this.NAME + ' ' + this.VERSION + ']';
michael@0: };
michael@0: 
michael@0: MochiKit.DragAndDrop.toString = function () {
michael@0:     return this.__repr__();
michael@0: };
michael@0: 
michael@0: MochiKit.DragAndDrop.EXPORT = [
michael@0:     "Droppable",
michael@0:     "Draggable"
michael@0: ];
michael@0: 
michael@0: MochiKit.DragAndDrop.EXPORT_OK = [
michael@0:     "Droppables",
michael@0:     "Draggables"
michael@0: ];
michael@0: 
michael@0: MochiKit.DragAndDrop.Droppables = {
michael@0:     /***
michael@0: 
michael@0:     Manage all droppables. Shouldn't be used, use the Droppable object instead.
michael@0: 
michael@0:     ***/
michael@0:     drops: [],
michael@0: 
michael@0:     remove: function (element) {
michael@0:         this.drops = MochiKit.Base.filter(function (d) {
michael@0:             return d.element != MochiKit.DOM.getElement(element);
michael@0:         }, this.drops);
michael@0:     },
michael@0: 
michael@0:     register: function (drop) {
michael@0:         this.drops.push(drop);
michael@0:     },
michael@0: 
michael@0:     unregister: function (drop) {
michael@0:         this.drops = MochiKit.Base.filter(function (d) {
michael@0:             return d != drop;
michael@0:         }, this.drops);
michael@0:     },
michael@0: 
michael@0:     prepare: function (element) {
michael@0:         MochiKit.Base.map(function (drop) {
michael@0:             if (drop.isAccepted(element)) {
michael@0:                 if (drop.options.activeclass) {
michael@0:                     MochiKit.DOM.addElementClass(drop.element,
michael@0:                                                  drop.options.activeclass);
michael@0:                 }
michael@0:                 drop.options.onactive(drop.element, element);
michael@0:             }
michael@0:         }, this.drops);
michael@0:     },
michael@0: 
michael@0:     findDeepestChild: function (drops) {
michael@0:         deepest = drops[0];
michael@0: 
michael@0:         for (i = 1; i < drops.length; ++i) {
michael@0:             if (MochiKit.DOM.isParent(drops[i].element, deepest.element)) {
michael@0:                 deepest = drops[i];
michael@0:             }
michael@0:         }
michael@0:         return deepest;
michael@0:     },
michael@0: 
michael@0:     show: function (point, element) {
michael@0:         if (!this.drops.length) {
michael@0:             return;
michael@0:         }
michael@0:         var affected = [];
michael@0: 
michael@0:         if (this.last_active) {
michael@0:             this.last_active.deactivate();
michael@0:         }
michael@0:         MochiKit.Iter.forEach(this.drops, function (drop) {
michael@0:             if (drop.isAffected(point, element)) {
michael@0:                 affected.push(drop);
michael@0:             }
michael@0:         });
michael@0:         if (affected.length > 0) {
michael@0:             drop = this.findDeepestChild(affected);
michael@0:             MochiKit.Position.within(drop.element, point.page.x, point.page.y);
michael@0:             drop.options.onhover(element, drop.element,
michael@0:                 MochiKit.Position.overlap(drop.options.overlap, drop.element));
michael@0:             drop.activate();
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     fire: function (event, element) {
michael@0:         if (!this.last_active) {
michael@0:             return;
michael@0:         }
michael@0:         MochiKit.Position.prepare();
michael@0: 
michael@0:         if (this.last_active.isAffected(event.mouse(), element)) {
michael@0:             this.last_active.options.ondrop(element,
michael@0:                this.last_active.element, event);
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     reset: function (element) {
michael@0:         MochiKit.Base.map(function (drop) {
michael@0:             if (drop.options.activeclass) {
michael@0:                 MochiKit.DOM.removeElementClass(drop.element,
michael@0:                                                 drop.options.activeclass);
michael@0:             }
michael@0:             drop.options.ondesactive(drop.element, element);
michael@0:         }, this.drops);
michael@0:         if (this.last_active) {
michael@0:             this.last_active.deactivate();
michael@0:         }
michael@0:     }
michael@0: };
michael@0: 
michael@0: /** @id MochiKit.DragAndDrop.Droppable */
michael@0: MochiKit.DragAndDrop.Droppable = function (element, options) {
michael@0:     var cls = arguments.callee;
michael@0:     if (!(this instanceof cls)) {
michael@0:         return new cls(element, options);
michael@0:     }
michael@0:     this.__init__(element, options);
michael@0: };
michael@0: 
michael@0: MochiKit.DragAndDrop.Droppable.prototype = {
michael@0:     /***
michael@0: 
michael@0:     A droppable object. Simple use is to create giving an element:
michael@0: 
michael@0:         new MochiKit.DragAndDrop.Droppable('myelement');
michael@0: 
michael@0:     Generally you'll want to define the 'ondrop' function and maybe the
michael@0:     'accept' option to filter draggables.
michael@0: 
michael@0:     ***/
michael@0:     __class__: MochiKit.DragAndDrop.Droppable,
michael@0: 
michael@0:     __init__: function (element, /* optional */options) {
michael@0:         var d = MochiKit.DOM;
michael@0:         var b = MochiKit.Base;
michael@0:         this.element = d.getElement(element);
michael@0:         this.options = b.update({
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.greedy */
michael@0:             greedy: true,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.hoverclass */
michael@0:             hoverclass: null,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.activeclass */
michael@0:             activeclass: null,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.hoverfunc */
michael@0:             hoverfunc: b.noop,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.accept */
michael@0:             accept: null,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.onactive */
michael@0:             onactive: b.noop,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.ondesactive */
michael@0:             ondesactive: b.noop,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.onhover */
michael@0:             onhover: b.noop,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.ondrop */
michael@0:             ondrop: b.noop,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.containment */
michael@0:             containment: [],
michael@0:             tree: false
michael@0:         }, options || {});
michael@0: 
michael@0:         // cache containers
michael@0:         this.options._containers = [];
michael@0:         b.map(MochiKit.Base.bind(function (c) {
michael@0:             this.options._containers.push(d.getElement(c));
michael@0:         }, this), this.options.containment);
michael@0: 
michael@0:         d.makePositioned(this.element); // fix IE
michael@0: 
michael@0:         MochiKit.DragAndDrop.Droppables.register(this);
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.isContained */
michael@0:     isContained: function (element) {
michael@0:         if (this.options._containers.length) {
michael@0:             var containmentNode;
michael@0:             if (this.options.tree) {
michael@0:                 containmentNode = element.treeNode;
michael@0:             } else {
michael@0:                 containmentNode = element.parentNode;
michael@0:             }
michael@0:             return MochiKit.Iter.some(this.options._containers, function (c) {
michael@0:                 return containmentNode == c;
michael@0:             });
michael@0:         } else {
michael@0:             return true;
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.isAccepted */
michael@0:     isAccepted: function (element) {
michael@0:         return ((!this.options.accept) || MochiKit.Iter.some(
michael@0:           this.options.accept, function (c) {
michael@0:             return MochiKit.DOM.hasElementClass(element, c);
michael@0:         }));
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.isAffected */
michael@0:     isAffected: function (point, element) {
michael@0:         return ((this.element != element) &&
michael@0:                 this.isContained(element) &&
michael@0:                 this.isAccepted(element) &&
michael@0:                 MochiKit.Position.within(this.element, point.page.x,
michael@0:                                                        point.page.y));
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.deactivate */
michael@0:     deactivate: function () {
michael@0:         /***
michael@0: 
michael@0:         A droppable is deactivate when a draggable has been over it and left.
michael@0: 
michael@0:         ***/
michael@0:         if (this.options.hoverclass) {
michael@0:             MochiKit.DOM.removeElementClass(this.element,
michael@0:                                             this.options.hoverclass);
michael@0:         }
michael@0:         this.options.hoverfunc(this.element, false);
michael@0:         MochiKit.DragAndDrop.Droppables.last_active = null;
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.activate */
michael@0:     activate: function () {
michael@0:         /***
michael@0: 
michael@0:         A droppable is active when a draggable is over it.
michael@0: 
michael@0:         ***/
michael@0:         if (this.options.hoverclass) {
michael@0:             MochiKit.DOM.addElementClass(this.element, this.options.hoverclass);
michael@0:         }
michael@0:         this.options.hoverfunc(this.element, true);
michael@0:         MochiKit.DragAndDrop.Droppables.last_active = this;
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.destroy */
michael@0:     destroy: function () {
michael@0:         /***
michael@0: 
michael@0:         Delete this droppable.
michael@0: 
michael@0:         ***/
michael@0:         MochiKit.DragAndDrop.Droppables.unregister(this);
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.repr */
michael@0:     repr: function () {
michael@0:         return '[' + this.__class__.NAME + ", options:" + MochiKit.Base.repr(this.options) + "]";
michael@0:     }
michael@0: };
michael@0: 
michael@0: MochiKit.DragAndDrop.Draggables = {
michael@0:     /***
michael@0: 
michael@0:     Manage draggables elements. Not intended to direct use.
michael@0: 
michael@0:     ***/
michael@0:     drags: [],
michael@0: 
michael@0:     register: function (draggable) {
michael@0:         if (this.drags.length === 0) {
michael@0:             var conn = MochiKit.Signal.connect;
michael@0:             this.eventMouseUp = conn(document, 'onmouseup', this, this.endDrag);
michael@0:             this.eventMouseMove = conn(document, 'onmousemove', this,
michael@0:                                        this.updateDrag);
michael@0:             this.eventKeypress = conn(document, 'onkeypress', this,
michael@0:                                       this.keyPress);
michael@0:         }
michael@0:         this.drags.push(draggable);
michael@0:     },
michael@0: 
michael@0:     unregister: function (draggable) {
michael@0:         this.drags = MochiKit.Base.filter(function (d) {
michael@0:             return d != draggable;
michael@0:         }, this.drags);
michael@0:         if (this.drags.length === 0) {
michael@0:             var disc = MochiKit.Signal.disconnect;
michael@0:             disc(this.eventMouseUp);
michael@0:             disc(this.eventMouseMove);
michael@0:             disc(this.eventKeypress);
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     activate: function (draggable) {
michael@0:         // allows keypress events if window is not currently focused
michael@0:         // fails for Safari
michael@0:         window.focus();
michael@0:         this.activeDraggable = draggable;
michael@0:     },
michael@0: 
michael@0:     deactivate: function () {
michael@0:         this.activeDraggable = null;
michael@0:     },
michael@0: 
michael@0:     updateDrag: function (event) {
michael@0:         if (!this.activeDraggable) {
michael@0:             return;
michael@0:         }
michael@0:         var pointer = event.mouse();
michael@0:         // Mozilla-based browsers fire successive mousemove events with
michael@0:         // the same coordinates, prevent needless redrawing (moz bug?)
michael@0:         if (this._lastPointer && (MochiKit.Base.repr(this._lastPointer.page) ==
michael@0:                                   MochiKit.Base.repr(pointer.page))) {
michael@0:             return;
michael@0:         }
michael@0:         this._lastPointer = pointer;
michael@0:         this.activeDraggable.updateDrag(event, pointer);
michael@0:     },
michael@0: 
michael@0:     endDrag: function (event) {
michael@0:         if (!this.activeDraggable) {
michael@0:             return;
michael@0:         }
michael@0:         this._lastPointer = null;
michael@0:         this.activeDraggable.endDrag(event);
michael@0:         this.activeDraggable = null;
michael@0:     },
michael@0: 
michael@0:     keyPress: function (event) {
michael@0:         if (this.activeDraggable) {
michael@0:             this.activeDraggable.keyPress(event);
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     notify: function (eventName, draggable, event) {
michael@0:         MochiKit.Signal.signal(this, eventName, draggable, event);
michael@0:     }
michael@0: };
michael@0: 
michael@0: /** @id MochiKit.DragAndDrop.Draggable */
michael@0: MochiKit.DragAndDrop.Draggable = function (element, options) {
michael@0:     var cls = arguments.callee;
michael@0:     if (!(this instanceof cls)) {
michael@0:         return new cls(element, options);
michael@0:     }
michael@0:     this.__init__(element, options);
michael@0: };
michael@0: 
michael@0: MochiKit.DragAndDrop.Draggable.prototype = {
michael@0:     /***
michael@0: 
michael@0:     A draggable object. Simple instantiate :
michael@0: 
michael@0:         new MochiKit.DragAndDrop.Draggable('myelement');
michael@0: 
michael@0:     ***/
michael@0:     __class__ : MochiKit.DragAndDrop.Draggable,
michael@0: 
michael@0:     __init__: function (element, /* optional */options) {
michael@0:         var v = MochiKit.Visual;
michael@0:         var b = MochiKit.Base;
michael@0:         options = b.update({
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.handle */
michael@0:             handle: false,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.starteffect */
michael@0:             starteffect: function (innerelement) {
michael@0:                 this._savedOpacity = MochiKit.Style.getStyle(innerelement, 'opacity') || 1.0;
michael@0:                 new v.Opacity(innerelement, {duration:0.2, from:this._savedOpacity, to:0.7});
michael@0:             },
michael@0:             /** @id MochiKit.DragAndDrop.reverteffect */
michael@0:             reverteffect: function (innerelement, top_offset, left_offset) {
michael@0:                 var dur = Math.sqrt(Math.abs(top_offset^2) +
michael@0:                           Math.abs(left_offset^2))*0.02;
michael@0:                 return new v.Move(innerelement,
michael@0:                             {x: -left_offset, y: -top_offset, duration: dur});
michael@0:             },
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.endeffect */
michael@0:             endeffect: function (innerelement) {
michael@0:                 new v.Opacity(innerelement, {duration:0.2, from:0.7, to:this._savedOpacity});
michael@0:             },
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.onchange */
michael@0:             onchange: b.noop,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.zindex */
michael@0:             zindex: 1000,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.revert */
michael@0:             revert: false,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.scroll */
michael@0:             scroll: false,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.scrollSensitivity */
michael@0:             scrollSensitivity: 20,
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.scrollSpeed */
michael@0:             scrollSpeed: 15,
michael@0:             // false, or xy or [x, y] or function (x, y){return [x, y];}
michael@0: 
michael@0:             /** @id MochiKit.DragAndDrop.snap */
michael@0:             snap: false
michael@0:         }, options || {});
michael@0: 
michael@0:         var d = MochiKit.DOM;
michael@0:         this.element = d.getElement(element);
michael@0: 
michael@0:         if (options.handle && (typeof(options.handle) == 'string')) {
michael@0:             this.handle = d.getFirstElementByTagAndClassName(null,
michael@0:                                        options.handle, this.element);
michael@0:         }
michael@0:         if (!this.handle) {
michael@0:             this.handle = d.getElement(options.handle);
michael@0:         }
michael@0:         if (!this.handle) {
michael@0:             this.handle = this.element;
michael@0:         }
michael@0: 
michael@0:         if (options.scroll && !options.scroll.scrollTo && !options.scroll.outerHTML) {
michael@0:             options.scroll = d.getElement(options.scroll);
michael@0:             this._isScrollChild = MochiKit.DOM.isChildNode(this.element, options.scroll);
michael@0:         }
michael@0: 
michael@0:         d.makePositioned(this.element);  // fix IE
michael@0: 
michael@0:         this.delta = this.currentDelta();
michael@0:         this.options = options;
michael@0:         this.dragging = false;
michael@0: 
michael@0:         this.eventMouseDown = MochiKit.Signal.connect(this.handle,
michael@0:                               'onmousedown', this, this.initDrag);
michael@0:         MochiKit.DragAndDrop.Draggables.register(this);
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.destroy */
michael@0:     destroy: function () {
michael@0:         MochiKit.Signal.disconnect(this.eventMouseDown);
michael@0:         MochiKit.DragAndDrop.Draggables.unregister(this);
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.currentDelta */
michael@0:     currentDelta: function () {
michael@0:         var s = MochiKit.Style.getStyle;
michael@0:         return [
michael@0:           parseInt(s(this.element, 'left') || '0'),
michael@0:           parseInt(s(this.element, 'top') || '0')];
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.initDrag */
michael@0:     initDrag: function (event) {
michael@0:         if (!event.mouse().button.left) {
michael@0:             return;
michael@0:         }
michael@0:         // abort on form elements, fixes a Firefox issue
michael@0:         var src = event.target();
michael@0:         var tagName = (src.tagName || '').toUpperCase();
michael@0:         if (tagName === 'INPUT' || tagName === 'SELECT' ||
michael@0:             tagName === 'OPTION' || tagName === 'BUTTON' ||
michael@0:             tagName === 'TEXTAREA') {
michael@0:             return;
michael@0:         }
michael@0: 
michael@0:         if (this._revert) {
michael@0:             this._revert.cancel();
michael@0:             this._revert = null;
michael@0:         }
michael@0: 
michael@0:         var pointer = event.mouse();
michael@0:         var pos = MochiKit.Position.cumulativeOffset(this.element);
michael@0:         this.offset = [pointer.page.x - pos.x, pointer.page.y - pos.y];
michael@0: 
michael@0:         MochiKit.DragAndDrop.Draggables.activate(this);
michael@0:         event.stop();
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.startDrag */
michael@0:     startDrag: function (event) {
michael@0:         this.dragging = true;
michael@0:         if (this.options.selectclass) {
michael@0:             MochiKit.DOM.addElementClass(this.element,
michael@0:                                          this.options.selectclass);
michael@0:         }
michael@0:         if (this.options.zindex) {
michael@0:             this.originalZ = parseInt(MochiKit.Style.getStyle(this.element,
michael@0:                                       'z-index') || '0');
michael@0:             this.element.style.zIndex = this.options.zindex;
michael@0:         }
michael@0: 
michael@0:         if (this.options.ghosting) {
michael@0:             this._clone = this.element.cloneNode(true);
michael@0:             this.ghostPosition = MochiKit.Position.absolutize(this.element);
michael@0:             this.element.parentNode.insertBefore(this._clone, this.element);
michael@0:         }
michael@0: 
michael@0:         if (this.options.scroll) {
michael@0:             if (this.options.scroll == window) {
michael@0:                 var where = this._getWindowScroll(this.options.scroll);
michael@0:                 this.originalScrollLeft = where.left;
michael@0:                 this.originalScrollTop = where.top;
michael@0:             } else {
michael@0:                 this.originalScrollLeft = this.options.scroll.scrollLeft;
michael@0:                 this.originalScrollTop = this.options.scroll.scrollTop;
michael@0:             }
michael@0:         }
michael@0: 
michael@0:         MochiKit.DragAndDrop.Droppables.prepare(this.element);
michael@0:         MochiKit.DragAndDrop.Draggables.notify('start', this, event);
michael@0:         if (this.options.starteffect) {
michael@0:             this.options.starteffect(this.element);
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.updateDrag */
michael@0:     updateDrag: function (event, pointer) {
michael@0:         if (!this.dragging) {
michael@0:             this.startDrag(event);
michael@0:         }
michael@0:         MochiKit.Position.prepare();
michael@0:         MochiKit.DragAndDrop.Droppables.show(pointer, this.element);
michael@0:         MochiKit.DragAndDrop.Draggables.notify('drag', this, event);
michael@0:         this.draw(pointer);
michael@0:         this.options.onchange(this);
michael@0: 
michael@0:         if (this.options.scroll) {
michael@0:             this.stopScrolling();
michael@0:             var p, q;
michael@0:             if (this.options.scroll == window) {
michael@0:                 var s = this._getWindowScroll(this.options.scroll);
michael@0:                 p = new MochiKit.Style.Coordinates(s.left, s.top);
michael@0:                 q = new MochiKit.Style.Coordinates(s.left + s.width,
michael@0:                                                    s.top + s.height);
michael@0:             } else {
michael@0:                 p = MochiKit.Position.page(this.options.scroll);
michael@0:                 p.x += this.options.scroll.scrollLeft;
michael@0:                 p.y += this.options.scroll.scrollTop;
michael@0:                 p.x += (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0);
michael@0:                 p.y += (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
michael@0:                 q = new MochiKit.Style.Coordinates(p.x + this.options.scroll.offsetWidth,
michael@0:                                                    p.y + this.options.scroll.offsetHeight);
michael@0:             }
michael@0:             var speed = [0, 0];
michael@0:             if (pointer.page.x > (q.x - this.options.scrollSensitivity)) {
michael@0:                 speed[0] = pointer.page.x - (q.x - this.options.scrollSensitivity);
michael@0:             } else if (pointer.page.x < (p.x + this.options.scrollSensitivity)) {
michael@0:                 speed[0] = pointer.page.x - (p.x + this.options.scrollSensitivity);
michael@0:             }
michael@0:             if (pointer.page.y > (q.y - this.options.scrollSensitivity)) {
michael@0:                 speed[1] = pointer.page.y - (q.y - this.options.scrollSensitivity);
michael@0:             } else if (pointer.page.y < (p.y + this.options.scrollSensitivity)) {
michael@0:                 speed[1] = pointer.page.y - (p.y + this.options.scrollSensitivity);
michael@0:             }
michael@0:             this.startScrolling(speed);
michael@0:         }
michael@0: 
michael@0:         // fix AppleWebKit rendering
michael@0:         if (/AppleWebKit'/.test(navigator.appVersion)) {
michael@0:             window.scrollBy(0, 0);
michael@0:         }
michael@0:         event.stop();
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.finishDrag */
michael@0:     finishDrag: function (event, success) {
michael@0:         var dr = MochiKit.DragAndDrop;
michael@0:         this.dragging = false;
michael@0:         if (this.options.selectclass) {
michael@0:             MochiKit.DOM.removeElementClass(this.element,
michael@0:                                             this.options.selectclass);
michael@0:         }
michael@0: 
michael@0:         if (this.options.ghosting) {
michael@0:             // XXX: from a user point of view, it would be better to remove
michael@0:             // the node only *after* the MochiKit.Visual.Move end when used
michael@0:             // with revert.
michael@0:             MochiKit.Position.relativize(this.element, this.ghostPosition);
michael@0:             MochiKit.DOM.removeElement(this._clone);
michael@0:             this._clone = null;
michael@0:         }
michael@0: 
michael@0:         if (success) {
michael@0:             dr.Droppables.fire(event, this.element);
michael@0:         }
michael@0:         dr.Draggables.notify('end', this, event);
michael@0: 
michael@0:         var revert = this.options.revert;
michael@0:         if (revert && typeof(revert) == 'function') {
michael@0:             revert = revert(this.element);
michael@0:         }
michael@0: 
michael@0:         var d = this.currentDelta();
michael@0:         if (revert && this.options.reverteffect) {
michael@0:             this._revert = this.options.reverteffect(this.element,
michael@0:                 d[1] - this.delta[1], d[0] - this.delta[0]);
michael@0:         } else {
michael@0:             this.delta = d;
michael@0:         }
michael@0: 
michael@0:         if (this.options.zindex) {
michael@0:             this.element.style.zIndex = this.originalZ;
michael@0:         }
michael@0: 
michael@0:         if (this.options.endeffect) {
michael@0:             this.options.endeffect(this.element);
michael@0:         }
michael@0: 
michael@0:         dr.Draggables.deactivate();
michael@0:         dr.Droppables.reset(this.element);
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.keyPress */
michael@0:     keyPress: function (event) {
michael@0:         if (event.key().string != "KEY_ESCAPE") {
michael@0:             return;
michael@0:         }
michael@0:         this.finishDrag(event, false);
michael@0:         event.stop();
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.endDrag */
michael@0:     endDrag: function (event) {
michael@0:         if (!this.dragging) {
michael@0:             return;
michael@0:         }
michael@0:         this.stopScrolling();
michael@0:         this.finishDrag(event, true);
michael@0:         event.stop();
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.draw */
michael@0:     draw: function (point) {
michael@0:         var pos = MochiKit.Position.cumulativeOffset(this.element);
michael@0:         var d = this.currentDelta();
michael@0:         pos.x -= d[0];
michael@0:         pos.y -= d[1];
michael@0: 
michael@0:         if (this.options.scroll && (this.options.scroll != window && this._isScrollChild)) {
michael@0:             pos.x -= this.options.scroll.scrollLeft - this.originalScrollLeft;
michael@0:             pos.y -= this.options.scroll.scrollTop - this.originalScrollTop;
michael@0:         }
michael@0: 
michael@0:         var p = [point.page.x - pos.x - this.offset[0],
michael@0:                  point.page.y - pos.y - this.offset[1]];
michael@0: 
michael@0:         if (this.options.snap) {
michael@0:             if (typeof(this.options.snap) == 'function') {
michael@0:                 p = this.options.snap(p[0], p[1]);
michael@0:             } else {
michael@0:                 if (this.options.snap instanceof Array) {
michael@0:                     var i = -1;
michael@0:                     p = MochiKit.Base.map(MochiKit.Base.bind(function (v) {
michael@0:                             i += 1;
michael@0:                             return Math.round(v/this.options.snap[i]) *
michael@0:                                    this.options.snap[i];
michael@0:                         }, this), p);
michael@0:                 } else {
michael@0:                     p = MochiKit.Base.map(MochiKit.Base.bind(function (v) {
michael@0:                         return Math.round(v/this.options.snap) *
michael@0:                                this.options.snap;
michael@0:                         }, this), p);
michael@0:                 }
michael@0:             }
michael@0:         }
michael@0:         var style = this.element.style;
michael@0:         if ((!this.options.constraint) ||
michael@0:             (this.options.constraint == 'horizontal')) {
michael@0:             style.left = p[0] + 'px';
michael@0:         }
michael@0:         if ((!this.options.constraint) ||
michael@0:             (this.options.constraint == 'vertical')) {
michael@0:             style.top = p[1] + 'px';
michael@0:         }
michael@0:         if (style.visibility == 'hidden') {
michael@0:             style.visibility = '';  // fix gecko rendering
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.stopScrolling */
michael@0:     stopScrolling: function () {
michael@0:         if (this.scrollInterval) {
michael@0:             clearInterval(this.scrollInterval);
michael@0:             this.scrollInterval = null;
michael@0:             MochiKit.DragAndDrop.Draggables._lastScrollPointer = null;
michael@0:         }
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.startScrolling */
michael@0:     startScrolling: function (speed) {
michael@0:         if (!speed[0] && !speed[1]) {
michael@0:             return;
michael@0:         }
michael@0:         this.scrollSpeed = [speed[0] * this.options.scrollSpeed,
michael@0:                             speed[1] * this.options.scrollSpeed];
michael@0:         this.lastScrolled = new Date();
michael@0:         this.scrollInterval = setInterval(MochiKit.Base.bind(this.scroll, this), 10);
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.scroll */
michael@0:     scroll: function () {
michael@0:         var current = new Date();
michael@0:         var delta = current - this.lastScrolled;
michael@0:         this.lastScrolled = current;
michael@0: 
michael@0:         if (this.options.scroll == window) {
michael@0:             var s = this._getWindowScroll(this.options.scroll);
michael@0:             if (this.scrollSpeed[0] || this.scrollSpeed[1]) {
michael@0:                 var dm = delta / 1000;
michael@0:                 this.options.scroll.scrollTo(s.left + dm * this.scrollSpeed[0],
michael@0:                                              s.top + dm * this.scrollSpeed[1]);
michael@0:             }
michael@0:         } else {
michael@0:             this.options.scroll.scrollLeft += this.scrollSpeed[0] * delta / 1000;
michael@0:             this.options.scroll.scrollTop += this.scrollSpeed[1] * delta / 1000;
michael@0:         }
michael@0: 
michael@0:         var d = MochiKit.DragAndDrop;
michael@0: 
michael@0:         MochiKit.Position.prepare();
michael@0:         d.Droppables.show(d.Draggables._lastPointer, this.element);
michael@0:         d.Draggables.notify('drag', this);
michael@0:         if (this._isScrollChild) {
michael@0:             d.Draggables._lastScrollPointer = d.Draggables._lastScrollPointer || d.Draggables._lastPointer;
michael@0:             d.Draggables._lastScrollPointer.x += this.scrollSpeed[0] * delta / 1000;
michael@0:             d.Draggables._lastScrollPointer.y += this.scrollSpeed[1] * delta / 1000;
michael@0:             if (d.Draggables._lastScrollPointer.x < 0) {
michael@0:                 d.Draggables._lastScrollPointer.x = 0;
michael@0:             }
michael@0:             if (d.Draggables._lastScrollPointer.y < 0) {
michael@0:                 d.Draggables._lastScrollPointer.y = 0;
michael@0:             }
michael@0:             this.draw(d.Draggables._lastScrollPointer);
michael@0:         }
michael@0: 
michael@0:         this.options.onchange(this);
michael@0:     },
michael@0: 
michael@0:     _getWindowScroll: function (win) {
michael@0:         var vp, w, h;
michael@0:         MochiKit.DOM.withWindow(win, function () {
michael@0:             vp = MochiKit.Style.getViewportPosition(win.document);
michael@0:         });
michael@0:         if (win.innerWidth) {
michael@0:             w = win.innerWidth;
michael@0:             h = win.innerHeight;
michael@0:         } else if (win.document.documentElement && win.document.documentElement.clientWidth) {
michael@0:             w = win.document.documentElement.clientWidth;
michael@0:             h = win.document.documentElement.clientHeight;
michael@0:         } else {
michael@0:             w = win.document.body.offsetWidth;
michael@0:             h = win.document.body.offsetHeight;
michael@0:         }
michael@0:         return {top: vp.x, left: vp.y, width: w, height: h};
michael@0:     },
michael@0: 
michael@0:     /** @id MochiKit.DragAndDrop.repr */
michael@0:     repr: function () {
michael@0:         return '[' + this.__class__.NAME + ", options:" + MochiKit.Base.repr(this.options) + "]";
michael@0:     }
michael@0: };
michael@0: 
michael@0: MochiKit.DragAndDrop.__new__ = function () {
michael@0:     MochiKit.Base.nameFunctions(this);
michael@0: 
michael@0:     this.EXPORT_TAGS = {
michael@0:         ":common": this.EXPORT,
michael@0:         ":all": MochiKit.Base.concat(this.EXPORT, this.EXPORT_OK)
michael@0:     };
michael@0: };
michael@0: 
michael@0: MochiKit.DragAndDrop.__new__();
michael@0: 
michael@0: MochiKit.Base._exportSymbols(this, MochiKit.DragAndDrop);
michael@0: