Handling touch-based events

Question

I currently have this for my touch events:

if( 'ontouchstart' in document.body) {
    usevkeys = true;
    canvas.addEventListener("touchstart",function(e) {evt.call(this,e);},false);
    canvas.addEventListener("touchend",function(e) {evt.call(this,e);},false);
    canvas.addEventListener("touchmove",function(e) {evt.call(this,e);},false);
}
else {
    canvas.addEventListener("mousemove",function(e) {evt.call(this,e);},false);
    canvas.addEventListener("click",function(e) {evt.call(this,e);},false);
}

This works fine on my laptop, and on my phone. However, I have to wonder, how would this react in an environment that has both a touchscreen and a normal mouse? Does the mouse trigger touch events, like the phone triggers mousemove events?

What can I do to make sure it works?

Answer 1

a touchstart triggers the click event as soon as touchend has fired (-> if it hasn't been canceled). So you should just remove the else clause and should be fine!

Microsoft went a different way with their touch events in IE10 to harmonize all pointer-devices into Pointer and gesture events where you can check if it has been fired by a mouse, pen or a finger - or perhaps a kinect-style device in the future.