use pointer events for indexed-textures

threejs/lessons/ja/threejs-indexed-textures.md

@@ -190,20 +190,7 @@ function unselectAllCountries() {
   });
 }
 
-canvas.addEventListener('mouseup', pickCountry);
-
-let lastTouch;
-canvas.addEventListener('touchstart', (event) => {
-  // prevent the window from scrolling
-  event.preventDefault();
-  lastTouch = event.touches[0];
-}, {passive: false});
-canvas.addEventListener('touchmove', (event) => {
-  lastTouch = event.touches[0];
-});
-canvas.addEventListener('touchend', () => {
-  pickCountry(lastTouch);
-});
+canvas.addEventListener('pointerup', pickCountry);
 ```
 
 上記のコードでは、国の配列に `selected` プロパティを設定/解除しています。
@@ -622,19 +609,8 @@ function unselectAllCountries() {
   resetPalette();
 }
 
-+canvas.addEventListener('mousedown', recordStartTimeAndPosition);
-canvas.addEventListener('mouseup', pickCountry);
-
-let lastTouch;
-canvas.addEventListener('touchstart', (event) => {
-  // prevent the window from scrolling
-  event.preventDefault();
-  lastTouch = event.touches[0];
-+  recordStartTimeAndPosition(event.touches[0]);
-}, {passive: false});
-canvas.addEventListener('touchmove', (event) => {
-  lastTouch = event.touches[0];
-});
++canvas.addEventListener('pointerdown', recordStartTimeAndPosition);
+canvas.addEventListener('pointerup', pickCountry);
 ```
 
 これらの変更を加えると私にはそれが機能しているように*見えます*。

threejs/lessons/kr/threejs-indexed-textures.md

@@ -168,20 +168,7 @@ function unselectAllCountries() {
   });
 }
 
-canvas.addEventListener('mouseup', pickCountry);
-
-let lastTouch;
-canvas.addEventListener('touchstart', (event) => {
-  // 스크롤 이벤트를 방지합니다.
-  event.preventDefault();
-  lastTouch = event.touches[0];
-}, { passive: false });
-canvas.addEventListener('touchmove', (event) => {
-  lastTouch = event.touches[0];
-});
-canvas.addEventListener('touchend', () => {
-  pickCountry(lastTouch);
-});
+canvas.addEventListener('pointerup', pickCountry);
 ```
 
 위 코드는 나라 배열에 속한 나라의 `selected` 속성을 켜고 끕니다. `shift`, `ctrl`, `cmd` 중 하나를 누르면 하나 이상의 나라를 선택할 수 있죠.
@@ -570,19 +557,8 @@ function unselectAllCountries() {
   resetPalette();
 }
 
-+canvas.addEventListener('mousedown', recordStartTimeAndPosition);
-canvas.addEventListener('mouseup', pickCountry);
-
-let lastTouch;
-canvas.addEventListener('touchstart', (event) => {
-  // 스크롤 이벤트를 방지합니다.
-  event.preventDefault();
-  lastTouch = event.touches[0];
-+  recordStartTimeAndPosition(event.touches[0]);
-}, { passive: false });
-canvas.addEventListener('touchmove', (event) => {
-  lastTouch = event.touches[0];
-});
++canvas.addEventListener('pointerdown', recordStartTimeAndPosition);
+canvas.addEventListener('pointerup', pickCountry);
 ```
 
 제 기준에서는 이 정도면 충분한 *듯하네요*.

threejs/lessons/threejs-indexed-textures.md

@@ -200,20 +200,7 @@ function unselectAllCountries() {
   });
 }
 
-canvas.addEventListener('mouseup', pickCountry);
-
-let lastTouch;
-canvas.addEventListener('touchstart', (event) => {
-  // prevent the window from scrolling
-  event.preventDefault();
-  lastTouch = event.touches[0];
-}, {passive: false});
-canvas.addEventListener('touchmove', (event) => {
-  lastTouch = event.touches[0];
-});
-canvas.addEventListener('touchend', () => {
-  pickCountry(lastTouch);
-});
+canvas.addEventListener('pointerup', pickCountry);
 ```
 
 The code above sets/unsets the `selected` property on
@@ -661,19 +648,8 @@ function unselectAllCountries() {
   resetPalette();
 }
 
-+canvas.addEventListener('mousedown', recordStartTimeAndPosition);
-canvas.addEventListener('mouseup', pickCountry);
-
-let lastTouch;
-canvas.addEventListener('touchstart', (event) => {
-  // prevent the window from scrolling
-  event.preventDefault();
-  lastTouch = event.touches[0];
-+  recordStartTimeAndPosition(event.touches[0]);
-}, {passive: false});
-canvas.addEventListener('touchmove', (event) => {
-  lastTouch = event.touches[0];
-});
++canvas.addEventListener('pointerdown', recordStartTimeAndPosition);
+canvas.addEventListener('pointerup', pickCountry);
 ```
 
 and with those changes it *seems* like it works to me.

threejs/threejs-indexed-textures-picking-and-highlighting.html

@@ -383,20 +383,7 @@ function main() {
     resetPalette();
   }
 
-  canvas.addEventListener('mouseup', pickCountry);
-
-  let lastTouch;
-  canvas.addEventListener('touchstart', (event) => {
-    // prevent the window from scrolling
-    event.preventDefault();
-    lastTouch = event.touches[0];
-  }, {passive: false});
-  canvas.addEventListener('touchmove', (event) => {
-    lastTouch = event.touches[0];
-  });
-  canvas.addEventListener('touchend', () => {
-    pickCountry(lastTouch);
-  });
+  canvas.addEventListener('pointerup', pickCountry);
 
   function resizeRendererToDisplaySize(renderer) {
     const canvas = renderer.domElement;

threejs/threejs-indexed-textures-picking-debounced.html

@@ -410,22 +410,8 @@ function main() {
     resetPalette();
   }
 
-  canvas.addEventListener('mousedown', recordStartTimeAndPosition);
-  canvas.addEventListener('mouseup', pickCountry);
-
-  let lastTouch;
-  canvas.addEventListener('touchstart', (event) => {
-    // prevent the window from scrolling
-    event.preventDefault();
-    lastTouch = event.touches[0];
-    recordStartTimeAndPosition(event.touches[0]);
-  }, {passive: false});
-  canvas.addEventListener('touchsmove', (event) => {
-    lastTouch = event.touches[0];
-  });
-  canvas.addEventListener('touchend', () => {
-    pickCountry(lastTouch);
-  });
+  canvas.addEventListener('pointerdown', recordStartTimeAndPosition);
+  canvas.addEventListener('pointerup', pickCountry);
 
   function resizeRendererToDisplaySize(renderer) {
     const canvas = renderer.domElement;

threejs/threejs-indexed-textures-picking.html

@@ -314,20 +314,7 @@ function main() {
     });
   }
 
-  canvas.addEventListener('mouseup', pickCountry);
-
-  let lastTouch;
-  canvas.addEventListener('touchstart', (event) => {
-    // prevent the window from scrolling
-    event.preventDefault();
-    lastTouch = event.touches[0];
-  }, {passive: false});
-  canvas.addEventListener('touchmove', (event) => {
-    lastTouch = event.touches[0];
-  });
-  canvas.addEventListener('touchend', () => {
-    pickCountry(lastTouch);
-  });
+  canvas.addEventListener('pointerup', pickCountry);
 
   function resizeRendererToDisplaySize(renderer) {
     const canvas = renderer.domElement;

threejs/threejs-indexed-textures-random-colors.html

@@ -360,20 +360,7 @@ function main() {
     });
   }
 
-  canvas.addEventListener('mouseup', pickCountry);
-
-  let lastTouch;
-  canvas.addEventListener('touchstart', (event) => {
-    // prevent the window from scrolling
-    event.preventDefault();
-    lastTouch = event.touches[0];
-  }, {passive: false});
-  canvas.addEventListener('touchmove', (event) => {
-    lastTouch = event.touches[0];
-  });
-  canvas.addEventListener('touchend', () => {
-    pickCountry(lastTouch);
-  });
+  canvas.addEventListener('pointerup', pickCountry);
 
   function resizeRendererToDisplaySize(renderer) {
     const canvas = renderer.domElement;