8000 now raycaster is pure python · robinboot/pyscript@31ff939 · GitHub
[go: up one dir, main page]
Skip to content

Commit 31ff939

Browse files
verhulstmverhulstm
committed
now raycaster is pure python
1 parent a0340a6 commit 31ff939

File tree

1 file changed

+59
-81
lines changed

1 file changed

+59
-81
lines changed

‎pyscriptjs/examples/webgl/raycaster/index.html

Lines changed: 59 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -24,92 +24,20 @@
2424
<script defer src="/build/pyscript.js" 10000 ></script>
2525
<link rel="stylesheet" href="/build/pyscript.css" />
2626
<script>
27-
function create_objects(mathRandom, modularGruop) {
28-
for (var i = 0; i<30; i++) {
29-
var geometry = new THREE.IcosahedronGeometry(1);
30-
var material = new THREE.MeshStandardMaterial({flatShading:true, color:0x111111, transparent:false, opacity:1, wireframe:false});
31-
var cube = new THREE.Mesh(geometry, material);
32-
cube.speedRotation = Math.random() * 0.1;
33-
cube.positionX = mathRandom();
34-
cube.positionY = mathRandom();
35-
cube.positionZ = mathRandom();
36-
cube.castShadow = true;
37-
cube.receiveShadow = true;
38-
var newScaleValue = mathRandom(0.3);
39-
cube.scale.set(newScaleValue,newScaleValue,newScaleValue);
40-
cube.rotation.x = mathRandom(180 * Math.PI / 180);
41-
cube.rotation.y = mathRandom(180 * Math.PI / 180);
42-
cube.rotation.z = mathRandom(180 * Math.PI / 180);
43-
cube.position.set(cube.positionX, cube.positionY, cube.positionZ);
44-
modularGruop.add(cube);
45-
}
46-
}
47-
function generateParticle(mathRandom, particularGruop, num, amp = 2) {
48-
var gmaterial = new THREE.MeshPhysicalMaterial({color:0xFFFFFF, side:THREE.DoubleSide});
49-
var gparticular = new THREE.CircleGeometry(0.2,5);
50-
for (var i = 1; i < num; i++) {
51-
var pscale = 0.001+Math.abs(mathRandom(0.03));
52-
var particular = new THREE.Mesh(gparticular, gmaterial);
53-
particular.position.set(mathRandom(amp),mathRandom(amp),mathRandom(amp));
54-
particular.rotation.set(mathRandom(),mathRandom(),mathRandom());
55-
particular.scale.set(pscale,pscale,pscale);
56-
particular.speedValue = mathRandom(1);
57-
particularGruop.add(particular);
58-
}
59-
}
60-
var mouse = new THREE.Vector2(), INTERSECTED;
61-
var intersected;
6227

63-
function onMouseMove(event) {
64-
event.preventDefault();
65-
mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
66-
mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
67-
}
68-
function onMouseDown(event) {
69-
event.preventDefault();
70-
onMouseMove(event);
71-
raycaster.setFromCamera(mouse, camera);
72-
var intersected = raycaster.intersectObjects(modularGruop.children);
73-
if (intersected.length > 0) {
74-
cameraValue = false;
75-
if (INTERSECTED != intersected[0].object) {
76-
if (INTERSECTED) INTERSECTED.material.emissive.setHex(INTERSECTED.currentHex);
77-
78-
INTERSECTED = intersected[0].object;
79-
INTERSECTED.currentHex = INTERSECTED.material.emissive.getHex();
80-
INTERSECTED.material.emissive.setHex(0xFFFF00);
81-
//INTERSECTED.material.map = null;
82-
//lightBack.position.set(INTERSECTED.position.x,INTERSECTED.position.y,INTERSECTED.position.z);
83-
84-
TweenMax.to(camera.position, 1, {
85-
x:INTERSECTED.position.x,
86-
y:INTERSECTED.position.y,
87-
z:INTERSECTED.position.z+3,
88-
ease:Power2.easeInOut
89-
});
90-
91-
} else {
92-
if (INTERSECTED) INTERSECTED.material.emissive.setHex(INTERSECTED.currentHex);
93-
INTERSECTED = null;
94-
95-
}
96-
}
97-
console.log(intersected.length);
98-
}
99-
function onMouseUp(event) {
100-
101-
}
102-
103-
window.addEventListener('mousedown', onMouseDown, false);
104-
window.addEventListener('mouseup', onMouseUp, false);
105-
window.addEventListener('mousemove', onMouseMove, false);
10628
</script>
10729
<py-script>
10830
from pyodide import create_proxy, to_js
10931
from js import window
11032
from js import Math
11133
from js import THREE
112-
from js import create_objects, generateParticle, performance, mouse, intersected
34+
from js import performance
35+
from pyodide import to_js
36+
from js import Object
37+
38+
39+
40+
mouse = THREE.Vector2.new();
11341

11442
renderer = THREE.WebGLRenderer.new({"antialias":True})
11543
renderer.setSize(1000, 1000)
@@ -119,6 +47,13 @@
11947

12048
document.body.appendChild( renderer.domElement )
12149

50+
import js, pyodide
51+
def onMouseMove(event):
52+
event.preventDefault();
53+
mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
54+
mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
55+
js.document.addEventListener('mousemove', pyodide.create_proxy(onMouseMove))
56+
12257
camera = THREE.PerspectiveCamera.new( 35, window.innerWidth / window.innerHeight, 1, 500 )
12358
scene = THREE.Scene.new()
12459
cameraRange = 3
@@ -142,7 +77,50 @@
14277
particularGruop = THREE.Object3D.new();
14378
modularGruop = THREE.Object3D.new();
14479

145-
create_objects(mathRandom, modularGruop)
80+
perms = {"flatShading":True, "color":"#111111", "transparent":False, "opacity":1, "wireframe":False}
81+
perms = Object.fromEntries(to_js(perms))
82+
83+
particle_perms = {"color":"#FFFFFF", "side":THREE.DoubleSide}
84+
particle_perms = Object.fromEntries(to_js(particle_perms))
85+
86+
def create_cubes(mathRandom, modularGruop):
87+
i = 0
88+
while i < 30:
89+
geometry = THREE.IcosahedronGeometry.new();
90+
material = THREE.MeshStandardMaterial.new(perms);
91+
cube = THREE.Mesh.new(geometry, material);
92+
cube.speedRotation = Math.random() * 0.1;
93+
cube.positionX = mathRandom();
94+
cube.positionY = mathRandom();
95+
cube.positionZ = mathRandom();
96+
cube.castShadow = True;
97+
cube.receiveShadow = True;
98+
newScaleValue = mathRandom(0.3);
99+
cube.scale.set(newScaleValue,newScaleValue,newScaleValue);
100+
cube.rotation.x = mathRandom(180 * Math.PI / 180);
101+
cube.rotation.y = mathRandom(180 * Math.PI / 180);
102+
cube.rotation.z = mathRandom(180 * Math.PI / 180);
103+
cube.position.set(cube.positionX, cube.positionY, cube.positionZ);
104+
modularGruop.add(cube);
105+
i += 1
106+
107+
create_cubes(mathRandom, modularGruop)
108+
109+
110+
def generateParticle(mathRandom, particularGruop, num, amp = 2):
111+
gmaterial = THREE.MeshPhysicalMaterial.new(particle_perms);
112+
gparticular = THREE.CircleGeometry.new(0.2,5);
113+
i = 0
114+
while i < num:
115+
pscale = 0.001+Math.abs(mathRandom(0.03));
116+
particular = THREE.Mesh.new(gparticular, gmaterial);
117+
particular.position.set(mathRandom(amp),mathRandom(amp),mathRandom(amp));
118+
particular.rotation.set(mathRandom(),mathRandom(),mathRandom());
119+
particular.scale.set(pscale,pscale,pscale);
120+
particular.speedValue = mathRandom(1);
121+
particularGruop.add(particular);
122+
i += 1
123+
146124
generateParticle(mathRandom, particularGruop, 200, 2)
147125

148126
sceneGruop.add(particularGruop);
@@ -210,7 +188,7 @@
210188

211189
camera.lookAt(scene.position)
212190
renderer.render( scene, camera )
213-
await asyncio.sleep(0.01)
191+
await asyncio.sleep(0.02)
214192

215193

216194
</py-script>

0 commit comments

Comments
 (0)
0