Blender to Playground - Realtime Link

Demos and projects
, ,
1

Hello :slight_smile:

For a personal project, I was working on shading on Blender, for BabylonJS. In order to reduce time spent on exporting from Blender, and reloading on BabylonJS side, I ended up writing a script to do so :

On Blender side (LEFT)

  • Python script hosts a threaded HTTP server
  • Export (or delete) the updated meshes in .GLB files, in a folder along side the .blend file
  • Updated a status.json file for current state (modif timestamps)
  • I serve the HDRI texture as well

On BJS Playground side (RIGHT)

  • Env HDRI loaded directly from Blender
  • I fetch the status.json to retreive for update (new timestamps, addition, deletion)
  • I dispose or import the new updated meshes based on the content of this update

The nice point is that blender is hosting the HTTP server locally, but the Playground can still access to the files via 127.0.0.1 because Iā€™ve set the header right on Blender side (Access-Control-Allow-Origin) in order not to trigger a CORS policy error on the Playground trying to load external source :slight_smile:

So there is no specific BabylonJS server or implementation or whatever, just a regular ā€œonlineā€ Playground, and a ā€œRunā€ button to hit on Blender.

NB : For now an update is triggered only going from EDIT to OBJECT modeā€¦ Which means after only a shader edit, just a double tap on TAB key will updateā€¦

Whatever, for me itā€™s very handy !
If many people are interested, I can share the source code, eventually :slight_smile:

++
Tricotou

15 Likes
2

Amazing!! :heart_eyes_cat: Gimme the source :wink:

1 Like
3

Straight forward, as usual :joy:

Here it is, budy :stuck_out_tongue:
Blender_to_Playground.zip (314.2 KB)

Steps to test :

  • Open main.blend and launch the script
  • Run the main.js in a playground but itā€™s already saved in this PLAYGROUND
  • Add / Remove / Edit meshes (and their materials) in Blender

NB : Itā€™s a quick & dirty solution to be used by meā€¦ Not initially meant to share this so donā€™t panic when everything will mess up or whatever :grin:

3 Likes
4

Iā€™m getting a lot of these after I moved a face in Edit mode and switched back to Object mode:

image
image898Ɨ1392 177 KB

However updating the scene still works (Iā€™ve removed the cube and added a sphere).

image
image888Ɨ598 151 KB

Meanwhile this is ducking marvelous!!

5

Now, thatā€™s smart and appreciated. I wonder if somehow we could include this ā€˜routineā€™ in the next PG version. Providing we would add user identification and trusted users servers?

6

Yeah itā€™s a known issue due to lack of code cleaning on my side :stuck_out_tongue_closed_eyes:
It happens only if you hit ā€œRunā€ twice in the Playground, because Iā€™m using setTimeout which is never reset. After Running the Playground again, there is still the routine (pure JS from the previous session) running, on a disposed Scene.

By the way, there are tons of such bugs you can trigger by using setInterval or setTimeout in the Playground. I had proposed an edit of these functions within the Playground in this topic but as @RaananW said, itā€™s better not to tweet native API. Best is to do clean code :stuck_out_tongue_closed_eyes: . I was missing a clean using scene.onDisposeObservable. Here is a fixed Playground

For sure there is something to be done here. I thought about it multiple times while helping people here on the forum, sometimes you just want to send them a Playground directly linked to one of their assets hosted on their server, and BOOM you hit CORS policy and cannot loadā€¦ ^^

3 Likes