github/socket.io
1
1
Fork 0
mirror of https://github.com/socketio/socket.io.git synced 2026-01-09 15:08:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

[docs] Add Touch Support to the whiteboard example (#3104)

Browse Source
This commit is contained in:
Nadir Hussain Laskar
2018-11-20 12:31:09 +05:30
committed by Damien Arrachequesne
parent a7fbd1ac4a
commit d3c653d876
1 changed files with 12 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
examples/whiteboard/public/main.js
View File

@@ -16,6 +16,12 @@
canvas.addEventListener('mouseup', onMouseUp, false);
canvas.addEventListener('mouseout', onMouseUp, false);
canvas.addEventListener('mousemove', throttle(onMouseMove, 10), false);
//Touch support for mobile devices
canvas.addEventListener('touchstart', onMouseDown, false);
canvas.addEventListener('touchend', onMouseUp, false);
canvas.addEventListener('touchcancel', onMouseUp, false);
canvas.addEventListener('touchmove', throttle(onMouseMove, 10), false);
for (var i = 0; i < colors.length; i++){
colors[i].addEventListener('click', onColorUpdate, false);
@@ -51,21 +57,21 @@
function onMouseDown(e){
drawing = true;
current.x = e.clientX;
current.y = e.clientY;
current.x = e.clientX||e.touches[0].clientX;
current.y = e.clientY||e.touches[0].clientY;
}
function onMouseUp(e){
if (!drawing) { return; }
drawing = false;
drawLine(current.x, current.y, e.clientX, e.clientY, current.color, true);
drawLine(current.x, current.y, e.clientX||e.touches[0].clientX, e.clientY||e.touches[0].clientY, current.color, true);
}
function onMouseMove(e){
if (!drawing) { return; }
drawLine(current.x, current.y, e.clientX, e.clientY, current.color, true);
current.x = e.clientX;
current.y = e.clientY;
drawLine(current.x, current.y, e.clientX||e.touches[0].clientX, e.clientY||e.touches[0].clientY, current.color, true);
current.x = e.clientX||e.touches[0].clientX;
current.y = e.clientY||e.touches[0].clientY;
}
function onColorUpdate(e){