Yes! eRrOr …
Link!:
https://is.gd/9QQPBu
Better explanation:
So, if i hit R or the game starts by itself’s,
then the raft won’t fall…
There are two small problems in the code. First, there are two functions that are named gameStep()
. The second one should be named checkForGameOver()
and should look something like the following:
function checkForGameOver() {
if (raft.position.z > 9.8) {
gameOver = true;
scoreboard.stopTimer();
scoreboard.message('Du hast es geschafft!');
}
if (scoreboard.getTime() > 60) {
gameOver = true;
scoreboard.stopTimer();
scoreboard.message("Die Zeit ist abgelaufen. Zu langsam :(");
}
}
The second problem is in the reset()
function:
function reset() {
camera.position.set(0,-1,2);
camera.lookAt(new THREE.Vector3(0, 0, 0));
raft.add(camera);
scoreboard.message('');
scoreboard.resetTimer();
scoreboard.score(0);
raft.__dirtyPosition = true;
raft.position.set(0.75, 2, -9.6);
raft.setLinearVelocity(new THREE.Vector3(0, 0, 0));
var gameOver = false;
animate();
scene.onSimulationResume();
gameStep();
}
The fifth line from the bottom should not have a var
in front of it. That is, change this line:
var gameOver = false;
To be this instead:
gameOver = false;
Including the var
means that the gameOver
variable is only set inside the reset()
function, but elsewhere it is not set. That is, when the gameStep()
function runs, it checks for the gameOver
variable, but finds it not set and generates an error.
Hopefully that will get you working again.
-Chris
Could you send me the entire code copy-paste?
<body></body>
<script src="/three.js"></script>
<script src="/physi.js"></script>
<script src="/controls/OrbitControls.js"></script>
<script src="/scoreboard.js"></script>
<script src="/noise.js"></script>
<script>
// Physics settings
Physijs.scripts.ammo = '/ammo.js';
Physijs.scripts.worker = '/physijs_worker.js';
// The "scene" is where stuff in our game will happen:
var scene = new Physijs.Scene();
scene.setGravity(new THREE.Vector3( 0, -10, 0 ));
var flat = {flatShading: true};
var light = new THREE.AmbientLight('white', 0.2);
scene.add(light);
var sunlight = new THREE.DirectionalLight('white', 0.2);
sunlight.position.set(4, 6, 0);
sunlight.castShadow = true;
scene.add(sunlight);
var d = 10;
sunlight.shadow.camera.left = -d;
sunlight.shadow.camera.right = d;
sunlight.shadow.camera.top = d;
sunlight.shadow.camera.bottom = -d;
// The "camera" is what sees the stuff:
var aspectRatio = window.innerWidth / window.innerHeight;
var camera = new THREE.PerspectiveCamera(75, aspectRatio, 0.1, 100);
camera.position.set(-8, 8, 8);
scene.add(camera);
// The "renderer" draws what the camera sees onto the screen:
var renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setClearColor('skyblue');
renderer.shadowMap.enabled = true;
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// ******** START CODING ON THE NEXT LINE ********
var gameOver;
var ground = addGround();
var water = addWater();
var scoreboard = addScoreboard();
var raft = addRaft();
reset();
function addGround() {
var faces = 99;
var shape = new THREE.PlaneGeometry(10, 20, faces, faces);
var riverPoints = [];
var numVertices = shape.vertices.length;
var noiseMaker = new SimplexNoise();
for (var i=0; i<numVertices; i++) {
var vertex = shape.vertices[i];
var noise = 0.25 * noiseMaker.noise(vertex.x, vertex.y);
vertex.z = noise;
}
for (var j=50; j<numVertices; j+=100) {
var curve = 20 * Math.sin(7*Math.PI * j/numVertices);
var riverCenter = j + Math.floor(curve);
riverPoints.push(shape.vertices[riverCenter]);
for (var k=-20; k<20; k++) {
shape.vertices[riverCenter + k].z = -1;
}
}
shape.computeFaceNormals();
shape.computeVertexNormals();
var _cover = new THREE.MeshPhongMaterial({color: 'green', shininess: 0});
var cover = new Physijs.createMaterial(_cover, 0.8, 0.1);
var mesh = new Physijs.HeightfieldMesh(shape, cover, 0);
mesh.rotation.set(-0.475 * Math.PI, 0, 0);
mesh.receiveShadow = true;
mesh.castShadow = true;
mesh.riverPoints = riverPoints;
scene.add(mesh);
return mesh;
}
function addWater() {
var shape = new THREE.CubeGeometry(10, 20, 1);
var _cover = new THREE.MeshPhongMaterial({color: 'blue'});
var cover = new Physijs.createMaterial(_cover, 0, 0.6);
var mesh = new Physijs.ConvexMesh(shape, cover, 0);
mesh.rotation.set(-0.475 * Math.PI, 0, 0);
mesh.position.y = -0.8;
mesh.receiveShadow = true;
scene.add(mesh);
}
function addScoreboard() {
var scoreboard = new Scoreboard();
scoreboard.score(0);
scoreboard.timer();
scoreboard.help(
'Links/Rechpfeiltasten zum drehen. ' +
'Leertaste zum vorwärtsbewegen. ' +
'R zum neustart'
);
return scoreboard;
}
function addRaft() {
var shape = new THREE.TorusGeometry(0.1, 0.05, 8, 20);
var _cover = new THREE.MeshPhongMaterial({visible: false});
var cover = new Physijs.createMaterial(_cover, cover, 0.25);
var mesh = new Physijs.ConvexMesh(shape, cover, 0.25);
mesh.rotation.x = -Math.PI/2;
cover = new THREE.MeshPhongMaterial({color: 'orange'});
var tube = new THREE.Mesh(shape, cover);
tube.position.z = -0.08;
tube.castShadow = true;
mesh.add(tube);
mesh.tube = tube;
shape = new THREE.SphereGeometry(0.02);
cover = new THREE.MeshBasicMaterial({color: 'white'});
var rudder = new THREE.Mesh(shape, cover);
rudder.position.set(0.15, 0, 0);
tube.add(rudder);
scene.add(mesh);
mesh.setAngularFactor(new THREE.Vector3(0, 0, 0));
return mesh;
}
function reset() {
camera.position.set(0,-1,2);
camera.lookAt(new THREE.Vector3(0, 0, 0));
raft.add(camera);
scoreboard.message('');
scoreboard.resetTimer();
scoreboard.score(0);
raft.__dirtyPosition = true;
raft.position.set(0.75, 2, -9.6);
raft.setLinearVelocity(new THREE.Vector3(0, 0, 0));
gameOver = false;
animate();
scene.onSimulationResume();
gameStep();
}
// Animate motion in the game
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}
// animate();
// Run physics
function gameStep() {
if(gameOver) return;
checkForGameOver();
scene.simulate();
// Update physics 60 times a second so that motion is smooth
setTimeout(gameStep, 1000/60);
}
//gameStep();
function checkForGameOver() {
if (raft.position.z > 9.8) {
gameOver = true;
scoreboard.stopTimer();
scoreboard.message('Du hast es geschafft!');
}
if (scoreboard.getTime() > 60) {
gameOver = true;
scoreboard.stopTimer();
scoreboard.message("Die Zeit ist abgelaufen. Zu langsam :(");
}
}
document.addEventListener('keydown', sendKeyDown);
function sendKeyDown(event) {
var code = event.code;
if (code == 'ArrowLeft') rotateRaft(1);
if (code == 'ArrowRight') rotateRaft(-1);
if (code == 'ArrowDown') pushRaft();
if (code == 'Space') pushRaft();
if (code == 'KeyR') reset();
}
function rotateRaft(direction) {
raft.tube.rotation.z = raft.tube.rotation.z + direction * Math.PI/10;
}
function pushRaft() {
var angle = raft.tube.rotation.z;
var force = new THREE.Vector3(Math.cos(angle), 0, -Math.sin(angle));
raft.applyCentralForce(force);
}
</script>