-
-
Save jrbramble76/dc02515ee0de09151989 to your computer and use it in GitHub Desktop.
This snippet maps mouse events and touch events onto one single event. This makes it easier in the code since you have to listen to only one event regardles whether it's desktop or mobile.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function() { | |
/* == GLOBAL DECLERATIONS == */ | |
TouchMouseEvent = { | |
DOWN: "touchmousedown", | |
UP: "touchmouseup", | |
MOVE: "touchmousemove" | |
} | |
/* == EVENT LISTENERS == */ | |
var onMouseEvent = function(event) { | |
var type; | |
switch (event.type) { | |
case "mousedown": type = TouchMouseEvent.DOWN; break; | |
case "mouseup": type = TouchMouseEvent.UP; break; | |
case "mousemove": type = TouchMouseEvent.MOVE; break; | |
default: | |
return; | |
} | |
var touchMouseEvent = normalizeEvent(type, event, event.pageX, event.pageY); | |
$(event.target).trigger(touchMouseEvent); | |
} | |
var onTouchEvent = function(event) { | |
var type; | |
switch (event.type) { | |
case "touchstart": type = TouchMouseEvent.DOWN; break; | |
case "touchend": type = TouchMouseEvent.UP; break; | |
case "touchmove": type = TouchMouseEvent.MOVE; break; | |
default: | |
return; | |
} | |
var touch = event.originalEvent.touches[0]; | |
var touchMouseEvent; | |
if (type == TouchMouseEvent.UP) | |
touchMouseEvent = normalizeEvent(type, event, null, null); | |
else | |
touchMouseEvent = normalizeEvent(type, event, touch.pageX, touch.pageY); | |
$(event.target).trigger(touchMouseEvent); | |
} | |
/* == NORMALIZE == */ | |
var normalizeEvent = function(type, original, x, y) { | |
return $.Event(type, { | |
pageX: x, | |
pageY: y, | |
originalEvent: original | |
}); | |
} | |
/* == LISTEN TO ORIGINAL EVENT == */ | |
var jQueryDocument = $(document); | |
if ("ontouchstart" in window) { | |
jQueryDocument.on("touchstart", onTouchEvent); | |
jQueryDocument.on("touchmove", onTouchEvent); | |
jQueryDocument.on("touchend", onTouchEvent); | |
} else { | |
jQueryDocument.on("mousedown", onMouseEvent); | |
jQueryDocument.on("mouseup", onMouseEvent); | |
jQueryDocument.on("mousemove", onMouseEvent); | |
} | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment