I think the issue is, your code not waiting for the remote asset to load, before using it.
Thatâs why it sometimes works and others it doesnât, there is a rally condition there. Normally you need to wait for the ready event to fire before using that model.
Example code:
var asset = new pc.Asset("Ship", "model", {
url: "https://raw.githubusercontent.com/ayring/kallen/master/shipfinal.json"
});
app.assets.add(asset);
asset.ready(function(){
// use the asset where it's required, now the model is ready
});
app.assets.load(asset);
Yes, exactly, loading remote assets can be slow depending on the size of the file.
You canât expect it to be available directly in your code to act on it. Itâs important to use the ready method to make that part of your code wait before trying to do something on that model.
Additional question, the var asset is loaded inside the intialize funcion, i need to add the ready method inside another function where the Ship model is cloned how do i check if the var asset is ready or not? There isnât a simplest way to do that? like to preload the external models?
EDIT: got another error sigh
Hi @yaustar yea i mean that, iâm trying to use the the ready event, is it correct if i load the asset this way var asset = new pc.Asset(âShipâ, âmodelâ, {url:âŚetcâŚ}); to check if itâs loaded in another function this way var check=app.assets.find(âShipâ); and check.ready(function(){âŚetc });
Thanks.
If another piece of code is waiting for the model to load, then you can fire an event. For example this.app.fire('loaded') when it is loaded, and this.app.on('loaded', function() { ... }) somewhere else to do an action upon the load.
Edit:
Another way, is to set flags, e.g. adding on @Leonidas example:
// somewhere in init
this.modelReady = false;
// then
asset.ready(function(){
// use the asset where it's required, now the model is ready
this.modelReady = true;
}.bind(this));
// then you can use this.modelReady flag to
// check if the model was loaded before using it
Thanks @LeXXik but flags wouldnât do coz
if (this.build[i].Ship===true) {⌠this will check if in the current map the ships are present or not, so if the ship is present it has to check if the 3 models are present and enable them, if not present duplicate the single model and place and enable the 3 models. So if i use the flag it will skip the whole code and will not run it. So my dubt is: the ready function is fired if the asset is loaded, i have to find the asset with app.assets.find(ânameâ) the name is new pc.Asset(âShipâ)?? Very confused about this part.
Thatâs a lot of code for a single script @ayrin! Nothing wrong with that but it makes it hard to study/maintain it.
I see you are loading two assets on top, so here is a suggestion on how to refactor this code:
initialize: function () {
var asset = new pc.Asset("Ship", "model", {
url: "https://raw.githubusercontent.com/ayring/kallen/master/shipfinal.json"
});
var asset1 = new pc.Asset("Thieves", "model", {
url: "https://raw.githubusercontent.com/ayring/kallen/master/House01.json"
});
asset.ready(function(){
asset1.ready(function(){
// --- move your code in here, after both models are loaded and in place
}.bind(this));
}.bind(this));
app.assets.add(asset);
app.assets.load(asset);
app.assets.add(asset1);
app.assets.load(asset1);
},
This code may work for 2 assets but it will not scale if you have more. For that look at Promises and especially on how to use Promise.all(), a Javascript/browser API.
sigh 
I have put myself in a difficult position as always, since i was planning to add more. If i whip myself i would feel less pain 
