Plz help(problem with code from chapter 19)

#1

So, i wanted to make the rafting game from chapter 19. But when i made it, all it displayed was black screen. There were no errors in the code. But there were many errors in the javascript console:

[Deprecation] Application Cache API manifest selection is deprecated and will be removed in M85, around August 2020. See https://www.chromestatus.com/features/6192449487634432 for more details.

www.code3dgames.com/:1 Creating Application Cache with manifest https://www.code3dgames.com/3de/editor.appcache
www.code3dgames.com/:1 Application Cache Checking event
www.code3dgames.com/:1 Application Cache Error event: Invalid or missing manifest origin trial token: https://www.code3dgames.com/3de/editor.appcache
appcache.js:4 Uncaught TypeError: Cannot read property ‘addEventListener’ of undefined
at appcache.js:4
​ THREE.WebGLRenderer 87
code.html:5 Uncaught SyntaxError: Unexpected token ‘<’
/3de/packages/ice_code_editor/html/code3dgames.com/controls/OrbitControls.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/scoreboard.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/noise.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/physi.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/controls/OrbitControls.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/scoreboard.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/noise.js:1 Failed to load resource: the server responded with a status of 404 ()
code.html:3 Uncaught ReferenceError: Physijs is not defined
_.html:13 Uncaught TypeError: Cannot read property ‘style’ of null
/3de/packages/ice_code_editor/html/code3dgames.com/scoreboard.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/noise.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/controls/OrbitControls.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/physi.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/three.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/physi.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/controls/OrbitControls.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/scoreboard.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/noise.js:1 Failed to load resource: the server responded with a status of 404 ()
code.html:9 Uncaught ReferenceError: Physijs is not defined
_.html:13 Uncaught TypeError: Cannot read property ‘style’ of null
/3de/packages/ice_code_editor/html/code3dgames.com/physi.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/controls/OrbitControls.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/scoreboard.js:1 Failed to load resource: the server responded with a status of 404 ()
/3de/packages/ice_code_editor/html/code3dgames.com/noise.js:1 Failed to load resource: the server responded with a status of 404 ()
code.html:9 Uncaught ReferenceError: Physijs is not defined
_.html:13 Uncaught TypeError: Cannot read property ‘style’ of null
​ THREE.WebGLRenderer 87
code.html:42 Uncaught TypeError: Cannot read property ‘appendChild’ of null
​ THREE.WebGLRenderer 87
code.html:59 Uncaught ReferenceError: shapeshape is not defined
​ THREE.WebGLRenderer 87
code.html:40 Uncaught TypeError: Cannot read property ‘appendChild’ of null
code.html:30 Uncaught SyntaxError: Unexpected token ‘;’
code.html:30 Uncaught SyntaxError: Unexpected token ‘.’
code.html:30 Uncaught SyntaxError: Unexpected token ‘.’
​ THREE.WebGLRenderer 87
code.html:40 Uncaught TypeError: Cannot read property ‘appendChild’ of null
​ THREE.WebGLRenderer 87
code.html:40 Uncaught TypeError: Cannot read property ‘appendChild’ of null
​ THREE.WebGLRenderer 87
code.html:39 Uncaught TypeError: Cannot read property ‘appendChild’ of null
​ THREE.WebGLRenderer 87
code.html:59 Uncaught ReferenceError: shapeshape is not defined
​ THREE.WebGLRenderer 87
code.html:59 Uncaught ReferenceError: shapeshape is not defined
​ THREE.WebGLRenderer 87
code.html:59 Uncaught ReferenceError: shapeshape is not defined
​ THREE.WebGLRenderer 87
code.html:59 Uncaught ReferenceError: shapeshape is not defined
three.js:20919 THREE.WebGLRenderer 87
code.html:59 Uncaught ReferenceError: shapeshape is not defined
at addGround (code.html:59)
at code.html:45
at _.html:10

here’s the code:

plz help

#2

The JavaScript console does not clear out errors as you make changes. If you reload the 3DE web page, many of those will go away. It looks like the most recent error is:

code.html:59 Uncaught ReferenceError: shapeshape is not defined
at addGround (code.html:59)
at code.html:45
at _.html:10

That is reporting that the code is trying to do something with a variable named shapeshape on line 59, but there is no such variable (shapeshape is not defined). I suspect that you need to change that to just shape on line 59 to fix the current problem.

Unfortunately, this forum seems to have lost your code, so I cannot be sure what the problem is. Sorry about that, this forum can be quite picky about including code. If you are still having problems after changing the shapeshape variable, please try sharing your code again as described in this welcome post. That is, either use the Share option in 3DE, or copy & paste your code in between “3 backtick lines”

Explain how your code is misbehaving...

```
// Paste your code here
```

Include any more information that you like here...

-Chris

#3

so now i fixed it and 3de ended up crashing and it did not help anything when i used the edit-only mode. So i started again and yay there is another error.

JavaScript console:

[Deprecation] Application Cache API manifest selection is deprecated and will be removed in M85, around August 2020. See https://www.chromestatus.com/features/6192449487634432 for more details.
www.code3dgames.com/:1 Creating Application Cache with manifest https://www.code3dgames.com/3de/editor.appcache
www.code3dgames.com/:1 Application Cache Checking event
www.code3dgames.com/:1 Application Cache Error event: Invalid or missing manifest origin trial token: https://www.code3dgames.com/3de/editor.appcache
DevTools failed to load source map: Could not load content for chrome-extension://pgjjikdiikihdfpoppgaidccahalehjh/webspeed.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
appcache.js:4 Uncaught TypeError: Cannot read property ‘addEventListener’ of undefined
at appcache.js:4
(anonymous) @ appcache.js:4
load (async)
(anonymous) @ appcache.js:2
code.html:31 Uncaught TypeError: Cannot read property ‘setClearColor’ of undefined
at code.html:31
(anonymous) @ code.html:31
code.html:7 Uncaught TypeError: Cannot read property ‘setSize’ of undefined
at code.html:7
at (index):15
(anonymous) @ code.html:7
(anonymous) @ (index):15
setTimeout (async)
(anonymous) @ (index):15

and here’s the 3DE link:

https://is.gd/BrmaYk

#4

The immediate problem is on line 31 (and 32):

  renderer.setClearColor('skyblue');
  renderer.ShadowMap.enabled = true;

These were added before the renderer variable was added (currently on line 37). To get rid of that, move those two lines after the renderer is defined:

  // 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);

The 4th line in there has a typo – it needs to be shadowMap (first letter lowercase):

  renderer.shadowMap.enabled = true;

There are a few other small typos elsewhere in the code. One needs to be changed to THREE.MeshPhongMaterial. Another is Physijs.HeightfieldMesh. The last needs to be Math.PI.

Hope that helps,

-Chris

#5

thanks! I‘ll try it out.