Hello All,
This is my first engine only project. I am simply trying to make a cube fall with gravity as it would in the editor when it has a rigidbody
and a collision
component. However, the cube is static. My code is as follows.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Flip It</title>
<style>
body { margin: 0; padding: 0; }
canvas { width: 100%; height: 100%; }
</style>
</head>
<body>
<script src="https://code.playcanvas.com/playcanvas-stable.js"></script>
<script src="http://code.playcanvas.com/ammo.751ec5f.js"></script>
<canvas id="application-canvas"></canvas>
<script>
var canvas = document.getElementById("application-canvas");
// Start and init Application
var app = new pc.Application(canvas);
app.start();
app.setCanvasFillMode(pc.FILLMODE_FILL_WINDOW);
app.setCanvasResolution(pc.RESOLUTION_AUTO);
app.systems.rigidbody.setGravity(0, -9.8, 0);
// Create camera
var camera = new pc.Entity();
camera.addComponent("camera", { clearColor: new pc.Color(0.8, 0.8, 0.8) });
app.root.addChild(camera);
camera.setPosition(0, 0, 7);
// Create cube
var box = new pc.Entity();
box.addComponent("model", { type: "box" });
box.addComponent("rigidbody", { type: "dynamic" });
box.addComponent("collision", { type: "box", halfExtents: (0.5, 0.5, 0.5) });
app.root.addChild(box);
box.rotate(10, 15, 0);
// Create light
var light = new pc.Entity();
light.addComponent('light');
light.rotate(45, 0, 0);
app.root.addChild(light);
app.scene.ambientLight = new pc.Color(0.2, 0.2, 0.2);
// Create cube's material
var boxMaterial = new pc.PhongMaterial();
boxMaterial.diffuse.set(0, 0.58, 0.86);
boxMaterial.update();
box.model.model.meshInstances[0].material = boxMaterial;
</script>
</body>
</html>
I am running my code in https://trinket.io/library/trinkets/596f361d1b.
Could someone please help me integrate Physics into my project?