fix for touches

This commit is contained in:
Pavel Dobryakov
2017-08-26 14:12:30 +03:00
parent 6d8778ad76
commit fe49079f05
2 changed files with 20 additions and 13 deletions

View File

@@ -1,4 +1,5 @@
<html> <html>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<head> <head>
<style> <style>
html, body { html, body {

View File

@@ -1,5 +1,7 @@
'use strict'; 'use strict';
window.scrollTo(0, 1);
const canvas = document.getElementsByTagName('canvas')[0]; const canvas = document.getElementsByTagName('canvas')[0];
const params = { alpha: false, depth: false, stencil: false, antialias: false }; const params = { alpha: false, depth: false, stencil: false, antialias: false };
@@ -412,7 +414,7 @@ Update();
function Update () { function Update () {
resizeCanvas(); resizeCanvas();
const dt = Math.min((Date.now() - lastTime) / 1000, 0.016); const dt = Math.min((Date.now() - lastTime) / 1000, 0.016);
lastTime = Date.now(); lastTime = Date.now();
@@ -432,7 +434,7 @@ function Update () {
gl.uniform1f(advectionProgram.uniforms.dissipation, DENSITY_DISSIPATION); gl.uniform1f(advectionProgram.uniforms.dissipation, DENSITY_DISSIPATION);
blit(density.second[1]); blit(density.second[1]);
density.swap(); density.swap();
for (let i = 0; i < pointers.length; i++) { for (let i = 0; i < pointers.length; i++) {
const pointer = pointers[i]; const pointer = pointers[i];
if (pointer.moved) { if (pointer.moved) {
@@ -519,30 +521,34 @@ canvas.addEventListener('mousemove', (e) => {
canvas.addEventListener('touchmove', (e) => { canvas.addEventListener('touchmove', (e) => {
e.preventDefault(); e.preventDefault();
const touches = e.targetTouches;
for (let i = 0; i < e.touches.length; i++) { for (let i = 0; i < e.touches.length; i++) {
if (i >= pointers.length) { if (i >= pointers.length) {
pointers.push(new pointerPrototype()); pointers.push(new pointerPrototype());
} }
let pointer = pointers[i]; let pointer = pointers[i];
pointer.moved = pointer.down; pointer.moved = pointer.down;
pointer.dx = (e.touches[i].pageX - pointer.x) * 10.0; pointer.dx = (touches[i].pageX - pointer.x) * 10.0;
pointer.dy = (e.touches[i].pageY - pointer.y) * 10.0; pointer.dy = (touches[i].pageY - pointer.y) * 10.0;
pointer.x = e.touches[i].pageX; pointer.x = touches[i].pageX;
pointer.y = e.touches[i].pageY; pointer.y = touches[i].pageY;
} }
}, false);
canvas.addEventListener('mousedown', () => {
pointers[0].dowm = true;
pointers[0].color = [Math.random() + 0.2, Math.random() + 0.2, Math.random() + 0.2];
}); });
canvas.addEventListener('mousedown', onPointerDown); canvas.addEventListener('touchstart', () => {
canvas.addEventListener('touchstart', onPointerDown);
window.addEventListener('mouseup', onPointerUp);
window.addEventListener('touchend', onPointerUp);
function onPointerDown () {
for (let i = 0; i < pointers.length; i++) { for (let i = 0; i < pointers.length; i++) {
pointers[i].down = true; pointers[i].down = true;
pointers[i].color = [Math.random() + 0.2, Math.random() + 0.2, Math.random() + 0.2]; pointers[i].color = [Math.random() + 0.2, Math.random() + 0.2, Math.random() + 0.2];
} }
} });
window.addEventListener('mouseup', onPointerUp);
window.addEventListener('touchend', onPointerUp);
function onPointerUp () { function onPointerUp () {
for (let i = 0; i < pointers.length; i++) { for (let i = 0; i < pointers.length; i++) {