dragdrop.js

ZK 基础介绍 功能操作 模块 结合数据库操作

      var pointer = [Event.pointerX(event), Event.pointerY(event)];
//Tom M. Yeh, Potix: give the element a chance to ignore dragging
if (this.options.ignoredrag && this.options.ignoredrag(this.element, pointer))
	return;
//Tom M. Yeh, Potix: disable selection
//zk.disableSelection(document.body); // Bug #1820433
      var pos     = Position.cumulativeOffset(this.element);
      this.offset = [0,1].map( function(i) { return (pointer[i] - pos[i]) });
      
      Draggables.activate(this);
      Event.stop(event);
//Tom M. Yeh, Potix: mousedown is eaten above
zkau.autoZIndex(src, false, true);
    }
  },
  
  startDrag: function(event) {
//Tom M. Yeh, Potix: disable selection
zk.disableSelection(document.body); // Bug #1820433
  
    this.dragging = true;
    
    if(this.options.ghosting) {
//Tom M. Yeh, Potix: ghosting is controllable
var ghosting = true;
if (typeof this.options.ghosting == 'function') ghosting = this.options.ghosting(this, true);
if (ghosting) {
      this._clone = this.element.cloneNode(true);
this.z_orgpos = this.element.style.position; //Tom M. Yeh, Potix: Bug 1514789
if (this.z_orgpos != 'absolute')
      Position.absolutize(this.element);
      this.element.parentNode.insertBefore(this._clone, this.element);
}
    }
    
    if(this.options.zindex) { //Tom M. Yeh, Poitx: after ghosting
      this.originalZ = $int(Element.getStyle(this.element,'z-index'));
      this.element.style.zIndex = this.options.zindex;
    }
    
    if(this.options.scroll) {
      if (this.options.scroll == window) {
        var where = this._getWindowScroll(this.options.scroll);
        this.originalScrollLeft = where.left;
        this.originalScrollTop = where.top;
      } else {
        this.originalScrollLeft = this.options.scroll.scrollLeft;
        this.originalScrollTop = this.options.scroll.scrollTop;
      }
    }
    
    Draggables.notify('onStart', this, event);
        
    if(this.options.starteffect) this.options.starteffect(this.element);
  },
  
  updateDrag: function(event, pointer) {
    if(!this.dragging) this.startDrag(event);
    Position.prepare();
/* Tom M. Yeh, Potix: remove unused codes
    Droppables.show(pointer, this.element);
*/
    Draggables.notify('onDrag', this, event);
    
    this.draw(pointer);
    if(this.options.change) this.options.change(this, pointer); //Tom M Yeh, Potix: add pointer
    
    if(this.options.scroll) {
      this.stopScrolling();
      
      var p;
      if (this.options.scroll == window) {
        with(this._getWindowScroll(this.options.scroll)) { p = [ left, top, left+width, top+height ]; }
      } else {
        p = Position.page(this.options.scroll);
        p[0] += this.options.scroll.scrollLeft + Position.deltaX;
        p[1] += this.options.scroll.scrollTop + Position.deltaY;
        p.push(p[0]+this.options.scroll.offsetWidth);
        p.push(p[1]+this.options.scroll.offsetHeight);
      }
      var speed = [0,0];
      if(pointer[0] < (p[0]+this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[0]+this.options.scrollSensitivity);
      if(pointer[1] < (p[1]+this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[1]+this.options.scrollSensitivity);
      if(pointer[0] > (p[2]-this.options.scrollSensitivity)) speed[0] = pointer[0]-(p[2]-this.options.scrollSensitivity);
      if(pointer[1] > (p[3]-this.options.scrollSensitivity)) speed[1] = pointer[1]-(p[3]-this.options.scrollSensitivity);
      this.startScrolling(speed);
    }
    
    // fix AppleWebKit rendering
    if(navigator.appVersion.indexOf('AppleWebKit')>0) window.scrollBy(0,0);
    
    Event.stop(event);
  },
  
  finishDrag: function(event, success) {
    this.dragging = false;

//Tom M. Yeh, Potix: enable selection back and clear selection if any
zk.enableSelection(document.body);
setTimeout("zk.clearSelection()", 0);
    if(this.options.ghosting) {
//Tom M. Yeh: Potix: ghosting is controllable
var ghosting = true;
if (typeof this.options.ghosting == 'function') ghosting = this.options.ghosting(this, false);
if (ghosting) {
if (this.z_orgpos != "absolute") { //Tom M. Yeh, Potix: Bug 1514789
      Position.relativize(this.element);
this.element.style.position = this.z_orgpos;
}
      Element.remove(this._clone);
      this._clone = null;
}
    }

/* Tom M. Yeh, Potix: remove unused codes
    if(success) Droppables.fire(event, this.element);
*/
    Draggables.notify('onEnd', this, event);

	var pointer = [Event.pointerX(event), Event.pointerY(event)]; //Tom M. Yeh, Potix: add pointer
    var revert = this.options.revert;
    if(revert && typeof revert == 'function') revert = revert(this.element, pointer); //Tom M. Yeh, Potix: add pointer
    
    var d = this.currentDelta();
    if(revert && this.options.reverteffect) {
      this.options.reverteffect(this.element, 
        d[1]-this.delta[1], d[0]-this.delta[0]);
    } else {
      this.delta = d;
    }

    if(this.options.zindex)
      this.element.style.zIndex = this.originalZ;

    if(this.options.endeffect) 
      this.options.endeffect(this.element, event); //Tom M. Yeh, Potix: add event
      
    Draggables.deactivate(this);
/* Tom M. Yeh, Potix: remove unused codes
    Droppables.reset();
*/
  },
  
  keyPress: function(event) {
    if(event.keyCode!=27/*Tom M. Yeh, Potix:Event.KEY_ESC*/) return;
    this.finishDrag(event, false);
    Event.stop(event);
  },
  
  endDrag: function(event) {
    if(!this.dragging) return;
    this.stopScrolling();
    this.finishDrag(event, true);
    Event.stop(event);
  },
  
  draw: function(point) {
    var pos = Position.cumulativeOffset(this.element);
    if(this.options.ghosting) {
      var r   = Position.realOffset(this.element);
      pos[0] += r[0] - Position.deltaX; pos[1] += r[1] - Position.deltaY;
    }
    
    var d = this.currentDelta();
    pos[0] -= d[0]; pos[1] -= d[1];
    
    if(this.options.scroll && (this.options.scroll != window && this._isScrollChild)) {
      pos[0] -= this.options.scroll.scrollLeft-this.originalScrollLeft;
      pos[1] -= this.options.scroll.scrollTop-this.originalScrollTop;
    }
    
    var p = [0,1].map(function(i){ 
      return (point[i]-pos[i]-this.offset[i]) 
    }.bind(this));
    
    if(this.options.snap) {
      if(typeof this.options.snap == 'function') {
        p = this.options.snap(p[0],p[1],this);
      } else {
      if(this.options.snap instanceof Array) {
        p = p.map( function(v, i) {
          return Math.round(v/this.options.snap[i])*this.options.snap[i] }.bind(this))
      } else {
        p = p.map( function(v) {
          return Math.round(v/this.options.snap)*this.options.snap }.bind(this))
      }
    }}
    
//Tom M. Yeh, Potix: resolve scrolling offset when DIV is used
if (this.z_scrl) {
	p[0] -= this.z_scrl[0]; p[1] -= this.z_scrl[1];
}

    var style = this.element.style;
//Tom M. Yeh, Potix: support function constraint
if (typeof this.options.constraint == 'function') {
	var np = this.options.constraint(this, p); //return null or [newx, newy]
	if (np) p = np;
	style.left = p[0] + "px";
	style.top  = p[1] + "px";
} else {
    if((!this.options.constraint) || (this.options.constraint=='horizontal'))
      style.left = p[0] + "px";
    if((!this.options.constraint) || (this.options.constraint=='vertical'))
      style.top  = p[1] + "px";
} //Tom M. Yeh, Potix
    
    if(style.visibility=="hidden") style.visibility = ""; // fix gecko rendering
  },
  
  stopScrolling: function() {
    if(this.scrollInterval) {
      clearInterval(this.scrollInterval);
      this.scrollInterval = null;
      Draggables._lastScrollPointer = null;
    }
  },
  
  startScrolling: function(speed) {
    if(!(speed[0] || speed[1])) return;
    this.scrollSpeed = [speed[0]*this.options.scrollSpeed,speed[1]*this.options.scrollSpeed];
    this.lastScrolled = new Date();
    this.scrollInterval = setInterval(this.scroll.bind(this), 10);
  },
  
  scroll: function() {
    var current = new Date();
    var delta = current - this.lastScrolled;
    this.lastScrolled = current;
    if(this.options.scroll == window) {
      with (this._getWindowScroll(this.options.scroll)) {
        if (this.scrollSpeed[0] || this.scrollSpeed[1]) {
          var d = delta / 1000;
          this.options.scroll.scrollTo( left + d*this.scrollSpeed[0], top + d*this.scrollSpeed[1] );
        }
      }
    } else {
      this.options.scroll.scrollLeft += this.scrollSpeed[0] * delta / 1000;
      this.options.scroll.scrollTop  += this.scrollSpeed[1] * delta / 1000;
    }
    
    Position.prepare();
/* Tom M. Yeh, Potix: remove unused codes
    Droppables.show(Draggables._lastPointer, this.element);
*/
    Draggables.notify('onDrag', this);
    if (this._isScrollChild) {
      Draggables._lastScrollPointer = Draggables._lastScrollPointer || $A(Draggables._lastPointer);
      Draggables._lastScrollPointer[0] += this.scrollSpeed[0] * delta / 1000;
      Draggables._lastScrollPointer[1] += this.scrollSpeed[1] * delta / 1000;
      if (Draggables._lastScrollPointer[0] < 0)
        Draggables._lastScrollPointer[0] = 0;
      if (Draggables._lastScrollPointer[1] < 0)
        Draggables._lastScrollPointer[1] = 0;
      this.draw(Draggables._lastScrollPointer);
    }
    
    if(this.options.change) this.options.change(this);
  },
  
  _getWindowScroll: function(w) {
    var T, L, W, H;
    with (w.document) {
      if (w.document.documentElement && documentElement.scrollTop) {
        T = documentElement.scrollTop;
        L = documentElement.scrollLeft;
      } else if (w.document.body) {
        T = body.scrollTop;
        L = body.scrollLeft;
      }
      if (w.innerWidth) {
        W = w.innerWidth;
        H = w.innerHeight;
      } else if (w.document.documentElement && documentElement.clientWidth) {
        W = documentElement.clientWidth;
        H = documentElement.clientHeight;
      } else {
        W = body.offsetWidth;
        H = body.offsetHeight
      }
    }
    return { top: T, left: L, width: W, height: H };
  }
}

/*--------------------------------------------------------------------------*/

/* Tom M. Yeh, Potix: remove Sortable
var SortableObserver = Class.create();
SortableObserver.prototype = {
...
}
var Sortable = {
...
}
*/

/* Tom M. Yeh, Potix: remove unused codes
// Returns true if child is contained within element
Element.isParent = function(child, element) {
  if (!child.parentNode || child == element) return false;
  if (child.parentNode == element) return true;
  return Element.isParent(child.parentNode, element);
}

Element.findChildren = function(element, only, recursive, tagName) {    
  if(!element.hasChildNodes()) return null;
  tagName = tagName.toUpperCase();
  if(only) only = [only].flatten();
  var elements = [];
  $A(element.childNodes).each( function(e) {
    if(e.tagName && e.tagName.toUpperCase()==tagName &&
      (!only || (Element.classNames(e).detect(function(v) { return only.include(v) }))))
        elements.push(e);
    if(recursive) {
      var grandchildren = Element.findChildren(e, only, recursive, tagName);
      if(grandchildren) elements.push(grandchildren);
    }
  });

  return (elements.length>0 ? elements.flatten() : []);
}

Element.offsetSize = function (element, type) {
//Tom M. Yeh, Potix: safari bug
if (type == 'vertical' || type == 'height')
  return zk.offsetHeight(element);
else
  return zk.offsetWidth(element);
  //return element['offset' + ((type=='vertical' || type=='height') ? 'Height' : 'Width')];
}
*/
} //Tom M. Yeh, Potix: prevent it from load twice