From 6aaa1dc628baafcb106e802e8014572800f61dcb Mon Sep 17 00:00:00 2001
From: Philip Rideout <philiprideout@gmail.com>
Date: Mon, 10 Sep 2018 11:35:20 -0700
Subject: [PATCH] WebGL: support touch screens. (#229)

---
 samples/web/filaweb.js    | 15 ++++++++-------
 samples/web/suzanne.html  |  3 ++-
 samples/web/triangle.html |  2 ++
 3 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/samples/web/filaweb.js b/samples/web/filaweb.js
index a8c2f063e4..aff546236e 100644
--- a/samples/web/filaweb.js
+++ b/samples/web/filaweb.js
@@ -35,17 +35,18 @@ function maybe_launch() {
     if (assets_ready && context_ready) {
         _launch();
         canvas_resize();
-        window.addEventListener("resize", canvas_resize);
-        window.addEventListener("wheel", canvas_mouse);
-        window.addEventListener("mousemove", canvas_mouse);
-        window.addEventListener("mousedown", canvas_mouse);
-        window.addEventListener("mouseup", canvas_mouse);
+        let canvas = document.getElementById('filament-canvas');
+        canvas.addEventListener("resize", canvas_resize);
+        canvas.addEventListener("wheel", canvas_mouse);
+        canvas.addEventListener("pointermove", canvas_mouse);
+        canvas.addEventListener("pointerdown", canvas_mouse);
+        canvas.addEventListener("pointerup", canvas_mouse);
         canvas_render();
     }
 }
 
-// Update a tiny queue of mouse events. We don't send them to WASM immediately because ImGui detects
-// click events by looking for three consecutive frames of down-up-down.
+// Update a tiny queue of pointer events. We don't send them to WASM immediately because ImGui
+// detects click events by looking for three consecutive frames of down-up-down.
 function canvas_mouse(evt) {
     let args = [evt.clientX, evt.clientY, evt.deltaX || 0, evt.deltaY || 0, evt.buttons];
     if (evt.buttons != previous_mouse_buttons || queued_mouse_events.length == 0) {
diff --git a/samples/web/suzanne.html b/samples/web/suzanne.html
index efd6991ba2..eb4fc5a9e9 100644
--- a/samples/web/suzanne.html
+++ b/samples/web/suzanne.html
@@ -4,13 +4,14 @@
     <meta charset="utf-8">
     <title>Suzanne</title>
     <link href="favicon.png" rel="icon" type="image/x-icon"/>
-    <meta name=viewport content='width=device-width,initial-scale=1'>
+    <meta name="viewport" content="width=device-width,user-scalable=no">
     <style>
     body {
         margin: 0;
         overflow: hidden;
     }
     #filament-canvas {
+        touch-action: none;
         width: 100vw;
         height: 100vh;
     }
diff --git a/samples/web/triangle.html b/samples/web/triangle.html
index f8da4648a5..3d5f7a89fc 100644
--- a/samples/web/triangle.html
+++ b/samples/web/triangle.html
@@ -4,12 +4,14 @@
     <meta charset="utf-8">
     <title>Triangle</title>
     <link href="favicon.png" rel="icon" type="image/x-icon"/>
+    <meta name="viewport" content="width=device-width,user-scalable=no">
     <style>
     body {
         margin: 0;
         overflow: hidden;
     }
     #filament-canvas {
+        touch-action: none;
         width: 100vw;
         height: 100vh;
     }