Panda 2 development

[LinkTree]

Hey @LinkTree,

 

Yeah, that was the first attempt I did since it was how my project was originally structured. It was when it didn't work that I went back to the basics with the examples on the site. When that didn't work either, I was wondering if there had been a significant change I wasn't aware of.

 

Loading images and bitmaps were just fine. I'm only having trouble with loading JSON files, for some reason.

I delved into the source code to find a solution for this and I came out with this fix:

 

in loader.js change the parseJSON function to this:

parseJSON: function(filePath, callback, request) {        if (!request.responseText || request.status === 404) callback('Error loading JSON ' + filePath);        var json = JSON.parse(request.responseText);        game.json[filePath] = json;        if (json.frames) {            // Sprite sheet            var image = game._getFilePath(json.meta.image);            this.loadImage(image, this.parseSpriteSheet.bind(this, json, callback));            return;        }else{            callback();        }        return json;    }

[gavvic]

Thanks @LinkTree, you're a lifesaver! That worked like a charm.

[LinkTree]

Thanks @LinkTree, you're a lifesaver! That worked like a charm.

You're welcome!

[gavvic]

Hello everyone,

 

Sorry for being such a bother. I'm trying to get a hang of the dynamic loader, since I load assets based off a JSON file with paths defined. I never really got it working previously, but I did try to follow earlier examples on the site. I noticed that it's different between the different versions, particularly with onComplete() having no parameters for a callback. Callback is never triggered, but even attempts to trigger the function after the loader.start() within init proved unsuccessful. On the other hand, calling game.scene.loaded()  (the callback function) worked when from the console, which meant the assets were loaded successfully. 

 

Here's an example that didn't seem to work for me:

game.module(	'game.main').body(function() {game.createScene('Main', {  init: function() {    game.addAsset('images/sprite.jpg', 'sprite');        // Create new loader with callback function    var loader = new game.Loader();    loader.callback = this.loaded.bind(this);    loader.onComplete();            // Start loader    loader.start();  },  loaded: function() {    var sprite = new game.Sprite('sprite');    sprite.addTo(this.stage);  }});});

That above was my attempt to set callback manually. I've tried it in the onComplete, but that's not going to work because it doesn't take in any parameters, and it failed to set with init. Regardless of if I set it in init or manually set it, the callback was read as a string with value 'Main'. 

 

What's the proper way to go about this? I've never gotten the dynamic loader to callback, so if there's any working examples with v2.0, that'd be great.

[zakhov]

Awesome!! Thanks enpu!

 

By the way, I just updated to iOS9 on one of my iPhones and it seems that resizing doesn't work properly.

 

I have a game at 320x320 so it works in both landscape and portrait.

 

If loading in Portrait, it loads correctly ...

 

IMG_0145.jpg

 

... but when switching to landscape it fails to stay in fullscreen (works on iOS8)

 

IMG_0146.jpg

 

When changing from landscape back to portrait, it stays at the landscape size and fails to resize to the correct portrait dimensions.

 

IMG_0147.jpg

 

There is a game that treats orientation change well and works on (made in Construct 2) - https://td2tl.com/license-html5-games/tower-loot/

 

I especially like the way the game doesn't get scaled (when in landscape mode) and the browser bars are visible.

 

It still however fails to stay in fullscreen (in landscape), so must be an issue with iOS9.

 

Thank you again!!!

 

Same issue with me, on Safari with my iPhone 5C, the game doesn't go to fullscreen(browser nav buttons/address bar shows) and it pushes up the canvas as well in landscape view.

Worked fine in iOS8 on iPhone 4S. Perhaps they changed something again.

[Ninjadoodle]

Hi guys

 

I'm trying to customise the loader by putting in a small spinning image, but I'm having trouble doing so.

 

Could anyone point me to some info on how to do this in 2.0

 

Thank you in advance for any help!

[enpu]

@Ninjadoodle

 

Something like this should work:

game.Loader.inject({    onStart: function() {        var sprite = new game.Sprite('panda.png');        sprite.anchor.x = 24;        sprite.anchor.y = 24;        sprite.position.set(game.width / 2, game.height / 2);        sprite.addTo(this.stage);        var tween = new game.Tween(sprite);        tween.to({ rotation: Math.PI * 2 }, 2000);        tween.repeat(Infinity);        tween.start();    }});

[Ninjadoodle]

Hi @enpu

 

Thank you, that works perfectly! Just a quick question, is there a way to still display the bar along with the rotating image?

[enpu]

Sure, just add this.super(); to the onStart function

[Ninjadoodle]

Awesome! Thanks for that!!

[Ninjadoodle]

Hmmm one problem I have (with customising the loader), is that anchor points don't seem to do anything. The image always spins by a corner

 

Anchor points work fine elsewhere.

[LinkTree]

Hmmm one problem I have (with customising the loader), is that anchor points don't seem to do anything. The image always spins by a corner

 

Anchor points work fine elsewhere.

I did a quick and dirty test and it seems like anchors work fine during loading. I was able to rotate the progress bar by it's center point and also when I added an image to the scene I was able to rotate it by it's center as well.

what didn't work for me is when I loaded the image the loader got stuck but that could be due to me not loading the image properly I haven't tested it heavily just wanted to do something quick.

 

http://ekelokorpi.github.io/panda.js-site/engine/playground/#container_basic

game.addAsset('panda.png');game.Loader.inject({    onStart: function() {        if (this._dynamic) return;                var sprite = new game.Sprite('panda.png');        sprite.position.set(100,100);        sprite.anchorCenter();        sprite.rotation = Math.PI/2;        sprite.addTo(this.stage);         var barWidth = game.Loader.barWidth;        var barHeight = game.Loader.barHeight;         var barBg = new game.Graphics();        barBg.beginFill(game.Loader.barBgColor);        barBg.drawRect(0, 0, barWidth, barHeight);        barBg.position.set(game.system.width / 2 - barWidth / 2, game.system.height / 2 - barHeight / 2);        barBg.addTo(this.stage);         this.barFg = new game.Graphics();        this.barFg.beginFill("#FF0000");        this.barFg.drawRect(0, 0, barWidth, barHeight);        this.barFg.position.set(game.system.width / 2, game.system.height / 2);        //  this.barFg.anchorCenter();        this.barFg.anchor.set(100,10);        this.barFg.rotation = Math.PI/2;        this.barFg.addTo(this.stage);        this.onProgress();    }})game.createScene('Main', {    init: function() {        var container = new game.Container();        container.position.set(100, 100);        container.addTo(this.stage);        var sprite = new game.Sprite('panda.png');        sprite.addTo(container);    }});

[Ninjadoodle]

Hi @enpu and @LinkTree

 

Thank you for the help!

 

I think this problem has something to do with hires and retina.

 

Turning these on, changes the anchor point of the sprite created within the loader.

[Ninjadoodle]

Hi @enpu

 

This is regarding the Panda toolkit 2.0 ...

 

When I try to create or update, I get an error about not being able to create a 'temp folder at .panda', or the folder not existing.

 

Not too sure what this means

 

Thank you!!

[enpu]

@Ninjadoodle

 

Remove the '.panda' folder and try again.

rm -rf .panda

Does that help?

[Ninjadoodle]

Hi @enpu

 

Just tried it and then tried to update again ...

 

fs.js:765

  return binding.readdir(pathModule._makeLong(path));

                 ^

Error: ENOENT, no such file or directory '/Users/tomvencel/Dropbox/Games/template/.panda'

    at Error (native)

    at Object.fs.readdirSync (fs.js:765:18)

    at rmdir (/usr/local/lib/node_modules/pandatool/update.js:35:24)

    at Object.update (/usr/local/lib/node_modules/pandatool/update.js:18:5)

    at Object.<anonymous> (/usr/local/lib/node_modules/pandatool/panda.js:7:17)

    at Module._compile (module.js:460:26)

    at Object.Module._extensions..js (module.js:478:10)

    at Module.load (module.js:355:32)

    at Function.Module._load (module.js:310:12)

    at Function.Module.runMain (module.js:501:10)

[enpu]

Should be now fixed.

 

Update your toolkit to 2.0.2

sudo npm install -g pandatool

[Ninjadoodle]

That worked perfectly! Thanks heaps ... it will make it easier to explain in the tutorial i'm re-writing

 

PS. I've almost finished my game and there are a few issues I've come across, that are posted in this thread. Would you like me to collect them and put them in one message? (to make it easier for you to find). I can also post them on Github, if that will help.

 

Thanks again!

[enpu]

If you can put them in one message, that would be great!

[Ninjadoodle]

Ok I will do that

 

Also ... when I'm trying to create a new project, I still get an error ...

 

Toms-MBP:games tomvencel$ panda create zzzzzzz

Creating new project...

Error creating temp folder at /Users/tomvencel/Dropbox/Games/.panda

[enpu]

Try to remove .panda again

[Ninjadoodle]

Haha, awesome!

 

This time it worked

 

I'm making the list for you now.

[Ninjadoodle]

Hi @enpu

 

Here is a list of issues I've come across while woking on my latest game.

 

1. Images used in the pre-loader don't work properly with Hires/retina.

 

2. On iOS 9, Panda fails to stay in Landscape. When changing back to portrait, the game never changes back properly (I posted screenshots in this thread).

 

3. I'm not sure if 'buttonMode' is implemented. This is really useful for point and click games, played with a mouse

 

4. I tried loading my game on iPad Air and all the graphics look completely messed up on screen. Things work fine on iPhone 4s and iPhone5s, but on Galaxy S5 only the low res assets seem to be loaded (i have @4x enabled). This issue seems to be cause by Hires - I sent you a test-case a while ago ( I can resend if you need ).

 

5. Loading bar doesn't seem to stay centred when changing orientation (320x320px game).

 

6. Audio now doesnt work in Safari (iOS9).

 

I think thats most of them .... the major ones seem to be the ones regarding hires/retina and graphics not loading.

 

Thanks heaps for the awesome work, Panda is amazing to work with!

 

Hope this helps

 

PS. I also can't start http-server with the new toolkit ...

 

Toms-MBP:template tomvencel$ http-server -o

events.js:85

      throw er; // Unhandled 'error' event

            ^

Error: listen EADDRINUSE

    at exports._errnoException (util.js:746:11)

    at Server._listen2 (net.js:1129:14)

    at listen (net.js:1155:10)

    at net.js:1253:9

    at dns.js:85:18

    at process._tickCallback (node.js:355:11)

    at Function.Module.runMain (module.js:503:11)

    at startup (node.js:129:16)

    at node.js:814:3

[zakhov]

Is Spine support for 2.0+ planned?

I'm drafting a few character sketches and was wondering if we could eventually use Spine like in previous versions.

Thanks

[Ninjadoodle]

Hi Guys & @enpu

 

I'm trying to remove an atlas after my splash screen plays.

 

I'm adding an atlas in the assets.js file -> game.addAsset('splash.json');

 

then trying to remove it from memory on splash completion while loading the next atlas  ...

game.removeAsset('splash.json');game.addAsset('atlas1.json');var loader = new game.Loader('Menu');loader.start();

This doesn't seem to work and I get an error ...

 

[Error] TypeError: undefined is not a function (evaluating 'game.removeAsset('splash.json')')

gotoMenu (main.js, line 44)

_update (tween.js, line 430)

_updateTweens (scene.js, line 428)

_update (scene.js, line 366)

_run (system.js, line 386)

(anonymous function) (core.js, line 817)

animate (core.js, line 901)

 

I've also tried removing individual images from the sprite sheet -> game.removeAsset('buttonStart.png');

 

But this also doesn't work.

 

Just wondering what I might be doing wrong

 

Thanks heaps for any help!