gistfile1.js

//Code to create a list of touches called pointerList
 
var pointerList = []; //Array of all the pointers on the screen
window.addEventListener("pointerdown", updatePointer, true);
window.addEventListener("pointermove", updatePointer, true);
window.addEventListener("pointerup", remPointer, true);
window.addEventListener("pointercancel", remPointer, true);
 
function updatePointer(e) { 
  if(e.pointerType === "touch") {
    pointerList[e.pointerId] = e; //Adds or update an entry to the array with the touch data for this touch
    e.target.setPointerCapture(e.pointerId); //Captures all subsequent events for this touch to the canvas, so you still get the pointerup even if you lift outside of the canvas element's bounds 
  }
}
function remPointer(e) { 
  if(e.pointerType === "touch")
    delete pointerList[e.pointerId]; //Removes the entry for this touch in the array now that it has lifted or been cancelled
}
 
//Example usage would be to poll the list in every browser render frame (~60FPS)
 
function sendTouchData() {
  console.log(pointerList)  //Replace this with your code to send the array back over WebSockets
  requestAnimationFrame(sendTouchData); //Schedule another callback on the next render frame
}
requestAnimationFrame(sendTouchData); //Schedule the first callback for the next render frame

gistfile2.css

canvas {
 touch-action: none; /* Disable default browser gestures and start getting pointer events for multi-touch */
}