In my software, I've created four Physijs.BoxMesh(...) shapes, all nested within an independent object. My goal is to rotate these four physics boxes as a whole, but once they are grouped under the 5th object, they no longer respond to rotation commands. Is there a way to rotate objects contained within another object?
EDIT : This is the entirety of my code:
<body></body>
<script src="http://gamingJS.com/Three.js"></script>
<script src="http://gamingJS.com/physi.js"></script>
<script src="http://gamingJS.com/ChromeFixes.js"></script>
<script>
// Physics settings
Physijs.scripts.ammo = 'http://gamingJS.com/ammo.js';
Physijs.scripts.worker = 'http://gamingJS.com/physijs_worker.js';
// Setting up the game environment:
var scene = new Physijs.Scene({ fixedTimeStep: 2 / 60 });
scene.setGravity(new THREE.Vector3(0, -100, 0));
// Creating the camera:
var width = window.innerWidth,
height = window.innerHeight,
aspect_ratio = width / height;
var camera = new THREE.PerspectiveCamera(75, aspect_ratio, 1, 10000);
camera.position.z = 500;
scene.add(camera);
// Displaying the rendered content:
var renderer = new THREE.CanvasRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
document.body.style.backgroundColor = '#ffffff';
// ******** CODING BEGINS ON THE NEXT LINE ********
var m1 = new Physijs.BoxMesh(new THREE.CubeGeometry(20, 150, 20), new THREE.MeshBasicMaterial({color:0x000000}));
var m2 = new Physijs.BoxMesh(new THREE.CubeGeometry(20, 150, 20), new THREE.MeshBasicMaterial({color:0x000000}));
var m3 = new Physijs.BoxMesh(new THREE.CubeGeometry(20, 150, 20), new THREE.MeshBasicMaterial({color:0x000000}));
var m4 = new Physijs.BoxMesh(new THREE.CubeGeometry(20, 150, 20), new THREE.MeshBasicMaterial({color:0x000000}));
var ground = new Physijs.BoxMesh(new THREE.CubeGeometry(5e2, 10, 5e2), new THREE.MeshBasicMaterial({color:0x0000ff}), 0);
var tars = new Physijs.BoxMesh(new THREE.CubeGeometry(1, 1, 1), new THREE.MeshBasicMaterial());
m1.__dirtyPosition = true;
m1.position.x = -30;
m2.__dirtyPosition = true;
m2.position.x = -10;
m3.__dirtyPosition = true;
m3.position.x = 10;
m4.__dirtyPosition = true;
m4.position.x = 30;
ground.__dirtyPosition = true;
ground.position.y = -300;
tars.add(m1);
tars.add(m2);
tars.add(m3);
tars.add(m4);
scene.add(tars);
scene.add(ground);
document.addEventListener('keydown', function(event) {
switch(event.keyCode) {
case 13:
m1.setAngularVelocity(new THREE.Vector3(1, 0, 0));
break;
case 100:
m2.setAngularVelocity(new THREE.Vector3(1, 0, 0));
break;
case 101:
m3.setAngularVelocity(new THREE.Vector3(1, 0, 0));
break;
case 102:
m4.setAngularVelocity(new THREE.Vector3(1, 0, 0));
break;
}
});
// Animation loop for the game
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}
animate();
// Running the physics engine
function gameStep() {
scene.simulate();
setTimeout(gameStep, 1000/60);
}
gameStep();
</script>