From 31ff939f8f8f77f746d25f23b9cb735f1073e6b1 Mon Sep 17 00:00:00 2001
From: Michael Verhulst <michael@terminallabs.com>
Date: Wed, 20 Apr 2022 13:00:21 -0500
Subject: [PATCH] now raycaster is pure python

---
 .../examples/webgl/raycaster/index.html       | 140 ++++++++----------
 1 file changed, 59 insertions(+), 81 deletions(-)

diff --git a/pyscriptjs/examples/webgl/raycaster/index.html b/pyscriptjs/examples/webgl/raycaster/index.html
index 1b69cfc..2966abd 100755
--- a/pyscriptjs/examples/webgl/raycaster/index.html
+++ b/pyscriptjs/examples/webgl/raycaster/index.html
@@ -24,92 +24,20 @@
 <script defer src="/build/pyscript.js"></script>
 <link rel="stylesheet" href="/build/pyscript.css" />
 <script>
-function create_objects(mathRandom, modularGruop) {
-  for (var i = 0; i<30; i++) {
-    var geometry = new THREE.IcosahedronGeometry(1);
-    var material = new THREE.MeshStandardMaterial({flatShading:true, color:0x111111, transparent:false, opacity:1, wireframe:false});
-    var cube = new THREE.Mesh(geometry, material);
-    cube.speedRotation = Math.random() * 0.1;
-    cube.positionX = mathRandom();
-    cube.positionY = mathRandom();
-    cube.positionZ = mathRandom();
-    cube.castShadow = true;
-    cube.receiveShadow = true;
-    var newScaleValue = mathRandom(0.3);
-    cube.scale.set(newScaleValue,newScaleValue,newScaleValue);
-    cube.rotation.x = mathRandom(180 * Math.PI / 180);
-    cube.rotation.y = mathRandom(180 * Math.PI / 180);
-    cube.rotation.z = mathRandom(180 * Math.PI / 180);
-    cube.position.set(cube.positionX, cube.positionY, cube.positionZ);
-    modularGruop.add(cube);
-  }
-}
-function generateParticle(mathRandom, particularGruop, num, amp = 2) {
-  var gmaterial = new THREE.MeshPhysicalMaterial({color:0xFFFFFF, side:THREE.DoubleSide});
-  var gparticular = new THREE.CircleGeometry(0.2,5);
-  for (var i = 1; i < num; i++) {
-    var pscale = 0.001+Math.abs(mathRandom(0.03));
-    var particular = new THREE.Mesh(gparticular, gmaterial);
-    particular.position.set(mathRandom(amp),mathRandom(amp),mathRandom(amp));
-    particular.rotation.set(mathRandom(),mathRandom(),mathRandom());
-    particular.scale.set(pscale,pscale,pscale);
-    particular.speedValue = mathRandom(1);
-    particularGruop.add(particular);
-  }
-}
-var mouse = new THREE.Vector2(), INTERSECTED;
-var intersected;
 
-function onMouseMove(event) {
-  event.preventDefault();
-  mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
-  mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
-}
-function onMouseDown(event) {
-  event.preventDefault();
-  onMouseMove(event);
-  raycaster.setFromCamera(mouse, camera);
-  var intersected = raycaster.intersectObjects(modularGruop.children);
-  if (intersected.length > 0) {
-    cameraValue = false;
-    if (INTERSECTED != intersected[0].object) {
-      if (INTERSECTED) INTERSECTED.material.emissive.setHex(INTERSECTED.currentHex);
-
-      INTERSECTED = intersected[0].object;
-      INTERSECTED.currentHex = INTERSECTED.material.emissive.getHex();
-      INTERSECTED.material.emissive.setHex(0xFFFF00);
-      //INTERSECTED.material.map = null;
-      //lightBack.position.set(INTERSECTED.position.x,INTERSECTED.position.y,INTERSECTED.position.z);
-
-      TweenMax.to(camera.position, 1, {
-        x:INTERSECTED.position.x,
-        y:INTERSECTED.position.y,
-        z:INTERSECTED.position.z+3,
-        ease:Power2.easeInOut
-      });
-
-    } else {
-      if (INTERSECTED) INTERSECTED.material.emissive.setHex(INTERSECTED.currentHex);
-      INTERSECTED = null;
-
-    }
-  }
-  console.log(intersected.length);
-}
-function onMouseUp(event) {
-
-}
-
-window.addEventListener('mousedown', onMouseDown, false);
-window.addEventListener('mouseup', onMouseUp, false);
-window.addEventListener('mousemove', onMouseMove, false);
 </script>
 <py-script>
 from pyodide import create_proxy, to_js
 from js import window
 from js import Math
 from js import THREE
-from js import create_objects, generateParticle, performance, mouse, intersected
+from js import performance
+from pyodide import to_js
+from js import Object
+
+
+
+mouse = THREE.Vector2.new();
 
 renderer = THREE.WebGLRenderer.new({"antialias":True})
 renderer.setSize(1000, 1000)
@@ -119,6 +47,13 @@ renderer.shadowMap.needsUpdate = True
 
 document.body.appendChild( renderer.domElement )
 
+import js, pyodide
+def onMouseMove(event):
+  event.preventDefault();
+  mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
+  mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
+js.document.addEventListener('mousemove', pyodide.create_proxy(onMouseMove))
+
 camera = THREE.PerspectiveCamera.new( 35, window.innerWidth / window.innerHeight, 1, 500 )
 scene = THREE.Scene.new()
 cameraRange = 3
@@ -142,7 +77,50 @@ def mathRandom(num = 1):
 particularGruop =  THREE.Object3D.new();
 modularGruop =  THREE.Object3D.new();
 
-create_objects(mathRandom, modularGruop)
+perms = {"flatShading":True, "color":"#111111", "transparent":False, "opacity":1, "wireframe":False}
+perms = Object.fromEntries(to_js(perms))
+
+particle_perms = {"color":"#FFFFFF", "side":THREE.DoubleSide}
+particle_perms = Object.fromEntries(to_js(particle_perms))
+
+def create_cubes(mathRandom, modularGruop):
+  i = 0
+  while i < 30:
+    geometry = THREE.IcosahedronGeometry.new();
+    material = THREE.MeshStandardMaterial.new(perms);
+    cube = THREE.Mesh.new(geometry, material);
+    cube.speedRotation = Math.random() * 0.1;
+    cube.positionX = mathRandom();
+    cube.positionY = mathRandom();
+    cube.positionZ = mathRandom();
+    cube.castShadow = True;
+    cube.receiveShadow = True;
+    newScaleValue = mathRandom(0.3);
+    cube.scale.set(newScaleValue,newScaleValue,newScaleValue);
+    cube.rotation.x = mathRandom(180 * Math.PI / 180);
+    cube.rotation.y = mathRandom(180 * Math.PI / 180);
+    cube.rotation.z = mathRandom(180 * Math.PI / 180);
+    cube.position.set(cube.positionX, cube.positionY, cube.positionZ);
+    modularGruop.add(cube);
+    i += 1
+
+create_cubes(mathRandom, modularGruop)
+
+
+def generateParticle(mathRandom, particularGruop, num, amp = 2):
+  gmaterial = THREE.MeshPhysicalMaterial.new(particle_perms);
+  gparticular = THREE.CircleGeometry.new(0.2,5);
+  i = 0
+  while i < num:
+    pscale = 0.001+Math.abs(mathRandom(0.03));
+    particular = THREE.Mesh.new(gparticular, gmaterial);
+    particular.position.set(mathRandom(amp),mathRandom(amp),mathRandom(amp));
+    particular.rotation.set(mathRandom(),mathRandom(),mathRandom());
+    particular.scale.set(pscale,pscale,pscale);
+    particular.speedValue = mathRandom(1);
+    particularGruop.add(particular);
+    i += 1
+
 generateParticle(mathRandom, particularGruop, 200, 2)
 
 sceneGruop.add(particularGruop);
@@ -210,7 +188,7 @@ while True:
 
   camera.lookAt(scene.position)
   renderer.render( scene, camera )
-  await asyncio.sleep(0.01)
+  await asyncio.sleep(0.02)
 
 
 </py-script>