Babylon.js Editor v1.2.0

Julien Moreau-Mathis
Babylon JS (unofficial)
3 min readAug 3, 2017

The previous version came with some new tools such as materials builder and more. Now the editor has been updated to the latest Babylon.js version (3.0) and comes with a new tool named “Behavior Editor”.

The editor is available at http://editor.babylonjs.com/

What’s new

  • Updated to latest Babylon.js version 3.0
  • All materials from materials library are available
  • Added Behavior Editor
  • Added Dynamic Texture Builder
  • Fixed Material Builder and Post-Process Builder

The Behavior Editor

The behavior editor allows you, as a developer, to attach custom scripts to your objects and type your code directly in the editor using the Monaco Editor.

The available objects are:

  • Lights (point light, spot light, etc.)
  • Cameras (universal, etc.)
  • Meshes
  • Scene

Opening the Behavior Editor

Once opened, a white page with an empty list is available. What you have to do is to select an object in the scene using the graph tool (on the right) and add a new script to it using the button “Add New”. Then, a default script is created.

Your script has an ugly name by default, you can rename it by double-clicking it in the list (on the left).

From now, you have two functions that you can fill:

  • start: function called when the script has been loaded
  • update: function called on each frame

Going further

In all scripts you can access the current node (mesh, pointlight, etc.) and they can all access the scene reference named “scene” as seen in the “start” function.

Writing scripts is cool but running and debugging them would be more cool! To test your scene with your custom scripts, just click the button “Test…” in the main toolbar and they’ll be all loaded and applied on your objects:

Debugging your scripts

Your scripts are developed directly from the editor but you can of course add break points and debug your scripts using the devtools of your browser:

Conclusion

As an example you can watch this video:

Attaching custom scripts to your objects can now offer more possibilities to developers as you can develop the majority of your game using these scripts.

Of course, the Behavior Editor will be improved by adding more tools and options, like enabling/disabling a script and more :)

--

--