Javascript: screen.clear is not a function

Hi,

I just tried my first ever project on microcode. I copy-pasted the javascript example:

init = function() {
  x = 0 ;
  y = 0 ;
}

update = function() {
  if (keyboard.LEFT) { x = x-1 ; }
  if (keyboard.RIGHT) { x = x+1 ; }
  if (keyboard.UP) { y = y+1 ; }
  if (keyboard.DOWN) { y = y-1 ; }
}

draw = function() {
  screen.clear()
  screen.drawSprite("icon",x,y,50)
}

This is a verbatim copy of what was in the docs with no changes. I hit play.

I got an error immediately:

TypeError: screen.clear is not a function

Do I need to initialise screen when using javascript? The documenation for javascript is very short and doesn't really provide any info here, so I am not sure if there is anything extra that needs to be done to use javascript apart from in the project's advanced options.

Thanks!

screen.clear missing could indicate that you switched to another of the proposed graphics libs. Look in your project options and make sure you are set to basic graphics API.

Let me know! I just tried copying / pasting the default JavaScript example from the doc and it worked fine for me.

Thanks for your reply - this issue with the libraries was surprising. The error message was not especially clear. I had enabled the micro3D option and originally ported the micro3D globe demo to javascript initially and had similar errors before resorting to the most basic example.

How are you supposed to use the screen object if micro3D is enabled? With micro3D enabled screen.render is also causing issues TypeError: Cannot read properties of undefined (reading 'render')

Edit: line numbers in the error message would be super-useful.

Error reporting in JavaScript is definitely to be improved, I will work on it very soon! (I am just finishing to rework this for Python as it was bad there too).

When you make changes to your project settings (language or graphics lib), make sure to hit reload in the code/run tab to launch your project again.

I just tried this (JavaScript + micro 3D) and it is working fine for me:

init = function() {
  scene = new M3D.Scene()
  camera = new M3D.Camera()
  light = new M3D.DirectionalLight(new M3D.Vector3(-1,-.5,1))
  light.setColor("rgb(255,217,198)")

  sphere = new M3D.Sphere()
  sphere.rotation.z = Math.PI
  scene.add(sphere)

  scene.setBackground("rgb(9,0,28)")
  
  sphere.setColor("rgb(0,57,170)","specular")
  sphere.setTexture("icon")

  camera.position.z = -2
}

update = function() {
  sphere.rotation.y += .01
}

draw = function() {
  screen.render(scene,camera)
}

Right ok thanks - seems like hitting refresh in the browser was the solution to getting this working, no more errors. I did not expect that! Thanks for your help.

I created a public javascript port of the Babylon.js demo based on your original one: https://microstudio.dev/i/toothypeg/javascriptbabylonjs/

Seems to be working ok now - cheers.