Ruby on Rails | Screencasts | Download | Documentation | Weblog | Community | Source

Ticket #5518: adjust_scrolling_offsets.diff

File adjust_scrolling_offsets.diff, 8.1 kB (added by tsukue@gmail.com, 2 years ago)

patch to dragdrop.js

  • dragdrop.js

    old new  
    6161  }, 
    6262   
    6363  isAffected: function(point, element, drop) { 
     64    Position.prepare(); 
    6465    return ( 
    6566      (drop.element!=element) && 
    6667      ((!drop._containers) || 
     
    6869      ((!drop.accept) || 
    6970        (Element.classNames(element).detect(  
    7071          function(v) { return drop.accept.include(v) } ) )) && 
    71       Position.within(drop.element, point[0], point[1]) ); 
     72      Position.withinIncludingScrolloffsets(drop.element, point[0], point[1]) ); 
    7273  }, 
    7374 
    7475  deactivate: function(drop) { 
     
    8384    this.last_active = drop; 
    8485  }, 
    8586 
    86   show: function(point, element) { 
     87  show: function(point, draggingObj) { 
     88    var element = draggingObj.element; 
    8789    if(!this.drops.length) return; 
    8890    var affected = []; 
    8991     
     
    9496    }); 
    9597         
    9698    if(affected.length>0) { 
     99      Position.prepare(); 
    97100      drop = Droppables.findDeepestChild(affected); 
    98       Position.within(drop.element, point[0], point[1]); 
     101      Position.withinIncludingScrolloffsets(drop.element, point[0], point[1]); 
    99102      if(drop.onHover) 
    100         drop.onHover(element, drop.element, Position.overlap(drop.overlap, drop.element)); 
     103        drop.onHover(draggingObj, drop.element, Position.overlap(drop.overlap, drop.element)); 
    101104       
    102105      Droppables.activate(drop); 
    103106    } 
     
    282285      var pointer = [Event.pointerX(event), Event.pointerY(event)]; 
    283286      var pos     = Position.cumulativeOffset(this.element); 
    284287      this.offset = [0,1].map( function(i) { return (pointer[i] - pos[i]) }); 
    285        
     288      this.scrollOffset = Position.realOffset(this.element); 
     289 
    286290      Draggables.activate(this); 
    287291      Event.stop(event); 
    288292    } 
    289293  }, 
    290294   
    291   startDrag: function(event) { 
     295   startDrag: function(event) { 
    292296    this.dragging = true; 
    293      
     297 
    294298    if(this.options.zindex) { 
    295299      this.originalZ = parseInt(Element.getStyle(this.element,'z-index') || 0); 
    296300      this.element.style.zIndex = this.options.zindex; 
     
    298302     
    299303    if(this.options.ghosting) { 
    300304      this._clone = this.element.cloneNode(true); 
    301       Position.absolutize(this.element); 
     305      Position.absolutize(this.element);  
    302306      this.element.parentNode.insertBefore(this._clone, this.element); 
    303307    } 
    304308     
     
    312316        this.originalScrollTop = this.options.scroll.scrollTop; 
    313317      } 
    314318    } 
    315      
     319 
    316320    Draggables.notify('onStart', this, event); 
    317321    if(this.options.starteffect) this.options.starteffect(this.element); 
    318322  }, 
     
    320324  updateDrag: function(event, pointer) { 
    321325    if(!this.dragging) this.startDrag(event); 
    322326    Position.prepare(); 
    323     Droppables.show(pointer, this.element); 
     327    Droppables.show(pointer, this); 
    324328    Draggables.notify('onDrag', this, event); 
    325329    this.draw(pointer); 
    326330    if(this.options.change) this.options.change(this); 
     
    329333      this.stopScrolling(); 
    330334       
    331335      var p; 
     336      var do_scroll = false; 
    332337      if (this.options.scroll == window) { 
    333338        with(this._getWindowScroll(this.options.scroll)) { p = [ left, top, left+width, top+height ]; } 
    334       } else { 
     339        do_scroll = true; 
     340      } else if (this.element.parentNode && this.options.scroll == this.element.parentNode) { 
    335341        p = Position.page(this.options.scroll); 
    336342        p[0] += this.options.scroll.scrollLeft; 
    337343        p[1] += this.options.scroll.scrollTop; 
    338344        p.push(p[0]+this.options.scroll.offsetWidth); 
    339345        p.push(p[1]+this.options.scroll.offsetHeight); 
     346        do_scroll = true; 
    340347      } 
    341       var speed = [0,0]; 
    342       if(pointer[0] < (p[0]+this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[0]+this.options.scrollSensitivity); 
    343       if(pointer[1] < (p[1]+this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[1]+this.options.scrollSensitivity); 
    344       if(pointer[0] > (p[2]-this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[2]-this.options.scrollSensitivity); 
    345       if(pointer[1] > (p[3]-this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[3]-this.options.scrollSensitivity); 
    346       this.startScrolling(speed); 
     348 
     349      if (do_scroll) { 
     350        var speed = [0,0]; 
     351        if(pointer[0] < (p[0]+this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[0]+this.options.scrollSensitivity); 
     352        if(pointer[1] < (p[1]+this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[1]+this.options.scrollSensitivity); 
     353        if(pointer[0] > (p[2]-this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[2]-this.options.scrollSensitivity); 
     354        if(pointer[1] > (p[3]-this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[3]-this.options.scrollSensitivity); 
     355        this.startScrolling(speed); 
     356      } 
    347357    } 
    348358     
    349359    // fix AppleWebKit rendering 
     
    402412    var pos = Position.cumulativeOffset(this.element); 
    403413    var d = this.currentDelta(); 
    404414    pos[0] -= d[0]; pos[1] -= d[1]; 
    405      
     415 
    406416    if(this.options.scroll && (this.options.scroll != window)) { 
    407417      pos[0] -= this.options.scroll.scrollLeft-this.originalScrollLeft; 
    408418      pos[1] -= this.options.scroll.scrollTop-this.originalScrollTop; 
     
    432442      style.top  = p[1] + "px"; 
    433443    if(style.visibility=="hidden") style.visibility = ""; // fix gecko rendering 
    434444  }, 
    435    
     445 
     446   adjustScrollOffset: function()  { 
     447    var newScrollOffset = Position.realOffset(this.element); 
     448    [0,1].each(function(i) { 
     449       if (this.scrollOffset[i] != newScrollOffset[i]) { 
     450         this.offset[i] += this.scrollOffset[i] - newScrollOffset[i]; 
     451         this.scrollOffset[i] = newScrollOffset[i]; 
     452       } 
     453    }.bind(this)); 
     454   }, 
     455 
    436456  stopScrolling: function() { 
    437457    if(this.scrollInterval) { 
    438458      clearInterval(this.scrollInterval); 
     
    463483      this.options.scroll.scrollLeft += this.scrollSpeed[0] * delta / 1000; 
    464484      this.options.scroll.scrollTop  += this.scrollSpeed[1] * delta / 1000; 
    465485    } 
    466      
     486 
     487    this.scrollOffset = Position.realOffset(this.element); 
     488 
    467489    Position.prepare(); 
    468     Droppables.show(Draggables._lastPointer, this.element); 
     490    Droppables.show(Draggables._lastPointer, this); 
    469491    Draggables.notify('onDrag', this); 
    470492    Draggables._lastScrollPointer = Draggables._lastScrollPointer || $A(Draggables._lastPointer); 
    471493    Draggables._lastScrollPointer[0] += this.scrollSpeed[0] * delta / 1000; 
     
    673695      element, options.only, options.tree ? true : false, options.treeTag); 
    674696  }, 
    675697 
    676   onHover: function(element, dropon, overlap) { 
     698  onHover: function(draggingObj, dropon, overlap) { 
     699    var element = draggingObj.element; 
    677700    if(Element.isParent(dropon, element)) return; 
    678701 
    679702    if(overlap > .33 && overlap < .66 && Sortable.options(dropon).tree) { 
    680703      return; 
    681     } else if(overlap>0.5) { 
     704    } else if (overlap>0.5) { 
    682705      Sortable.mark(dropon, 'before'); 
    683706      if(dropon.previousSibling != element) { 
    684707        var oldParentNode = element.parentNode; 
    685708        element.style.visibility = "hidden"; // fix gecko rendering 
    686709        dropon.parentNode.insertBefore(element, dropon); 
     710        draggingObj.adjustScrollOffset(); 
    687711        if(dropon.parentNode!=oldParentNode)  
    688712          Sortable.options(oldParentNode).onChange(element); 
    689713        Sortable.options(dropon.parentNode).onChange(element); 
     
    695719        var oldParentNode = element.parentNode; 
    696720        element.style.visibility = "hidden"; // fix gecko rendering 
    697721        dropon.parentNode.insertBefore(element, nextElement); 
     722        draggingObj.adjustScrollOffset(); 
    698723        if(dropon.parentNode!=oldParentNode)  
    699724          Sortable.options(oldParentNode).onChange(element); 
    700725        Sortable.options(dropon.parentNode).onChange(element); 
     
    702727    } 
    703728  }, 
    704729   
    705   onEmptyHover: function(element, dropon, overlap) { 
     730  onEmptyHover: function(draggingObj, dropon, overlap) { 
     731    var element = draggingObj.element; 
    706732    var oldParentNode = element.parentNode; 
    707733    var droponOptions = Sortable.options(dropon); 
    708734         
     
    729755      } 
    730756       
    731757      dropon.insertBefore(element, child); 
    732        
     758      draggingObj.adjustScrollOffset();       
    733759      Sortable.options(oldParentNode).onChange(element); 
    734760      droponOptions.onChange(element); 
    735761    }