Comments (23)
Thanks for the heads up! Seems to be the same issue as this: #13
Which browser are you using? Does the issue exist across all of your browsers? Thanks!
from pixijs.
Chrome 25 and Firefox 19 , it might be 'hasLoaded' problem :
var texture = PIXI.Texture.fromImage(filename);
if(!texture.hasLoaded)
but it should be probably : if(!texture.baseTexture.hasLoaded)
Im not sure , just hinting
from pixijs.
I agree, will take a poke around later today. Annoyingly I cant seem to recreate the issue on my current setup, would you mind testing the fix for me once its complete?
from pixijs.
Now Im 99% sure that this is an issue because this code works fine :
if (PIXI.Texture.fromImage("asset/shadow.png").baseTexture.hasLoaded) {
LoadComplete();
} else {
var loader = new PIXI.AssetLoader(["asset/1.jpg", "asset/js.png","asset/shadow.png"]);
loader.onComplete = LoadComplete;
loader.load();
}
Ok , I'll download latest when You fix it and give You feedback !
from pixijs.
i think that cause is order of code.
img.onload=func after img.src="url" or,
img.src="url" after img.onload=func <- this was "from cache".
from pixijs.
yeah , but it must work anyway, cache or download :)
from pixijs.
Quick test :)
If you swap these two lines around in the PIXI.Texture.fromImage function:
image.src = imageUrl;
baseTexture = new PIXI.BaseTexture(image);
like this:
baseTexture = new PIXI.BaseTexture(image);
image.src = imageUrl;
does that fix the issue?
from pixijs.
baseTexture = new PIXI.BaseTexture(image);
image.src = imageUrl;
and,
PIXI.BaseTexture = function(a) {
this.height = this.width = 0;
if (this.source instanceof Image)
if (this.source.width) //"complete" property is buggy its always "true"
I think it is ok.
from pixijs.
Nope , but I was right about "hasLoaded" param . Please look at code :
https://github.com/GoodBoyDigital/pixi.js/blob/master/src/pixi/loaders/AssetLoader.js#L84
Texture object dont have property "hasLoaded" so (!texture.hasLoaded) will be always true and it try load and never end , but it should skip it . There must be :
if(!texture.textureBase.hasLoaded){...
and at end of function :
if(this.loadCount == 0){this.onAssetLoaded();};
This solved problem .
from pixijs.
Oh yes! you are absolutely correct 👍 Great catch!
piayo does turbosqel's solution work for you? Thanks both!
from pixijs.
Thats a pain of js . Im moving from as3 to js and no strong type can cause big headaches :) btw any plans of adding solid color graphic rects ?
from pixijs.
I hear that! I come from as3 land too :)
I do have plans for solid rects, they will probably be the first primitive I make.
from pixijs.
yeah , thats very usefull , just like starilng quads . I'll try also implement this in Your lib : http://turbosqel.pl/relativestarling/
from pixijs.
nice one 👍
from pixijs.
Hello!
@turbosqel 's answer worked for me, just note that the code should be:
if(!texture.baseTexture.hasLoaded)
Copy and paste on the other code will give you an error. ;)
Please, let me know when this fix is added to the repo, so I can go back to work with the most recent version.
By the way, awesome library! Thanks a lot!
from pixijs.
Dont forget to add :
if(this.loadCount == 0){this.onAssetLoaded();};
on botton of "load()" function , because loader wont call onComplete without it
from pixijs.
One more thing, the function PIXI.AssetLoader.prototype.onAssetLoaded
Should have
this.loadCount--;
replaced by
if(this.loadCount > 0){ this.loadCount--; }
Otherwise the comparison to 0 will return false if all assets are loaded (this.loadCount will be -1).
I was experiencing this problem on Firefox and it would only work after cleaning the cache.
from pixijs.
it should not happen , since loadCount is taken from toLoad array length . So it should loop and shift always to 0 .
from pixijs.
On the code I had, there was a call to this.loadCount--; on the beginning of the method onAssetLoaded(), so a call to it with this.loadCount == 0 would make this.loadCount evaluate to -1.
from pixijs.
Should be all good now gents :)
from pixijs.
Works fine for me now! Thanks!
from pixijs.
i referring to good for JS small trick.
http://stackoverflow.com/questions/12354865/image-onload-event-and-browser-cache
http://stackoverflow.com/questions/8380698/javascript-onload-image-complete
from pixijs.
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
from pixijs.
Related Issues (20)
- Bug: TypeError: Cannot read properties of null (reading 'uid') HOT 1
- Bug: The content of multiple texts overlaps with each other. HOT 17
- Bug: [v8] antialias=true drastically cuts performance even when idle HOT 3
- Bug: Arc line cap not re-rendered if graphics is cleared HOT 1
- Bug: v8 mask container bounds changes
- Bug: Unable to add a mask to the text HOT 1
- Bug: [v8] Multiple issues with mipmaps HOT 7
- Bug: Sprite alpha masks broken in chrome & edge HOT 7
- Bug: V8 text stroke is applied even with width 0. Also strokeThickness does not update at runtime
- Bug: [v8] double `onRender` of rendergroup? HOT 1
- Bug: Can't get updated worldTransform immediately
- Bug: [v8] arctifact when rendering big polygon with offscreen coordinates in Firefox and Safari HOT 4
- Is it possible to do a lossless rotation in Pixi?
- Bug: When forceCanvas is true, mask sprites with sprites doesn't work
- Bug: Some props like dropShadow and resolution are not updating for Text object.
- Bug: Generated Texture doesn't support scale mode since 8.1.0 HOT 2
- Bug: Events are firing twice when we have dynamic and static mode
- [bug] v8 NineSliceSprite doesnt works as mask on Sprite HOT 1
- Bug: v8 ESM is broken with esm.run HOT 4
- V8 Bug! HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from pixijs.