1 // ========================================================================== 2 // NodeGraph.DragPanMixin 3 // 4 // License: PaperCube is open source software released under 5 // the MIT License (see license.js) 6 // ========================================================================== 7 8 require('core'); 9 10 11 /** @class 12 13 This the drag pan mixin for the views. It will be used in multiple places to allow for drag panning. 14 15 @author Peter Bergstrom 16 @version 1.0 17 @copyright 2008-2009 Peter Bergström. 18 */ 19 NodeGraph.DragPanMixin = { 20 /** @scope NodeGraph.DragPanMixin.prototype */ 21 22 /** 23 This is the xPos for the drag-pan. 24 25 @property {Integer} 26 */ 27 _xPos: 0, 28 29 /** 30 This is the yPos for the drag-pan. 31 32 @property {Integer} 33 */ 34 _yPos: 0, 35 36 /** 37 This is the mouseDragTime. Registered as things are dragged to determine the wait time. 38 39 @property {Integer} 40 */ 41 _mouseDragTime: 0, 42 43 /** 44 Can the view drag-pan or not. NO if it can't. 45 46 @property {Integer} 47 @default NO 48 */ 49 _canDrag: NO, 50 51 /** 52 End a drag pan operation if the view is being dragged. 53 54 @param {DOM Event} evt The mouseUp event. 55 */ 56 mouseUp: function(evt) 57 { 58 if(this._canDrag) 59 { 60 if(this.get('delegate')) { 61 this.get('delegate').panToCoordinates((Event.pointerX(evt)-this._xPos), (Event.pointerY(evt)-this._yPos), YES); 62 } 63 this._yPos = 0; 64 this._xPos = 0; 65 this.removeClassName('is-dragging'); 66 this.removeClassName('can-drag'); 67 } 68 this._canDrag = NO; 69 }, 70 71 /** 72 Update the view if the view is being dragged. Don't do anything if 200 ms has not passed. 73 74 @param {DOM Event} evt The mouseDragged event. 75 */ 76 mouseDragged: function(evt) 77 { 78 if(this._canDrag) 79 { 80 this.removeClassName('can-drag'); 81 this.addClassName('is-dragging'); 82 83 var x = Event.pointerX(evt); 84 var y = Event.pointerY(evt); 85 86 if((Date.now()-this._mouseDragTime) > 200) 87 { 88 if(this.get('delegate')) { 89 this.get('delegate').panToCoordinates((x-this._xPos), (y-this._yPos)); 90 } 91 this._xPos = x; //Event.pointerX(evt); 92 this._yPos = y; //Event.pointerY(evt); 93 this._mouseDragTime = Date.now(); 94 } 95 96 } 97 }, 98 99 /** 100 Handle a mouse down where there is no guid. Enable a drag. 101 102 @param {DOM Event} evt The mouseDown event. 103 */ 104 handleMouseDownDrag: function(evt) 105 { 106 this.addClassName('can-drag'); 107 this._yPos = Event.pointerY(evt); 108 this._xPos = Event.pointerX(evt); 109 this._canDrag = YES; 110 this._mouseDragTime = Date.now(); 111 return YES; 112 } 113 };