Videlais

Common Phaser + CocoonJS issues

Recommended Posts

@Binary Moon: It's as @Starnut wrote, compiling a launcher for the platform and then loading it. In my case, I've been using an Android 2.0.2 launcher and, like you, with a iOS 2.0.1 as a backup test environment.

 

 

@ghostrifle: Hmm. I just tested your case and it worked for me in CocoonJS (iOS, 2.0.1). What is your testing environment? Let's rule that out first.

 

 

@korgoth: I'm not surprised shadows don't work. Text working at all without a work-around hack is still new. Still, yeah, I'll start making separate test cases per text issue (multi-line, shadows) today.

Share this post


Link to post
Share on other sites

@ghostrifle: Hmm. I just tested your case and it worked for me in CocoonJS (iOS, 2.0.1). What is your testing environment? Let's rule that out first.

 

 

 

Hi!

 

I tested it on an iPhone 5S with the lastest iOS7 and Cocoon 2.01 and 2.02 (custom build)

Share this post


Link to post
Share on other sites

I tested it on an iPhone 5S with the latest iOS7 and Cocoon 2.01 and 2.02 (custom build)

 

Huh. Me too. Other than using 2.0.1, we've got the same setup on iOS.

 

When you tested the case, it loaded the 'background.png' image as a sprite at 0,0 and the button in the middle of the world space, right? Tapping or clicking on the button (the pink square) should have produced the message "Button touched/clicked!" in the console.

Share this post


Link to post
Share on other sites

Yes. Exactly this way. I also recorded a video to show what happens. If you look correctly. The button appears for ca. 1 frame:

 

https://www.dropbox.com/s/vfm094s2a5vm5ok/VID_20140726_090440.mp4

 

This is strange.

 

I recorded what was shown on my iPhone too just now. And I can see the pink square on mine.

 

I'm putting Buttons back on the list, but I'm definitely going to have to do more testing on this.

Share this post


Link to post
Share on other sites

So, bad news and a mea culpa here.

 

After finally figuring out why @ghostrifle and I were getting different results, I went back and re-tested everything. It turns out I had turned off "WebGL Enabled" on both my iPhone and Android tablet awhile back during my testing of image issues weeks ago, which meant everything was working fine with my recent testing. Turning that option back on (the default) breaks things again. Single image loading works now, but anything using more than one image for anything (@ghostrifle's test case, particles, and tilesprites) doesn't work anymore.

 

Despite this change, though, I did go ahead and update the top post today. Since CocoonJS 1.4.7 will be depreciated starting 1 August 2014 (tomorrow for me as I write this), I dropped mentions from the post and tried to organize toward the latest versions of Phaser too. I didn't see much use in keeping information on Phaser 1.1.* given the newer patches and fixes in 2.0.*.

 

Edit: New builds of Phaser using this patch should work fine with multiple images.

Share this post


Link to post
Share on other sites

I've created a custom build version of the launcher and am still getting the text offset vertically (I assume that's what the font problem is). Perhaps it's an issue with the font I am using?

 

If someone could test my game I'd be happy to send a zip that you can add use to see if it works for you.

Share this post


Link to post
Share on other sites

I've created a custom build version of the launcher and am still getting the text offset vertically (I assume that's what the font problem is). Perhaps it's an issue with the font I am using?

 

I replied to your thread on this topic just now, @Binary Moon, but for others, it looks as if anchor.set isn't working correctly for text.

 

I did some testing with various standard anchor values today (-1, 0, 0.5, 1) and the only useful value was zero (0).

 

For 0.5, it positioned it much higher than normal, on the uppermost edge of the screen vertically. For -1 and 1, it was gone completely; either it didn't draw it, or its positioning was far outside the screen.

 

(Note: this only affects Canvas+. It, of course, works fine in WebView.)

Share this post


Link to post
Share on other sites

https://github.com/photonstorm/phaser/pull/1064/files

 

I've applied those lines to my phaser library, but now everything is like reflected in the mirror   :lol:

 

But I must say, that buttons are working!

 

That might be a scaling issue. If it is looking as I think it might be, the canvas is being mirrored to fill out the screen.

 

Is that what is happening? Is the screen being mirrored on the edges?

Share this post


Link to post
Share on other sites

I'm using Phaser 2.0.7, canvas rendering, and CocoonJS launcher 2.0.2. I add a text to the screen by:

game.add.text(0, 0, 'READY', { font: "65px Arial", fill: "#FFFFFF", align: "center" });

And it works, the text appears as it should be. But if I want to add something using bitmapData before adding the text to the screen...

centerPixel = game.add.bitmapData(10, 10);centerPixel.fill(255, 255, 255);game.add.sprite(game.world.centerX, game.world.centerY, centerPixel);

...the text appears and then immediately disappears! Using the same code, but in a different order, the text remains there, but the square disappears.

 

Can anyone else reproduce this? Am I missing something here? It works (both the text and the square is displayed) using Chrome 36 (both desktop and mobile version), but not with CocoonJS.

Share this post


Link to post
Share on other sites

Can anyone else reproduce this? Am I missing something here? It works (both the text and the square is displayed) using Chrome 36 (both desktop and mobile version), but not with CocoonJS.

 

I reproduced this error; whatever was the first rendered disappeared completely. And you aren't missing anything, either. This is just another in a long line of weird errors between CocoonJS and Phaser.

 

I also tested with a dev build from last week and both showed up regardless of order but created the mirroring effect @Oliganti mentioned seeing.

 

 

http://imgur.com/FeCopf7

 

It works well with disabled WebGL in CocoonJS options.

 

Have you had any more luck, Oliganti? I've seen the mirroring too, but haven't built a new version from source in a few days.

 

Also, on the topic of disabling WebGL in the options, it's not as helpful as you might think. Even with disabling 'screencanvas' (as the newer 2.1. patch does), WebGL will still creep into anything built using the Ludei web interface. As far as I know, there isn't a way to disable that in compiled builds.

Share this post


Link to post
Share on other sites

 As far as I know, there isn't a way to disable that in compiled builds.

 

I can confirm this. The cloud-compiled launcher has WebGL enabled and it cannot be disabled. But you can explicitly instruct Phaser to use canvas by...

game = new Phaser.Game(480, 640, Phaser.CANVAS);

...but maybe that causes the problem I described previously.

Share this post


Link to post
Share on other sites

Hi all, thank you for you help in this thread, I'm almost done having my game running in CocoonJS with Canvas+ :D

 

Has anyone experienced issues playing WAV files? mine sound like a lot of noise on Canvas+ (phaser 2.0.7, cocoonjs 2.0.2), they work perfect on web (http://slashland.co/ananias ), might be some issue with their actual format?

 

Here's one of the files: http://slashland.co/ananias/sfx/hit.wav

 

I also have an issue with switch music off, once it's switched off I can't turn it back on, I'm using this.phaser.sound.volume = 1; and this.phaser.sound.volume = 0;

 

Finally, has anyone done a workaround for the no text wrapping issue?

Share this post


Link to post
Share on other sites

Has anyone experienced issues playing WAV files? mine sound like a lot of noise on Canvas+ (phaser 2.0.7, cocoonjs 2.0.2), they work perfect on web (http://slashland.co/ananias ), might be some issue with their actual format?

 

Here's one of the files: http://slashland.co/ananias/sfx/hit.wav

 

I did. Somewhere I've read that you must convert your sound files to 16-bit waves in order to work properly with CocoonJS (it's not a Phaser issue). The file you showed us is 24 bit, so I'm almost certain that's the problem.

Share this post


Link to post
Share on other sites

The cloud-compiled launcher has WebGL enabled and it cannot be disabled. But you can explicitly instruct Phaser to use canvas by . . . . but maybe that causes the problem I described previously.

 

Yeah, it's been that way since February when I started working with CocoonJS. The only easy way to disable WebGL completely is through the launcher itself.

 

Using Phaser.CANVAS doesn't really solve the problem, unfortunately. It prevents the far worse errors when explicitly using Phaser.WEBGL, but WebGL is still triggered by this line. (It's why the 2.1 version now turns off 'screencanvas', but also seems to introduce new problems.)

 

Something both me and some others have tried, though, is taking that line out completely or disabling the check for WebGL in Phaser and then re-building the library. It will force Canvas and should work fairly well, but isn't really a workable solution for Phaser. (There was a good conversation about this back in May-June.)

 

Somewhere I've read that you must convert your sound files to 16-bit waves in order to work properly with CocoonJS (it's not a Phaser issue). The file you showed us is 24 bit, so I'm almost certain that's the problem.

 

Could you find that source for me? I confirmed 24-bit WAV files produce noise under the 2.0.2 iOS launcher, but won't be able to test on Android until much later today. Having a source to point at would be hopeful when updating the top post again, though.

Share this post


Link to post
Share on other sites

I made the changes from the commit mentioned above but further testing has shown that the vanishing button issue is still happening (albeit less often than it was).

 

Has anyone else seen this or worked out a fix? If there's no known fix then I might just switch over to using images for now and switch back to buttons once it's resolved.

Share this post


Link to post
Share on other sites

I found a bug which is probably related to CocoonJS, I suppose this is the right place to report it?

Dragging a sprite and bringing it on the top doesn't work with CocoonJS (Canvas+), despite working fine both on desktop and the Android stock browser. I've tried both having the second parameter of enableDrag() as true and by sprite.bringToTop() inside a onDragStart callback function. If I don't bring the sprite to the top at all, it works fine also on CocoonJS, but it'd be important for my game to do so.

These threads are probably related, and there might even be a solution in the latter one, but I don't understand it well enough to implement it without a code example. Help greatly appreciated as always. :)
http://www.html5gamedevs.com/topic/6911-how-do-i-implement-touch-and-dragging-a-sprite/
http://www.html5gamedevs.com/topic/3223-does-drag-and-drop-rely-on-touchenter-and-touchleave/

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...

  • Recently Browsing   0 members

    No registered users viewing this page.