Hi all,
I would like to register a postUpdate function in app
, just like it’s done with update
in the gltf-viewer:
shadowDistance: 5,
normalOffsetBias: 0.05,
shadowResolution: 2048
});
light.setLocalEulerAngles(45, 30, 0);
app.root.addChild(light);
// disable autorender
app.autoRender = false;
this.prevCameraMat = new Mat4();
app.on('update', this.update, this);
app.on('prerender', this.onPrerender, this);
app.on('postrender', this.onPostrender, this);
app.on('frameend', this.onFrameend, this);
// create the scene and debug root nodes
const sceneRoot = new Entity("sceneRoot", app);
app.root.addChild(sceneRoot);
const debugRoot = new Entity("debugRoot", app);
app.root.addChild(debugRoot);
Now, app
only has an update
callback, so I register it like so:
app.on('update', this.update, this);
app.on('update', this.postUpdate, this);
Is this the correct way to do it?
Thanks!
I think as far as the Application is concerned ‘update’ can be considered ‘postUpdate’ since it execute last, after all update and post update systems/components have finished executing.
What are you trying to do if I may ask with this post update?
Here is the relevant piece:
// Perform ComponentSystem update
if (script.legacy)
this.systems.fire('fixedUpdate', 1.0 / 60.0);
this.systems.fire(this._inTools ? 'toolsUpdate' : 'update', dt);
this.systems.fire('animationUpdate', dt);
this.systems.fire('postUpdate', dt);
// fire update event
this.fire("update", dt);
// update input devices
this.inputUpdate(dt);
// #if _PROFILER
this.stats.frame.updateTime = now() - this.stats.frame.updateStart;
// #endif
}
/**
1 Like
This manual page may be of help too, it explains the Application Lifecycle: Application Lifecycle | Learn PlayCanvas
1 Like
Thanks @Leonidas , this makes sense!
My postUpdate
method updates screen positions and sets style
properties for hotspots.
But I can integrate this code into the update
method then.
1 Like
I think that will work for you!
1 Like
While we are talking about engine-only update method :
I am trying to understand how a specific update method is registered in the gltf-viewer:
Here, a camera is created and the orbitCamera class is instantiated:
window.addEventListener("resize", () => {
this.resizeCanvas();
});
// Depth layer is where the framebuffer is copied to a texture to be used in the following layers.
// Move the depth layer to take place after World and Skydome layers, to capture both of them.
const depthLayer = app.scene.layers.getLayerById(LAYERID_DEPTH);
app.scene.layers.remove(depthLayer);
app.scene.layers.insertOpaque(depthLayer, 2);
// create the orbit camera
const camera = new Entity("Camera");
camera.addComponent("camera", {
fov: 75,
frustumCulling: true,
clearColor: new Color(0, 0, 0, 0)
});
camera.camera.requestSceneColorMap(true);
this.orbitCamera = new OrbitCamera(camera, 0.25);
this.orbitCameraInputMouse = new OrbitCameraInputMouse(this.app, this.orbitCamera);
The orbitCamera class in turn instantiates the SmoothedValue class, which has an update method:
this.timer = 0;
this.start.copy(this.value);
this.target.copy(target);
}
snapto(value: any) {
this.timer = this.transitionTime;
this.target.copy(value);
}
update(deltaTime: number) {
if (this.timer < this.transitionTime) {
this.timer = Math.min(this.timer + deltaTime, this.transitionTime);
const n = this.timer / this.transitionTime;
// const t = Math.sin(n * Math.PI / 2.0); // sinosidal
// const t = n * (2 - n); // quadratic
// const t = 1 - --n * n * n * n; // quartic
const t = Math.pow(n - 1, 5) + 1; // quintic
this.value.lerp(this.start, this.target, t);
} else {
this.value.copy(this.target);
I can’t figure out where app
learns about SmoothedValue’s update method.
Thanks!
yaustar
January 31, 2023, 5:36pm
#7
1 Like
Thanks @yaustar , sorry, I didn’t see that the viewer class runs all the other classes update
methods in its own update
method.
So only the viewer class needs app.on('update', this.update, this);