Changeset 501

Show
Ignore:
Timestamp:
01/14/06 12:53:42 (3 years ago)
Author:
therve@gmail.com
Message:

Refactor DragAndDrop adding a Droppable object.

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved
  • mochikit/branches/scriptaculous/MochiKit/DragAndDrop.js

    r498 r501  
    3131    }, 
    3232 
    33     add: function (element, options) { 
    34         element = MochiKit.DOM.getElement(element); 
    35         options = MochiKit.Base.update({ 
     33    register: function (drop) { 
     34        this.drops.push(drop); 
     35    }, 
     36 
     37    prepare: function (element) { 
     38        MochiKit.Iter.forEach(this.drops, function (drop) { 
     39            if (drop.isAccepted(element)) { 
     40                if (drop.options.activeclass) { 
     41                    MochiKit.DOM.addElementClass(drop.element, 
     42                                                 drop.options.activeclass); 
     43                } 
     44            } 
     45        }); 
     46    }, 
     47 
     48    show: function (point, element) { 
     49        if (!this.drops.length) { 
     50            return; 
     51        } 
     52 
     53        if (this.last_active) { 
     54            this.last_active.deactivate(); 
     55        } 
     56        MochiKit.Iter.forEach(this.drops, function (drop) { 
     57            if (drop.isAffected(point, element)) { 
     58                if (drop.options.onHover) { 
     59                    drop.options.onHover(element, drop.element, 
     60                       MochiKit.Position.overlap(drop.options.overlap, 
     61                                                 drop.element)); 
     62                } 
     63                if (drop.options.greedy) { 
     64                    drop.activate(); 
     65                    throw MochiKit.Iter.StopIteration; 
     66                } 
     67            } 
     68        }); 
     69    }, 
     70 
     71    fire: function (event, element) { 
     72        if (!this.last_active) { 
     73            return; 
     74        } 
     75        MochiKit.Position.prepare(); 
     76 
     77        if (this.last_active.isAffected([MochiKit.Event.pointerX(event), 
     78                MochiKit.Event.pointerY(event)], element)) { 
     79            if (this.last_active.options.onDrop) { 
     80                this.last_active.options.onDrop(element, 
     81                   this.last_active.element, event); 
     82            } 
     83        } 
     84    }, 
     85 
     86    reset: function () { 
     87        MochiKit.Iter.forEach(this.drops, function (drop) { 
     88            if (drop.options.activeclass) { 
     89                MochiKit.DOM.removeElementClass(drop.element, 
     90                                                drop.options.activeclass); 
     91            } 
     92        }); 
     93        if (this.last_active) { 
     94            this.last_active.deactivate(); 
     95        } 
     96    } 
     97}; 
     98 
     99DragAndDrop.Droppable = function (element, options) { 
     100    this.__init__(element, options); 
     101}; 
     102 
     103DragAndDrop.Droppable.prototype = { 
     104    __init__: function (element, options) { 
     105        this.element = MochiKit.DOM.getElement(element); 
     106        this.options = MochiKit.Base.update({ 
    36107            greedy: true, 
    37108            hoverclass: null, 
     
    40111 
    41112        // cache containers 
    42         if (options.containment) { 
    43             options._containers = []; 
    44             var containment = options.containment; 
     113        if (this.options.containment) { 
     114            this.options._containers = []; 
     115            var containment = this.options.containment; 
    45116            if ((typeof containment == 'object') && 
    46117                (containment.constructor == Array)) { 
    47118                MochiKit.Iter.forEach(containment, function (c) { 
    48                     options._containers.push(MochiKit.DOM.getElement(c)); 
     119                    this.options._containers.push(MochiKit.DOM.getElement(c)); 
    49120                }); 
    50121            } else { 
    51                 options._containers.push(MochiKit.DOM.getElement(containment)); 
    52             } 
    53         } 
    54  
    55         if (options.accept) { 
    56             options.accept = MochiKit.Iter.flatten([options.accept]); 
    57         } 
    58  
    59         MochiKit.DOM.makePositioned(element); // fix IE 
    60         options.element = element; 
    61  
    62         this.drops.push(options); 
    63     }, 
    64  
    65     isContained: function (element, drop) { 
     122                this.options._containers.push(MochiKit.DOM.getElement(containment)); 
     123            } 
     124        } 
     125 
     126        if (this.options.accept) { 
     127            this.options.accept = MochiKit.Iter.flatten([this.options.accept]); 
     128        } 
     129 
     130        MochiKit.DOM.makePositioned(this.element); // fix IE 
     131 
     132        DragAndDrop.Droppables.register(this); 
     133    }, 
     134 
     135    isContained: function (element) { 
    66136        var parentNode = element.parentNode; 
    67         return MochiKit.Iter.some(drop._containers, function (c) { 
     137        return MochiKit.Iter.some(this._containers, function (c) { 
    68138            return parentNode == c; 
    69139        }); 
    70140    }, 
    71141 
    72     isAccepted: function (element, drop) { 
    73         return ((!drop.accept) || MochiKit.Iter.some(drop.accept, function (d) { 
     142    isAccepted: function (element) { 
     143        return ((!this.accept) || MochiKit.Iter.some(this.accept, function (d) { 
    74144            return MochiKit.Iter.some(element.className.split(' '), 
    75145            function (c) { 
     
    79149    }, 
    80150 
    81     isAffected: function (point, element, drop) { 
     151    isAffected: function (point, element) { 
    82152        return ( 
    83             (drop.element != element) && 
    84             ((!drop._containers) || this.isContained(element, drop)) && 
    85             (this.isAccepted(drop, element)) && 
    86             MochiKit.Position.within(drop.element, point[0], point[1])); 
    87     }, 
    88  
    89     deactivate: function (drop) { 
    90         if (drop.hoverclass) { 
    91             MochiKit.DOM.removeElementClass(drop.element, drop.hoverclass); 
    92         } 
    93         this.last_active = null; 
    94     }, 
    95  
    96     activate: function (drop) { 
    97         if (drop.hoverclass) { 
    98             MochiKit.DOM.addElementClass(drop.element, drop.hoverclass); 
    99         } 
    100         this.last_active = drop; 
    101     }, 
    102  
    103     prepare: function (element) { 
    104         MochiKit.Iter.forEach(this.drops, function (drop) { 
    105             if (DragAndDrop.Droppables.isAccepted(element, drop)) { 
    106                 if (drop.activeclass) { 
    107                     MochiKit.DOM.addElementClass(drop.element, drop.activeclass); 
    108                 } 
    109             } 
    110         }); 
    111     }, 
    112  
    113     show: function (point, element) { 
    114         if (!this.drops.length) { 
    115             return; 
    116         } 
    117  
    118         if (this.last_active) { 
    119             this.deactivate(this.last_active); 
    120         } 
    121         MochiKit.Iter.forEach(this.drops, function (drop) { 
    122             if (DragAndDrop.Droppables.isAffected(point, element, drop)) { 
    123                 if (drop.onHover) { 
    124                     drop.onHover(element, drop.element, 
    125                        MochiKit.Position.overlap(drop.overlap, drop.element)); 
    126                 } 
    127                 if (drop.greedy) { 
    128                     DragAndDrop.Droppables.activate(drop); 
    129                     throw MochiKit.Iter.StopIteration; 
    130                 } 
    131             } 
    132         }); 
    133     }, 
    134  
    135     fire: function (event, element) { 
    136         if (!this.last_active) { 
    137             return; 
    138         } 
    139         MochiKit.Position.prepare(); 
    140  
    141         if (this.isAffected([MochiKit.Event.pointerX(event), 
    142                 MochiKit.Event.pointerY(event)], element, this.last_active)) { 
    143             if (this.last_active.onDrop) { 
    144                 this.last_active.onDrop(element, this.last_active.element, 
    145                                         event); 
    146             } 
    147         } 
    148     }, 
    149  
    150     reset: function () { 
    151         MochiKit.Iter.forEach(this.drops, function (drop) { 
    152             if (drop.activeclass) { 
    153                 MochiKit.DOM.removeElementClass(drop.element, drop.activeclass); 
    154             } 
    155         }); 
    156         if (this.last_active) { 
    157             this.deactivate(this.last_active); 
    158         } 
     153            (this.element != element) && 
     154            ((!this._containers) || this.isContained(element)) && 
     155            (this.isAccepted(element)) && 
     156            MochiKit.Position.within(this.element, point[0], point[1])); 
     157    }, 
     158 
     159    deactivate: function () { 
     160        if (this.options.hoverclass) { 
     161            MochiKit.DOM.removeElementClass(this.element, this.options.hoverclass); 
     162        } 
     163        DragAndDrop.Droppables.last_active = null; 
     164    }, 
     165 
     166    activate: function () { 
     167        if (this.options.hoverclass) { 
     168            MochiKit.DOM.addElementClass(this.element, this.options.hoverclass); 
     169        } 
     170        DragAndDrop.Droppables.last_active = this; 
    159171    } 
    160172}; 
     
    567579    create: function (element, options) { 
    568580        element = MochiKit.DOM.getElement(element); 
    569         options = MochiKit.Base.update( 
    570         { 
     581        options = MochiKit.Base.update({ 
    571582            element: element, 
    572583            tag: 'li',  // assumes li children, override with tag: 'tagname' 
     
    602613 
    603614        if (options.reverteffect) { 
    604           options_for_draggable.reverteffect = options.reverteffect; 
     615            options_for_draggable.reverteffect = options.reverteffect; 
    605616        } else if (options.ghosting) { 
    606617            options_for_draggable.reverteffect = function (element) { 
     
    637648        // drop on empty handling 
    638649        if (options.dropOnEmpty) { 
    639             DragAndDrop.Droppables.add(element, 
     650            new DragAndDrop.Droppable(element, 
    640651            {containment: options.containment, 
    641652             onHover: Sortable.onEmptyHover, 
     
    653664                    MochiKit.Base.update(options_for_draggable, 
    654665                                         {handle: handle}))); 
    655             DragAndDrop.Droppables.add(e, options_for_droppable); 
     666            new DragAndDrop.Droppable(e, options_for_droppable); 
    656667            options.droppables.push(e); 
    657668        }); 
  • mochikit/branches/scriptaculous/MochiKit/Effects.js

    r500 r501  
    750750    element = MochiKit.DOM.getElement(element); 
    751751    MochiKit.DOM.cleanWhitespace(element); 
    752     // SlideDown need to have the content of the element wrapped in a container element with fixed height! 
     752    // SlideDown need to have the content of the element wrapped in 
     753    // a container element with fixed height! 
    753754    var oldInnerBottom = MochiKit.DOM.getStyle(element.firstChild, 'bottom'); 
    754755    var elementDimensions = MochiKit.DOM.elementDimensions(element); 
  • mochikit/branches/scriptaculous/MochiKit/New.js

    r500 r501  
    202202            element._madePositioned = true; 
    203203            element.style.position = 'relative'; 
    204             // Opera returns the offset relative to the positioning context, when an 
    205             // element is position relative but top and left have not been defined 
     204            // Opera returns the offset relative to the positioning context, 
     205            // when an element is position relative but top and left have 
     206            // not been defined 
    206207            if (MochiKit.Base.isOpera()) { 
    207208                element.style.top = 0; 
     
    377378 
    378379        element.style.position = 'relative'; 
    379         var top = parseFloat(element.style.top || 0) - (element._originalTop || 0); 
    380         var left = parseFloat(element.style.left || 0) - (element._originalLeft || 0); 
     380        var top = parseFloat(element.style.top || 0) - 
     381                  (element._originalTop || 0); 
     382        var left = parseFloat(element.style.left || 0) - 
     383                   (element._originalLeft || 0); 
    381384 
    382385        element.style.top = top + 'px'; 
     
    400403MochiKit.Event = { 
    401404    KEY_BACKSPACE: 8, 
    402     KEY_TAB:       9, 
    403     KEY_RETURN:   13, 
    404     KEY_ESC:      27, 
    405     KEY_LEFT:     37, 
    406     KEY_UP:       38, 
    407     KEY_RIGHT:    39, 
    408     KEY_DOWN:     40, 
    409     KEY_DELETE:   46, 
     405    KEY_TAB: 9, 
     406    KEY_RETURN: 13, 
     407    KEY_ESC: 27, 
     408    KEY_LEFT: 37, 
     409    KEY_UP: 38, 
     410    KEY_RIGHT: 39, 
     411    KEY_DOWN: 40, 
     412    KEY_DELETE: 46, 
    410413 
    411414    element: function (event) { 
     
    678681}; 
    679682 
    680 Ajax.Request.Events = ['Uninitialized', 'Loading', 'Loaded', 'Interactive', 'Complete']; 
     683Ajax.Request.Events = ['Uninitialized', 'Loading', 'Loaded', 
     684                       'Interactive', 'Complete']; 
    681685 
    682686MochiKit.Base.update(Ajax.Request.prototype, Ajax.Base.prototype); 
     
    702706            Ajax.Responders.dispatch('onCreate', this, this.transport); 
    703707 
    704             this.transport.open(this.options.method, this.url, this.options.asynchronous); 
     708            this.transport.open(this.options.method, this.url, 
     709                                this.options.asynchronous); 
    705710 
    706711            if (this.options.asynchronous) { 
     
    717722 
    718723        } catch (e) { 
    719                this.dispatchException(e); 
     724            this.dispatchException(e); 
    720725        } 
    721726    }, 
     
    725730 
    726731        if (this.options.method == 'post') { 
    727             requestHeaders.push('Content-type', 'application/x-www-form-urlencoded'); 
     732            requestHeaders.push('Content-type', 
     733                                'application/x-www-form-urlencoded'); 
    728734 
    729735            /* Force 'Connection: close' for Mozilla browsers to work around 
    730              * a bug where XMLHttpReqeuest sends an incorrect Content-length 
     736             * a bug where XMLHttpRequest sends an incorrect Content-length 
    731737             * header. See Mozilla Bugzilla #246651. 
    732738             */ 
     
    847853                new this.options.insertion(receiver, response); 
    848854            } else { 
    849                 MochiKit.DOM.getElement(receiver).innerHTML = MochiKit.Base.stripScripts(response); 
     855                MochiKit.DOM.getElement(receiver).innerHTML = 
     856                    MochiKit.Base.stripScripts(response); 
    850857                setTimeout(function() { 
    851858                    MochiKit.Base.evalScripts(response);