From 582bef44fd179b244ca9657be821bad96f1c1139 Mon Sep 17 00:00:00 2001 From: s3lph Date: Sat, 14 Jul 2018 22:30:04 +0200 Subject: [PATCH] Touchkey now works on mobile browsers. --- static/js/touchkey.js | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/static/js/touchkey.js b/static/js/touchkey.js index 12a945f..d0f91ad 100644 --- a/static/js/touchkey.js +++ b/static/js/touchkey.js @@ -57,11 +57,11 @@ initTouchkey = (keepPattern, svgid, formid, formfieldid) => { }); }; - svg.onmousedown = (ev) => { + svg.ontouchstart = svg.onmousedown = (ev) => { clearTouchkey(); const svgrect = svg.getBoundingClientRect(); - const trX = ev.x - svgrect.left; - const trY = ev.y - svgrect.top; + const trX = (typeof ev.touches !== 'undefined' ? ev.touches[0].pageX : ev.x) - svgrect.left; + const trY = (typeof ev.touches !== 'undefined' ? ev.touches[0].pageY : ev.y) - svgrect.top; let minId = ''; let minDist = Infinity; let minx = 0; @@ -83,7 +83,7 @@ initTouchkey = (keepPattern, svgid, formid, formfieldid) => { enteredKey += minId; }; - svg.onmouseup = (ev) => { + svg.ontouchend = svg.onmouseup = (ev) => { endPath(); formfield.value = enteredKey; if (keepPattern !== true) { @@ -94,10 +94,11 @@ initTouchkey = (keepPattern, svgid, formid, formfieldid) => { } }; - svg.onmousemove = (ev) => { + svg.ontouchmove = svg.onmousemove = (ev) => { const svgrect = svg.getBoundingClientRect(); - const trX = ev.x - svgrect.left; - const trY = ev.y - svgrect.top; + const trX = (typeof ev.touches !== 'undefined' ? ev.touches[0].pageX : ev.x) - svgrect.left; + const trY = (typeof ev.touches !== 'undefined' ? ev.touches[0].pageY : ev.y) - svgrect.top; + console.log(trY); if (currentStroke != null) { let minId = ''; let minDist = Infinity;