Sign in to follow this  
Teonnyn

Loading remote files with Phaser CE while in Angular CLI?

Recommended Posts

I have Angular 5 and Phaser CE set up, and loading correctly. When running a test state, I can get the system to render text from a text object.

However, when I try to load an atlas and image from my server, these items show up as being brought into the client in the browser debug console - I can see, and click on the links of both. Phaser, though, produces a few errors. 

    preload()
    {
        // Handle Application-specific graphics loading //
        if (Global.gameKey != undefined)
        {
            let image = Global.currentImage;
            let json = Global.currentJSON;
            this.load.atlasJSONHash('emoji', image, json );
        }

        switch(Global.gameKey)
        {

        }
    }

    create()
    {
        if (Global.gameKey == undefined)
        {
            this.state.start('NullState');
        } else {
            this.load.onLoadStart.add(this.loadStart, this);
            this.load.onLoadComplete.add(this.onLoadComplete, this);
            this.load.start();
        }
    }

    onLoadComplete()
    {
        console.log("Switching");
        switch(Global.gameKey)
        {
            case "drop":
                this.state.start('Drop', true, false);
            break;
        }
    }

The two errors produced here are

Phaser.Loader - textureatlas[emoji]: Cannot read property 'x' of undefined

and 

Phaser.Cache.getImage: Key "emoji" not found in Cache.

The server is CORS enabled and under my control, and I can actually "see" both files apparently get loaded, but the Phaser cache appears to be ignoring them. Any object created that uses the atlas shows up with the second error. Is this issue something Webpack or Angular CLI related, or am I missing something in the code?

 

Share this post


Link to post
Share on other sites

I'll try that, though interestingly enough I have a previous version that was not using Angular CLI - just plain Javascript and some jQuery. That was having no trouble loading the atlas and json file associated with positioning.

Share this post


Link to post
Share on other sites

Okay, check on the image. That itself loads perfectly. Not entirely sure what's going on with the atlas though. I based it off the one generated by TexturePacker for Phaser. My own version is also generated automatically when these files are created.

I had a hunch that it might be because the atlas was trying to locate a local file and not finding it, but redirecting the meta to look at the server has had no effect on loading thus far.

Share this post


Link to post
Share on other sites

Fixed things! Looks like it's been in how the latest version of Phaser CE reads atlas files. I removed one line of code in the generator that appended a name to the top, rebuilt the atlas, and it's now behaving properly. I also trimmed directory path and file extensions as well, although numbers would do just as good, from everything but the file link.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.