feat: add touch event handling to compositor example

bhouston · Aug 13, 2020 · bcf424b · bcf424b
1 parent 1cb3e51
commit bcf424b
Showing 1 changed file with 15 additions and 1 deletion.
diff --git a/src/examples/compositing/basic/index.ts b/src/examples/compositing/basic/index.ts
@@ -46,12 +46,14 @@ async function init(): Promise<null> {
 
   animate();
 
+  const zoomFactor = 2.5;
+
   window.addEventListener("resize", () => {
     layerRenderer.context.canvasFramebuffer.resize();
   });
   canvas.addEventListener("mousedown", (mouseEvent: MouseEvent) => {
     if (mouseEvent.button === 0) {
-      layerRenderer.zoomScale = 4.0;
+      layerRenderer.zoomScale = zoomFactor;
     }
   });
   canvas.addEventListener("mouseup", (mouseEvent: MouseEvent) => {
@@ -70,6 +72,18 @@ async function init(): Promise<null> {
       // console.log(layerRenderer.panPosition);
     }
   });
+  canvas.addEventListener("touchstart", () => {
+    layerRenderer.zoomScale = zoomFactor;
+  });
+  canvas.addEventListener("touchend", () => {
+    layerRenderer.zoomScale = 1.0;
+  });
+  canvas.addEventListener("touchmove", (touchEvent: TouchEvent) => {
+    layerRenderer.panPosition = new Vector2(
+      canvas.width * 0.5 - touchEvent.touches[0].clientX,
+      canvas.height * 0.5 - touchEvent.touches[0].clientX,
+    );
+  });
 
   return null;
 }