Access “app” from external JS

Hello,

I am trying to get some of your example custom shaders on github and apply the shader to an object on an existing scene which was created with the Verge3D App Mannager.

I did the following: copied the code from github into the App (into the function runCode(app) {}). In that example, some external modules from other files are being imported. So I downloaded those and re-linked them.
This was not working firstly because the myAwesomeApp.js is not a module thus you get the error ‘Cannot use import statement outside a module’.

Instead I am binding new js file and declare it as a module.

function runCode(app) {
    let js = document.createElement("script");
    js.type = "module";
    js.src = "custom_shader.js"
    document.head.appendChild(js);
}

Inside that file custom_shader.js now the modules are being imported. But once the code runs that file and gets to the point

app.scene.add(wireframe);

I am getting an error because the scene is undefined. So I understand from that file the ‘app’ is not accessabble.
That line was originally v3d.scene.add(wireframe);

but I am trying to access the current scene of the App itself.

I have been researching for this for hours now. Sorry if the solution might be too obvious – but I am not getting it :/ Or maybe I am doing it totally wrong and there is an easier way.

I could “import” all those modules too by just copying them into the main app js code. But 1) that will make it all pretty messy and 2) I want to understand what I am not understanding here ;)

Thanks so much for your help.
Once that is solved I may likely stumble into the next problem…