Blame view

assets/js/ace/ace.touch-drag.js 3.01 KB
5a739853   patrick.he   commit
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
  /**
   <b>Custom drag event for touch devices</b> used in scrollbars.
   For better touch event handling and extra options a more advanced solution such as <u>Hammer.js</u> is recommended.
  */
  
  //based on but not dependent on jQuery mobile
  /*
  * jQuery Mobile v1.3.2
  * http://jquerymobile.com
  *
  * Copyright 2010, 2013 jQuery Foundation, Inc. and other contributors
  * Released under the MIT license.
  * http://jquery.org/license
  *
  */
  (function($ , undefined) {
  
  	if(!ace.vars['touch']) return;
  
  	var touchStartEvent = "touchstart MSPointerDown pointerdown",// : "mousedown",
  			touchStopEvent  =  "touchend touchcancel MSPointerUp MSPointerCancel pointerup pointercancel",// : "mouseup",
  			touchMoveEvent  =  "touchmove MSPointerMove MSPointerHover pointermove";// : "mousemove";
  
  
  	$.event.special.ace_drag = {
  		setup: function() {
  			var min_threshold = 0;
  		
  			var $this = $(this);
  			$this.on(touchStartEvent, function(event) {		
  				var data = event.originalEvent.touches ?
  					event.originalEvent.touches[ 0 ] :
  					event,
  					start = {
  						//time: Date.now(),
  						coords: [ data.pageX, data.pageY ],
  						origin: $(event.target)
  					},
  					stop;
  					//start.origin.trigger({'type' : 'ace_dragStart', 'start':(start || [-1,-1])});
  					
  					var direction = false, dx = 0, dy = 0;
  
  				function moveHandler(event) {
  					if (!start) {
  						return;
  					}
  					var data = event.originalEvent.touches ?
  							event.originalEvent.touches[ 0 ] :
  							event;
  					stop = {
  						coords: [ data.pageX, data.pageY ]
  					};
  					
  					// prevent scrolling
  					//if ( Math.abs(start.coords[1] - stop.coords[1]) > 0 || Math.abs(start.coords[0] - stop.coords[01]) > 0 ) {
  						//event.preventDefault();
  					//}
  
  
  					if (start && stop) {
  						dx = 0;
  						dy = 0;
  
  						direction = 
  							(
  							 Math.abs(dy = start.coords[ 1 ] - stop.coords[ 1 ]) > min_threshold
  								&& 
  							 Math.abs(dx = start.coords[ 0 ] - stop.coords[ 0 ]) <= Math.abs(dy)
  							)
  							? 
  							(dy > 0 ? 'up' : 'down')
  							:
  							(
  							 Math.abs(dx = start.coords[ 0 ] - stop.coords[ 0 ]) > min_threshold
  								&& 
  							 Math.abs( dy ) <= Math.abs(dx)
  							)
  							?
  							(dx > 0 ? 'left' : 'right')
  							:
  							false;
  							
  
  							if( direction !== false ) {
  							 var retval = {cancel: false}
  							 start.origin.trigger({
  								'type': 'ace_drag',
  								//'start': start.coords,
  								//'stop': stop.coords,
  								'direction': direction,
  								'dx': dx,
  								'dy': dy,
  								'retval': retval
  							 })
  
  		 					  // prevent document scrolling unless retval.cancel == true
  							  if( retval.cancel == false ) event.preventDefault();
  							}
  					}
  					start.coords[0] = stop.coords[0];
  					start.coords[1] = stop.coords[1];
  				}
  
  				$this
  				.on(touchMoveEvent, moveHandler)
  				.one(touchStopEvent, function(event) {
  					$this.off(touchMoveEvent, moveHandler);
  					//start.origin.trigger({'type' : 'ace_dragEnd', 'stop':(stop || [-1,-1])});
  					
  					start = stop = undefined;
  				
  				});
  			});
  		}
  	}
  
  })(window.jQuery);