123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108 |
- (function($) {
- var Swipe = function(el) {
- var self = this
- this.el = $(el)
- this.pos = { start: { x: 0, y: 0 }, end: { x: 0, y: 0 } }
- this.startTime
- el.on('touchstart', function(e) { self.touchStart(e) })
- el.on('touchmove', function(e) { self.touchMove(e) })
- el.on('touchend', function(e) { self.swipeEnd() })
- el.on('mousedown', function(e) { self.mouseDown(e) })
- }
- Swipe.prototype = {
- touchStart: function(e) {
- var touch = e.originalEvent.touches[0]
- this.swipeStart(e, touch.pageX, touch.pageY)
- },
- touchMove: function(e) {
- var touch = e.originalEvent.touches[0]
- this.swipeMove(e, touch.pageX, touch.pageY)
- },
- mouseDown: function(e) {
- var self = this
- this.swipeStart(e, e.pageX, e.pageY)
- this.el.on('mousemove', function(e) { self.mouseMove(e) })
- this.el.on('mouseup', function() { self.mouseUp() })
- },
- mouseMove: function(e) {
- this.swipeMove(e, e.pageX, e.pageY)
- },
- mouseUp: function(e) {
- this.swipeEnd(e)
- this.el.off('mousemove')
- this.el.off('mouseup')
- },
- swipeStart: function(e, x, y) {
- this.pos.start.x = x
- this.pos.start.y = y
- this.pos.end.x = x
- this.pos.end.y = y
- this.startTime = new Date().getTime()
- this.trigger('swipeStart', e)
- },
- swipeMove: function(e, x, y) {
- this.pos.end.x = x
- this.pos.end.y = y
- this.trigger('swipeMove', e)
- },
- swipeEnd: function(e) {
- this.trigger('swipeEnd', e)
- },
- trigger: function(e, originalEvent) {
- var self = this
- var
- event = $.Event(e),
- x = self.pos.start.x - self.pos.end.x,
- y = self.pos.end.y - self.pos.start.y,
- radians = Math.atan2(y, x),
- direction = 'up',
- distance = Math.round(Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2))),
- angle = Math.round(radians * 180 / Math.PI),
- speed = Math.round(distance / ( new Date().getTime() - self.startTime ) * 1000)
- if ( angle < 0 ) {
- angle = 360 - Math.abs(angle)
- }
- if ( ( angle <= 45 && angle >= 0 ) || ( angle <= 360 && angle >= 315 ) ) {
- direction = 'left'
- } else if ( angle >= 135 && angle <= 225 ) {
- direction = 'right'
- } else if ( angle > 45 && angle < 135 ) {
- direction = 'down'
- }
- event.originalEvent = originalEvent
- event.swipe = { x: x, y: y, direction: direction, distance: distance, angle: angle, speed: speed }
- $(self.el).trigger(event)
- }
- }
- $.fn.swipe = function() {
- var swipe = new Swipe(this)
- return this
- }
- })(jQuery)
|