[Sommaire] [Imprimer]

   1  /*
   2     DynAPI Distribution
   3     DragEvent Class
   4  
   5     The DynAPI Distribution is distributed under the terms of the GNU LGPL license.
   6  */
   7  
   8  // DragEvent object
   9  function DragEvent(type,src) {
  10      this.MouseEvent = MouseEvent;
  11      this.MouseEvent();
  12      this.DynEvent();
  13      this.isDragging = false;
  14  };
  15  var p = dynapi.setPrototype('DragEvent','MouseEvent');
  16  p.getX=function() {return this.x};
  17  p.getY=function() {return this.y};
  18  p.getPageX=function() {return this.pageX};
  19  p.getPageY=function() {return this.pageY};
  20  p.cancelDrag=function() {this.isDragging=false};
  21  
  22  //DragEvent.dragPlay=0;
  23  
  24  DragEvent.dragevent = new DragEvent();
  25  
  26  DragEvent.lyrListener = {
  27      onmousedown : function(e) {
  28          var ic,o = e.getSource();
  29          //setup drag icon
  30          if(o._useDragIcon && o._dragIcon) {
  31              ic=o._dragIcon;
  32              ic._dragOrg = o;
  33              ic.setLocation(o.getPageX(),o.getPageY());
  34              ic.setSize(o.w,o.h);
  35              // if icon is fixed width then center at pointer
  36              if(ic.w!=o.w||ic.h!=o.h) ic.setLocation(e.getPageX()-(ic.w/2),e.getPageY()-(ic.h/2));
  37          }
  38          DragEvent.startDrag(e,ic);
  39          //e.preventDefault();
  40      }
  41  };
  42  
  43  DragEvent.startDrag = function(e,dlyr) {
  44      var origdlyr = dlyr;
  45      if (!dlyr) dlyr = e.getSource();
  46      
  47      if (dynapi.ua.dom) {
  48          dlyr.elm.ondragstart = function() { return false; };
  49          dlyr.elm.onselectstart = function() { return false; };
  50      }
  51      
  52      // Initialize dragEvent object
  53      var de=DragEvent.dragevent;
  54      //de.bubble = true;
  55      de.src = dlyr;
  56      de.origin = (origdlyr)? e.origin : dlyr;
  57      de.x = e.getPageX()-dlyr.getPageX();
  58      de.y = e.getPageY()-dlyr.getPageY();
  59      de.pageX = e.getPageX();
  60      de.pageY = e.getPageY();
  61      de.parentPageX = dlyr.parent.getPageX();
  62      de.parentPageY = dlyr.parent.getPageY();
  63      de._mouseEvent = e._mouseEvent;
  64      de._browserEvent = e._browserEvent; // ns4 only
  65  
  66      de.isDragging = true;
  67  
  68      e.preventDefault();
  69      e.preventBubble();
  70  
  71      //dlyr._dyndoc.addEventListener(DragEvent.docListener);
  72      
  73      dlyr.invokeEvent("dragstart",de);
  74      if(dlyr._dragOrg) {
  75          dlyr.setVisible(true);
  76          dlyr._dragOrg.invokeEvent("dragstart",e);
  77      }
  78  };
  79  
  80  DragEvent.docListener = {
  81      onmousemove : function(e) {
  82          //var x = e.getPageX();
  83          //var y = e.getPageY();
  84          //dynapi.debug.status('drag move '+e.x+' '+e.y);
  85          
  86          var de = DragEvent.dragevent;
  87          if (de && de.isDragging) {
  88              
  89              
  90              var lyr = de.src;
  91              if (!lyr) return;
  92          
  93              // DS: what is this?
  94              // Detect if we should start the drag
  95              /*if(DragEvent.dragPlay==0 || (Math.abs(de.pageX-e.getPageX())-DragEvent.dragPlay>0) || (Math.abs(de.pageY-e.getPageY())-DragEvent.dragPlay>0)) {
  96                  de.isDragging=true;
  97                  de.src.invokeEvent("dragstart",de);
  98                  e.setBubble(de.bubble);
  99              }
 100              */
 101              /*else if (!de.dragEnabled) {
 102                  // This allows 'cancelDrag' method to fire the mouseUp as if had been released by the user
 103                  lyr.invokeEvent("mouseup");
 104                  return;
 105              }*/
 106          
 107              // Properties
 108              de.type="dragmove";
 109              de.pageX=e.getPageX();
 110              de.pageY=e.getPageY();
 111              de._mouseEvent = e._mouseEvent;
 112              de._browserEvent = e._browserEvent; // ns4 only
 113          
 114              /*if (DragEvent.stopAtDocumentEdge) {
 115                  if (de.pageX<0) de.pageX = 0;
 116                  if (de.pageY<0) de.pageY = 0;
 117                  if (de.pageX>DynAPI.document.w) de.pageX = DynAPI.document.w;
 118                  if (de.pageY>DynAPI.document.h) de.pageY = DynAPI.document.h;
 119              }*/
 120              
 121              var x=de.pageX-de.parentPageX-de.x;
 122              var y=de.pageY-de.parentPageY-de.y;
 123          
 124              // Respect boundary, if any
 125              if (lyr._dragBoundary) {
 126                  var dB = lyr._dragBoundary;
 127                  var t = dB.top;
 128                  var r = dB.right;
 129                  var b = dB.bottom;
 130                  var l = dB.left;
 131                  // prevent choppy dragging if child is greater than parent
 132                  var pw = (lyr.parent.w>lyr.w)? lyr.parent.w-lyr.w:lyr.x;
 133                  var ph = (lyr.parent.h>lyr.h)? lyr.parent.h-lyr.h:lyr.y;
 134                  if (x<l) x = l;
 135                  else if (x>pw-r) x = pw-r;
 136                  if (y<t) y = t;
 137                  else if (y>ph-b) y = ph-b;
 138              }
 139              else if (lyr._dragBoundaryA) {
 140                  var dB = lyr._dragBoundaryA;
 141                  var b=dB[2];
 142                  var r=dB[1];
 143                  var l=dB[3];
 144                  var t=dB[0];
 145                  var w=lyr.w;
 146                  var h=lyr.h;
 147                  if (x<l) x=l;
 148                  else if (x+w>r) x=r-w;
 149                  if (y<t) y=t;
 150                  else if (y+h>b) y=b-h;
 151              }
 152              // Move dragged layer
 153              lyr.setLocation(x,y);
 154              lyr.invokeEvent("dragmove",de);
 155              // drag icon
 156              if(lyr._dragOrg) {
 157                  lyr._dragOrg.invokeEvent("dragmove",e);
 158              }
 159  
 160              
 161              if (lyr._dragStealth==false && lyr.parent.DragOver) {
 162                  lyr.parent.DragOver(lyr,e.getPageX(),e.getPageY());
 163              }
 164              
 165              e.preventDefault();
 166              e.preventBubble();
 167          }
 168      },
 169      onmouseup : function(e) {
 170          // Get, if any, the currently drag in process and the layer. If none, return
 171          var de=DragEvent.dragevent;
 172          //de.bubble = true;
 173          if (!de) return;
 174          var lyr=de.src;
 175          if (!lyr) return;
 176      
 177          if (!de.isDragging) {
 178              de.type="dragend";
 179              de.src=null;
 180              //e.setBubble(true);
 181              return;
 182          }
 183          if (dynapi.ua.ie) lyr.doc.body.onselectstart = null;
 184      
 185          // Avoid click for the dragged layer ( with MouseEvent addition )
 186          if (dynapi.ua.def) dynapi.wasDragging=true;
 187          if (lyr.parent.DragDrop) lyr.parent.DragDrop(lyr,e.getPageX(),e.getPageY()); 
 188          
 189          // Properties for the event
 190          de.type="dragend";
 191          de.isDragging=false;
 192          lyr.invokeEvent("dragend",de);
 193          // drag icon
 194          if(lyr._dragOrg) {
 195              lyr.setVisible(false);
 196              lyr._dragOrg.invokeEvent("dragend",de);
 197          }
 198  
 199      
 200          // Clean drag stuff
 201          de.src=null;
 202          //e.preventDefault();
 203          e.preventBubble();
 204          
 205          //lyr._dyndoc.removeEventListener(DragEvent.docListener);
 206      }
 207  };
 208  DragEvent.stopAtDocumentEdge = true;
 209  DragEvent.setDragBoundary=function(lyr,t,r,b,l) {
 210      if (!lyr) {dynapi.debug.print("Error: no object passed to DragEvent.setDragBoundary()"); return;}
 211      var a=arguments;
 212      if (a.length==0) return;
 213      if (a.length==1) {
 214          lyr._dragBoundary = {left:0,right:0,top:0,bottom:0};
 215      }
 216      if (a.length==2) {
 217          lyr._dragBoundary = arguments[1];
 218      }
 219      else if (a.length==5) lyr._dragBoundaryA = [t,r,b,l];
 220  };
 221  DragEvent.enableDragEvents=function() {
 222      for (var i=0;i<arguments.length;i++) {
 223          var lyr=arguments[i];
 224          if (!lyr) {dynapi.debug.print("Error: no object passed to DragEvent.enableDragEvents()"); return;}
 225          if (lyr.isClass('DynLayer')) lyr.addEventListener(DragEvent.lyrListener);
 226      }
 227      dynapi.document.addEventListener(DragEvent.docListener);
 228      dynapi.document.captureMouseEvents();
 229  };
 230  DragEvent.disableDragEvents=function() {
 231      for (var i=0;i<arguments.length;i++) {
 232          var lyr=arguments[i];
 233          lyr.removeEventListener(DragEvent.lyrListener);
 234      }
 235  };
 236  
 237  // used mainly inside ondrop and ondragover
 238  DynLayer.prototype.getDragSource = function(){
 239      return this._dragOrg||this;
 240  };
 241  DynLayer.prototype.setDragEnabled = function(b,boundry,useIcon){
 242      if(!self.DragEvent) return false;
 243      if(boundry)DragEvent.setDragBoundary(this,boundry);
 244      if (b) DragEvent.enableDragEvents(this);
 245      else DragEvent.disableDragEvents(this);
 246      this._useDragIcon = useIcon;
 247      return true;    
 248  };
 249  DynLayer.prototype.setDragIcon = function(icon){
 250      if(!icon) return;
 251      this._dragIcon = icon;
 252      icon.setZIndex({topmost:true});
 253      icon.setVisible(false);
 254      dynapi.document.addChild(icon);
 255  };
 256  DynLayer.prototype.setDragOverStealthMode = function(b){
 257      this._dragStealth=(b)? true:false;
 258  };
 259  
 260  // Enable ondrop event
 261  DynElement.prototype.DragDrop=function(s,mX,mY){ 
 262      if (!this.children.length) return false;
 263      var ch,chX,sX,sY;
 264      for (var i in this.children) { 
 265          ch=this.children[i];         
 266          if(!ch._hasDragEvents) ch.DragDrop(s,mX,mY);
 267          else {
 268              chX=ch.getPageX();
 269              chY=ch.getPageY(); 
 270              //sX=s.getPageX();
 271              //sY=s.getPageY(); 
 272              //if (chX<sX && chX+ch.w>sX+s.w && chY<sY && chY+ch.h>sY+s.h) { 
 273              if ((mX>=chX && mX<=chX+ch.w) && (mY>=chY && mY<=chY+ch.h)) { 
 274                  if (ch.DragDrop(s,mX,mY)) return true; 
 275                  ch.invokeEvent("drop",null,s); 
 276                  return true; 
 277              }
 278          }
 279      }
 280      return false; 
 281  };
 282  
 283  // Enable ondragover event
 284  DynElement.prototype.DragOver=function(s,mX,mY){ 
 285      if (!this.children.length) return false;
 286      var ch,chX,sX,sY;
 287      for (var i in this.children) { 
 288          ch=this.children[i];        
 289          if (!ch._hasDragEvents) ch.DragOver(s,mX,mY);
 290          else {
 291              chX=ch.getPageX();
 292              chY=ch.getPageY(); 
 293              if ((mX>=chX && mX<=chX+ch.w) && (mY>=chY && mY<=chY+ch.h)) { 
 294                  if (ch.DragOver(s,mX,mY)) return true;
 295                  ch._isDragOver=true;
 296                  ch.invokeEvent("dragover",null,s);             
 297                  return true; 
 298              }else if (ch._isDragOver) {
 299                  ch._isDragOver=false;
 300                  ch.invokeEvent("dragout",null,s);             
 301              }
 302          }
 303      }
 304      return false; 
 305  };
 306