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