I have implemented a SceneManager that unloads assets and loads assets to keep VRAM usage as low and the code seems like it is working OK. I’m planning to implement a sceneTransition loading screen so in preparation for that I’m firing off sceneTransition:progress events as each assets loads. My question is, is that the lowest granularity possible for the progress bar. eg with my code if I’m loading 4 assets the progress bar can only have the values 25%, 50%, 75% and 100%. I guess I can animate the transition between the values.
var SceneManager = pc.createScript('sceneManager');
// Example usage:
// _this.app.fire('sceneManager:loadScene', 'two', 'Location1'); // load scene 'two' and set Player position/rotation as Location1.
// _this.app.fire('sceneManager:loadScene', 'two', ''); // load scene 'two'.
// Attach SceneManager to Root in each scene.
// Tag Root in each scene with the Scene Name.
// Tag each asset to unload/reload on Scene change, with the Scene Name.
SceneManager.prototype.initialize = function() {
var loadScene = function(newSceneName, location) {
var _this = this;
var oldScene = this.app.root.findByName ('Root');
var oldSceneName = oldScene.tags.list()[0];
var newScene;
var unloadAssets = function(oldSceneTag) {
console.log('unloadAssets: ' + oldSceneTag);
var assets = _this.app.assets.findByTag(oldSceneTag);
var i;
for (i = 0; i < assets.length; i++) {
//console.log(assets[i]);
assets[i].unload();
}
};
var loadAssets = function(newSceneTag, assetsLoadedCallback) {
console.log('loadAssets: ' + newSceneTag);
var assets = _this.app.assets.findByTag(newSceneTag);
var i;
var loadedAssets = 0;
var assetLoaded = function() {
loadedAssets++;
_this.app.fire('sceneTransition:progress', loadedAssets, assets.length);
if (loadedAssets === assets.length) {
assetsLoadedCallback();
}
};
for (i = 0; i < assets.length; i++) {
assets[i].ready(assetLoaded);
_this.app.assets.load(assets[i]);
}
};
if (oldSceneName !== newSceneName) {
newScene = this.app.scenes.find(newSceneName);
if (newScene) {
_this.app.fire('sceneTransition:start');
//console.log('newScene: ' + newSceneName);
this.app.off('sceneManager:loadScene', loadScene);
unloadAssets(oldSceneName);
oldScene.destroy();
loadAssets(newSceneName, function() {
// All Assets for newScene loaded.
_this.app.scenes.loadSceneHierarchy(newScene.url, function (err, parent) {
if (!err) {
_this.app.fire('sceneTransition:sceneReady');
_this.app.fire('player:move', location);
} else {
console.error(err);
}
});
});
}
}
};
this.app.on('sceneManager:loadScene', loadScene, this);
};