@c-frame/aframe-physics-system
Version:
Physics system for A-Frame VR, built on Cannon.js & Ammo.js
53 lines (50 loc) • 2.44 kB
HTML
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no,user-scalable=no,maximum-scale=1">
<title>Examples • Compound CANNON Worker</title>
<script src="https://aframe.io/releases/1.7.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-environment-component@1.5.0/dist/aframe-environment-component.min.js"></script>
<script src="../../dist/aframe-physics-system.js"></script>
<script src="../components/force-pushable.js"></script>
<link rel="stylesheet" href="../styles.css">
</head>
<body>
<div class="text-overlay">
<p>Compund shape, using the Cannon Worker driver (not working).</p>
<p>Click when the red reticle is over the sphere to apply a force to it.</p>
</div>
<a class="code-link"
target="_blank"
href="https://github.com/c-frame/aframe-physics-system/blob/master/examples/cannon-worker/compound.html">
view code
</a>
<a-scene environment physics="driver: worker; debug: true;">
<!-- Player -->
<a-entity camera look-controls wasd-controls position="0 1.6 0">
<a-entity cursor
raycaster="objects:[force-pushable]"
position="0 0 -0.5"
geometry="primitive: circle; radius: 0.01; segments: 4;"
material="color: #FF4444; shader: flat"></a-entity>
</a-entity>
<a-entity static-body="shape: sphere; sphereRadius: 0.02;" hand-controls="hand: left" grab></a-entity>
<a-entity static-body="shape: sphere; sphereRadius: 0.02;" hand-controls="hand: right" grab></a-entity>
<!-- Terrain -->
<a-box width="75" height="0.1" depth="75" static-body visible="false"></a-box>
<!-- Blocks -->
<a-sphere radius="0.25" position="0 4 -2" color="red"
body="type: dynamic; shape: none; mass: 5;"
shape__main="shape: cylinder;
height: 0.36;
radiusTop: 0.24;
radiusBottom: 0.24;"
shape__handle="shape: box;
halfExtents: 0.15 0.18 0.04;
offset: 0.4 0 0;"
force-pushable
></a-sphere>
</a-scene>
</body>
</html>