CocoonJS Screencanvas

Discussion and feedback on Construct 2

Post » Thu Jan 03, 2013 7:29 pm

I modded a Clyde export to enable the new CocoonJS Screencanvas feature and... OMG!!!! THE GAME LITERALLY FLIES!
FULL 60FPS on a samsung galaxy S advance, 25FPS on my old and crappy Galaxy Ace...
Now, thats what I call native like performance! :D
When C2 will officially support it I think there will not be anymore people swearing about mobile performance in this forum :-)

Edit: there are some minor visual glitches, but... performance is really awesome. Thanks Ludei, thanks Scirra... Future of C2 games on mobile is brighter than ever.Knifegrinder2013-01-03 19:34:30
B
11
S
3
Posts: 224
Reputation: 2,028

Post » Thu Jan 03, 2013 8:51 pm

Great! i hope that we can use it soon, right now, android performance is the only thing that i dont like :D
B
31
S
7
G
2
Posts: 157
Reputation: 3,735

Post » Fri Jan 04, 2013 12:51 am

Just tried it on a Samsung Galaxy Tab 7. Again 60FPS... I'm really impressed (despite inverted accelerometer controls on android honeycomb, but I think @ludei is aware of it)Knifegrinder2013-01-04 00:52:44
B
11
S
3
Posts: 224
Reputation: 2,028

Post » Fri Jan 04, 2013 1:34 am

[QUOTE=Knifegrinder] I modded a Clyde export to enable the new CocoonJS Screencanvas feature[/QUOTE]

@Knifegrinder that sounds great! Could you link us to a tutorial on how to do this, or at least share the steps needed to get it working?
B
50
S
11
G
8
Posts: 479
Reputation: 9,911

Post » Fri Jan 04, 2013 1:48 am

This is an empirical way to activate screencanvas. As C2 doesn't offically supports it, this may lead to unexpected results... Anyway if you want to try, follow these steps.
Export to cocoonjs without minifying your script.
Open in your zip folder the file C2runtime.js
Find the following snippet of code:

[QUOTE]
window["createCocoonJSRuntime"] = function ()
{
          window["c2cocoonjs"] = true;
          var Canvas = document.createElement("canvas");
          document.body.appendChild(canvas);
          canvas.width = window.innerWidth;
          canvas.height = window.innerHeight;
          var rt = new Runtime(Canvas);
          window["c2runtime"] = rt;
          window.addEventListener("orientationchange", function () {
              window["c2runtime"]["setSize"](window.innerWidth, window.innerHeight);
          });
          return rt;
     };
[/QUOTE]

Delete it and replace with this



[QUOTE]
window["createCocoonJSRuntime"] = function ()
     {
          window["c2cocoonjs"] = true;
          var screenCanvas = document.createElement("screencanvas");
          var rt = new Runtime(screenCanvas);
          window["c2runtime"] = rt;
          window.addEventListener("orientationchange", function () {
              window["c2runtime"]["setSize"](window.innerWidth, window.innerHeight);
          });
          return rt;
     };
[/QUOTE]Knifegrinder2013-01-04 01:53:51
B
11
S
3
Posts: 224
Reputation: 2,028

Post » Fri Jan 04, 2013 1:55 am

[QUOTE=Knifegrinder] I modded a Clyde export to enable the new CocoonJS Screencanvas feature and... OMG!!!! THE GAME LITERALLY FLIES!
FULL 60FPS on a samsung galaxy S advance, 25FPS on my old and crappy Galaxy Ace...
Now, thats what I call native like performance! :D
When C2 will officially support it I think there will not be anymore people swearing about mobile performance in this forum :-)

Edit: there are some minor visual glitches, but... performance is really awesome. Thanks Ludei, thanks Scirra... Future of C2 games on mobile is brighter than ever.[/QUOTE]

Sounds good news, would you explain about minor visual glitches?
B
96
S
25
G
20
Posts: 3,055
Reputation: 22,644

Post » Fri Jan 04, 2013 2:06 am

[QUOTE=Joannesalfa]

Sounds good news, would you explain about minor visual glitches?[/QUOTE]

I have some problems with large black tiledbackgrouds used as faders, when you exit a layout they seem to disappear just a few frames before the rest of layout breaking the fading out effect. Anyway this is really a minor issue since this is not happening with stretched sprites.Knifegrinder2013-01-04 02:12:25
B
11
S
3
Posts: 224
Reputation: 2,028

Post » Fri Jan 04, 2013 3:48 am

[QUOTE=Knifegrinder] This is an empirical way to activate screencanvas. As C2 doesn't offically supports it, this may lead to unexpected results... Anyway if you want to try, follow these steps.
Export to cocoonjs without minifying your script.
Open in your zip folder the file C2runtime.js
Find the following snippet of code:

[QUOTE]
window["createCocoonJSRuntime"] = function ()
{
          window["c2cocoonjs"] = true;
          var Canvas = document.createElement("canvas");
          document.body.appendChild(canvas);
          canvas.width = window.innerWidth;
          canvas.height = window.innerHeight;
          var rt = new Runtime(Canvas);
          window["c2runtime"] = rt;
          window.addEventListener("orientationchange", function () {
              window["c2runtime"]["setSize"](window.innerWidth, window.innerHeight);
          });
          return rt;
     };
[/QUOTE]

Delete it and replace with this



[QUOTE]
window["createCocoonJSRuntime"] = function ()
     {
          window["c2cocoonjs"] = true;
          var screenCanvas = document.createElement("screencanvas");
          var rt = new Runtime(screenCanvas);
          window["c2runtime"] = rt;
          window.addEventListener("orientationchange", function () {
              window["c2runtime"]["setSize"](window.innerWidth, window.innerHeight);
          });
          return rt;
     };
[/QUOTE][/QUOTE]

Thank you for the concise instructions! You should post this as a tutorial so more users could use this as reference.
B
19
S
5
G
1
Posts: 104
Reputation: 2,920

Post » Fri Jan 04, 2013 4:14 am

Thanks for sharing your method with us Knifegrinder

I just tested it with a endless runner platform game that I have been working on, and unfortunately with a older Samsung Galaxy S running 2.3 OS I am still getting only 6 fps. But on newer high end devises like my Nexus 7 my frame rate went up dramatically from 35 to 43 fps to a steady 61 fps. I guess with certain type games we will just have to abandon low end devises.

I usually use a 32 x 32 px solid black sprite image as a fader, and use events and actions to get a fading effect. But I am also getting strange glitches with it like sometimes it will flicker during fading or freeze on 100% faded leaving the screen black.

Anyways thanks again for sharing.
B
50
S
11
G
8
Posts: 479
Reputation: 9,911

Post » Fri Jan 04, 2013 6:09 am

Well I was going to get around to trying it and posting the results. But most of my day was polishing up my game. You MR have saved me substantial amount of effort. I wasn't sure if I would have to change every check for createElement("canvas") to..... but since you already nailed it right on.

Go man, go :) i'm hoping to see this in C2 soon. Also Ludie has mentioned that it's still in beta. So who knows. We may see more improvements.
B
87
S
18
G
9
Posts: 2,455
Reputation: 14,834

Next

Return to Construct 2 General

Who is online

Users browsing this forum: No registered users and 6 guests