Saving and exporting into a web project from the Babylon Editor

Hello, I am a new user to the BabylonJs editor and I have been working in builds 3.0.0 and 3.1.0. I’ve had some issues with the saving of the scene.babylon file and also loading that scene into a web project. I documented the issue here:

but I wanted to also post here to make sure I wasn’t doing something obviously incorrect. I know that @julien-moreau is the core maintainer of the editor, and from what I can tell its an absolutely incredible tool!

Is this a bug or am I doing it wrong? If I’m doing it wrong I’m happy to update the docs so that future users don’t make my mistake (just point me to them and I’ll make the changes). If its a bug, is my issue clear? Is there anything I can do to help. I don’t mind pulling down the electron project and attempting a PR

Thank you!!

Hello and welcome to the forum !!!

Thanks for the feedback and I bet @julien-moreau will solve it in no time :slight_smile:

2 Likes

@the-simian
As seen on Github, it has been fixed and will be released ASAP :slight_smile:

Let’s continue the discussion here for all other feedbacks and/or bug reports about exporting final scenes from the editor :slight_smile:

2 Likes

@julien-moreau I am beyond impressed how fast you worked on that. Thank you so much for looking into this. I will happily continue the conversation here. I will pull the new release down ASAP, and give it a whirl.

Again, thank you. Simply incredible response time.

1 Like

Hey @the-simian
Version 3.1.1 has just been deployed! Getting Started - Babylon.js Documentation
Feel free to provide any feedback. Thanks a lot!

I have scheduled time to look into this today @julien-moreau ! Thank you again. I will be looking for ways I can help, this is a really great utility!

@julien-moreau I have just tested the latest build!
Firstly it does seem like the issue of those temporary files being written has been fixed, which is great. There is still an error on a ‘fresh load’ where there appears to be an error related to loading assets. These notes are with exporting as a .babylon file, but I will also try it out with GLTF too, since its also JSON.

I am looking into this, but here is what I can see so far:

  1. The new scene.babylon does seem to be well-formed JSON. I can put a .json extension in VS code and it auto-formats correctly, no problem

  2. It is by no means empty either, and as far as I can see, everything I’d expect to be in here is here. I even see that you make a default freelook camera ‘just in case’ one was never assigned.

Despite this, I am getting this message on the default scene in the editor:

BJS - [17:05:22]: Unable to load from ./scene/scene.babylon: loadAssets of unknown
	Lights:
		Name: Spot Light, type: Spot
	Materials:
		Name: Amiga
		Name: default material
		Name: Wood
		Name: Sphere PBR
		Name: Ground
		Name: Documentation
		Name: Skybox
		Name: Custom material

I’ve checked the obvious things, every resource appears to be fetching and serves correct:

As you see everything is 200

the only questionable message is a warning:

BJS - [17:05:22]: BABYLON.CustomEditorMaterial not found, you may have missed an import.

And this trace:

 /Misc/logger.ts.Logger._WarnEnabled	@	logger.ts:71
./Misc/tools.ts.Tools.Instantiate	@	tools.ts:292
./Materials/material.ts.Material.Parse	@	material.ts:1171
loadAssetContainer	@	babylonFileLoader.ts:195
load	@	babylonFileLoader.ts:722
(anonymous)	@	sceneLoader.ts:772
dataCallback	@	sceneLoader.ts:388
onReadyStateChange	@	tools.ts:915
XMLHttpRequest.send (async)		
(anonymous)	@	VM1040:1
./Misc/webRequest.ts.WebRequest.send	@	webRequest.ts:119
retryLoop	@	tools.ts:942
requestFile	@	tools.ts:945
./Misc/tools.ts.Tools.LoadFile	@	tools.ts:986
manifestChecked	@	sceneLoader.ts:412
Database	@	database.ts:69
./Offline/database.ts._Engines_engine__WEBPACK_IMPORTED_MODULE_3__.Engine.OfflineProviderFactory	@	database.ts:10
./Loading/sceneLoader.ts.SceneLoader._loadData	@	sceneLoader.ts:444
./Loading/sceneLoader.ts.SceneLoader.Append	@	sceneLoader.ts:769
./Loading/sceneLoader.ts.SceneLoader.Load	@	sceneLoader.ts:679
Game.run	@	game.ts:36
(anonymous)	@	(index):74
Promise.then (async)		
(anonymous)	@	(index):71

I am still working through this, but if there’s something very obvious I am overlooking I’d love to know.

One thing I did notice is that the meshes: [] in the scene was an empty array.

There is an active camera and there are materials. There is a single spotlight in lights. There is a defualt material too. This might be the wrong place to look (in the fully formed scene).

Do you have an example of a fully formed, working templated project that your editor would expectedly have exported? maybe I could compare that to my outputted project and zero in on the problem!

As always thank you for helping me out. I like the editor and I think it is close to being used in a workflow where I can start working in the code after I export!

Thanks a lot @the-simian for reporting!
I think the issue is just coming from the tool « Materials Editor » which created a material of type CustomEditorMaterial (that exists only if the BabylonJS-editor extensions are loaded in the project). Can you try to remove the material from the project using the tool and re-export?

For informations, the «Materials Editor » tool is going to be replaced by the shader builder of BabylonJS. If the error comes from that, i think this tool will be removed definitely as it is just an epic fail.

Don’t have my PC now but going to fix that tomorrow for sure :slight_smile:

Thanks again!

1 Like

@julien-moreau thank you for the quick reply, I’ll try this out and see what happens. I don’t know much about the Materials Editor and the Shader Builder. Is the Materials Editor going to be deprecated and replaced by the newer Shader Builder?

I’ll write back after I try this out.

Another few more things I noticed, this might be unrelated:

  1. While attempting to export a template in the GLTF format by selecting Project > Export Project Template, there was never a prompt to select an output folder and the window closed. It is possible experiencing a failure also.

  2. I also see there is an export final scene and assets. Does this only export the part of the project that is the /scene folder (and not the game.ts). I had some odd issues there as well. When I selected GLTF, it prompted me to save every image used as a texture individually. As I was saving into a subfolder, I needed to reselect the folder every time. I could take a quick video or .gif of what I observed if that helps you visualize what occurred.

For now, is only .babylon supported? should I avoid these other formats? I appreciate your quick replies, and I think after I get this running I can help with docs. I imagine others might have these same questions, and I think I can write it all out in a way that will pay it forward to the next user of this cool project.

Since I am collecting feedback for you I will add this as well:

Clicking the play button no longer seems to load the scene into the Game tab as it did before. This might just be a side effect of the same problem experienced when trying to export template.

If you want me to keep capturing my QA notes here I can, or I can break these out into github issues as well if you want.

Again THANK YOU! I am enjoying doing some testing on this project and I sincerely hope my feedback helps! I will keep debugging

Update: I can confirm this is likely related to the materials because a simple scene with no materials will play:

@julien-moreau :
Ok After making a scene from scratch with a light and no special materials, that loads correctly:

I can also see that unlike before, the meshes did load seemingly correctly:

So there’s the ground and the cube! I hope that is helpful to see!

On a whim, I decided to test the editor on my OSX machine, and the template saved and loaded correctly (for some reason), this is on 3.1.1. Is there any obvious reason this would behave differently on OSX than windows? The templated project looks basically the same, and also the editor the game actually runs (unlike my gif up there). I did use the updater inside the editor for windows, and on OSX it was a fresh install.

I will attempt a totally fresh windows install tomorrow and see if that changes anything.

Yes it is going to be replaced in future. Developing material directly in the editor was not a good idea and I think developing visually (I mean a graph) materials is better in case you would like to extend the standard or PBR material.

My answers:

  1. I think the editor hasn’t been updated and the GLTF serialized changed. I’m fixing right now.
  2. I see the problem, this comes from the 1. as the same code is shared to export the final scene components. The documentation has been updated here about this feature: Loading and Saving Project - Babylon.js Documentation
1 Like

@the-simian I reproduced for the “Play Game” problem, this was due to the “Material Editor” tool. As it is going to be removed, I think this fixes the issue ^^

1 Like

I found the same issue. If I access to the page run by local server IIS, problems listed as following:
Babylon.js v4.0.3 - WebGL2 - Parallel shader compilation
scene/environment.dds:1 Failed to load resource: the server responded with a status of 404 (Not Found)
logger.ts:71 BJS - [06:39:05]: _DDSTextureLoader failed when trying to load ./scene/environment.dds, falling back to the next supported loader
./Misc/logger.ts.Logger._WarnEnabled @ logger.ts:71
scene/project.editorproject:1 Failed to load resource: the server responded with a status of 404 (Not Found)
tools.ts:935 Uncaught LoadFileError: Error status: 404 Not Found - Unable to load ./scene/project.editorproject
at new LoadFileError (http://localhost/webbabylonjs/web-project/node_modules/babylonjs/babylon.max.js:109682:28)
at XMLHttpRequest.onReadyStateChange (http://localhost/webbabylonjs/web-project/node_modules/babylonjs/babylon.max.js:110311:33)

But if I access to the page by “yarn webserver”, It was OK!!!