Hi guys, I am in abit of a pickle and hoping that what I have is a simple issue I’m just not seeing.
Just fyi, im using @RaananW wonderful Webpack ES6 starter so all my scenes use a generic promise system.
What I am building is a transition in/out system. The effect works fine if I run my code like this VVVV
currentScene = await createSceneModule.createScene(engine, view);
sceneObservers.changeScene.addOnce(async (nextScene: Scene) => {
//Dispose currently rendering scene
currentScene.dispose()
//Set the new scene to the current scene
currentScene = nextScene
//My Fadein code works
await screenFade(currentScene,1.0,.0)
})
engine.runRenderLoop(() => {
currentScene.render()
})
This works fine, the nextScene
var is passes in from a button thats set up like this
async function LoadNextScene(){
let createSceneModule = physicsWithHavok
let nextScene = await createSceneModule.createScene(engine, view);
sceneObservers.changeScene.notifyObserversWithPromise(nextScene);
}
BUT I want to run my transition code on the CURRENT SCENE before I dispose of it and load the new one, but it doesn’t work, no errors and my postprocess does flicker on so something is happening but nothing happens,
currentScene = await createSceneModule.createScene(engine, view);
sceneObservers.changeScene.addOnce(async (nextScene: Scene) => {
//My Fadein code DOES NOT WORK
await screenFade(currentScene,1.0,.0)
//Dispose currently rendering scene
currentScene.dispose()
//Set the new scene to the current scene
currentScene = nextScene
})
I dont know if my fadein may be the issue, again it works fine if I use it before my dispose but here it is;
function screenFade(scene : Scene, startValue : float, endValue : float): Promise<void> {
return new Promise((resolve, reject) => {
let nodeMaterial = NodeMaterial.Parse(gradFadeJson, scene);
let nodeInput = nodeMaterial.getInputBlockByPredicate((b) => b.name === "Cutoff");
let nodeTexture = nodeMaterial.getBlockByName("Texture"); //nodeMaterial.getInputBlockByPredicate((b) => b.name === "Texture");
//@ts-ignore
nodeTexture.texture = new Texture(gradFadeTex);
let postProcess = nodeMaterial.createPostProcess(scene.activeCamera, 1.0, Constants.TEXTURE_LINEAR_LINEAR);
let fadeLevel = {
value: startValue
};
postProcess.onApply = (effect) => {
nodeInput.value = fadeLevel.value;
};
let ppAni = new AnimationGroup('ppAni', this);
ppAni.normalize(0, 100);
let animation = new Animation('fadeAnim', "value", 60, Animation.ANIMATIONTYPE_FLOAT, Animation.ANIMATIONLOOPMODE_CONSTANT)
postProcess.animations.push(animation);
let fadeKeys = [
{ frame: 0, value: startValue },
{ frame: 100, value: endValue }
];
animation.setKeys(fadeKeys);
ppAni.addTargetedAnimation(animation, fadeLevel);
ppAni.play();
// Add an observer that will resolve the promise when the animation ends
ppAni.onAnimationEndObservable.addOnce(() => {
nodeMaterial.dispose()
postProcess.dispose()
resolve();
});
});
}
Sorry for the code dump, my issue seems to be if I call my scene from an event callback it works but loading my scene on init doesn’t. But everything else works and seems that my post process or animation maybe aren’t being triggered? Again hope I am just missing a glaring issue.
Thanks in advance!