djkato/egui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix touch interaction

Browse source
This commit is contained in:
Emil Ernerfeldt 2019-03-16 14:12:40 +01:00
parent 07711a456a
commit 375cc231a6
2 changed files with 18 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
docs/example_wasm_bg.wasm
View file

Binary file not shown.

29
docs/index.html
View file

@ -61,6 +61,7 @@
// ---------------------------------------------------------------------------- // ----------------------------------------------------------------------------
var g_mouse_pos = null; var g_mouse_pos = null;
var g_mouse_down = false; var g_mouse_down = false;
var g_is_touch = false;
function pixels_per_point() { function pixels_per_point() {
// return 1.0; // return 1.0;
@ -104,7 +105,6 @@
} }
function on_wasm_loaded() { function on_wasm_loaded() {
console.log("window.devicePixelRatio: " + window.devicePixelRatio);
var canvas = document.getElementById("canvas"); var canvas = document.getElementById("canvas");
var repaint = function() { var repaint = function() {
if (!ANIMATION_FRAME) { if (!ANIMATION_FRAME) {
@ -113,6 +113,7 @@
}; };
canvas.addEventListener("mousedown", function(event) { canvas.addEventListener("mousedown", function(event) {
if (g_is_touch) { return; }
g_mouse_pos = mouse_pos_from_event(canvas, event); g_mouse_pos = mouse_pos_from_event(canvas, event);
g_mouse_down = true; g_mouse_down = true;
repaint(); repaint();
@ -120,12 +121,14 @@
event.preventDefault(); event.preventDefault();
}); });
canvas.addEventListener("mousemove", function(event) { canvas.addEventListener("mousemove", function(event) {
if (g_is_touch) { return; }
g_mouse_pos = mouse_pos_from_event(canvas, event); g_mouse_pos = mouse_pos_from_event(canvas, event);
repaint(); repaint();
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
}); });
canvas.addEventListener("mouseup", function(event) { canvas.addEventListener("mouseup", function(event) {
if (g_is_touch) { return; }
g_mouse_pos = mouse_pos_from_event(canvas, event); g_mouse_pos = mouse_pos_from_event(canvas, event);
g_mouse_down = false; g_mouse_down = false;
repaint(); repaint();
@ -133,6 +136,7 @@
event.preventDefault(); event.preventDefault();
}); });
canvas.addEventListener("mouseleave", function(event) { canvas.addEventListener("mouseleave", function(event) {
if (g_is_touch) { return; }
g_mouse_pos = null; g_mouse_pos = null;
repaint(); repaint();
event.stopPropagation(); event.stopPropagation();
@ -140,6 +144,7 @@
}); });
canvas.addEventListener("touchstart", function(event) { canvas.addEventListener("touchstart", function(event) {
g_is_touch = true;
g_mouse_pos = { x: event.touches[0].pageX, y: event.touches[0].pageY }; g_mouse_pos = { x: event.touches[0].pageX, y: event.touches[0].pageY };
g_mouse_down = true; g_mouse_down = true;
repaint(); repaint();
@ -147,26 +152,28 @@
event.preventDefault(); event.preventDefault();
}); });
canvas.addEventListener("touchmove", function(event) { canvas.addEventListener("touchmove", function(event) {
g_is_touch = true;
g_mouse_pos = { x: event.touches[0].pageX, y: event.touches[0].pageY }; g_mouse_pos = { x: event.touches[0].pageX, y: event.touches[0].pageY };
repaint(); repaint();
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
}); });
canvas.addEventListener("touchend", function(event) { canvas.addEventListener("touchend", function(event) {
g_mouse_down = false; g_is_touch = true;
repaint(); g_mouse_down = false; // First release mouse to click...
g_mouse_pos = null; paint();
repaint(); g_mouse_pos = null; // ...remove hover effect
paint();
event.stopPropagation(); event.stopPropagation();
event.preventDefault(); event.preventDefault();
}); });
window.addEventListener("load", repaint); if (!ANIMATION_FRAME) {
window.addEventListener("pagehide", repaint); window.addEventListener("load", paint);
window.addEventListener("pageshow", repaint); window.addEventListener("pagehide", paint);
window.addEventListener("resize", repaint); window.addEventListener("pageshow", paint);
window.addEventListener("resize", paint);
// setInterval(repaint, 33); }
paint(); paint();
} }