Category Archives: Haxe

A call to the Haxe community

Haxe

This a blog post version of my post on the Haxe forum which didn’t catch enough attention I think. Native Extensions are crucial for game development.

Update: Kha & OpenFL, for example, have their own IAP extensions because of the different engine architecture. The blog post mentionned share some thoughts on Native Extensions, in fact… but nothing concrete is going on at the moment, no repository shared. Finally the native code should be the same, but the wrapper around the extension can change depending the engine. A native extension should have different building scripts depending the engine targeted, but the same native & Haxe codes. I hope we’ll see examples in the near future.

We made recently several HTML5 games (Canvas/WebGL) that were also delivered as an app thanks to CocoonJS which deliver better performances than Phonegap/Cordova. But the journey wasn’t easy: no obb support on Android, push notification certificate needed for iOS, a custom analytics library didn’t work on Android but worked fine on iOS. It’s simple if you deliver your game with CocoonJS you don’t have any control on the packing solution and so the whole process could be a nightmare. Recently CocoonJS has updated its portal and finally announced pricing, no way! It’s time to reconsider some plan…
Unity WebGL is getting better, but still not ready to deliver properly WebGL browser mobile game. So it’s definitely time to focus (again) on Haxe!
Continue reading A call to the Haxe community →

Phaser and multi-resolutions textures issue

Haxe, HTML5, JavaScript, Phaser, ,

Raise your hand , and comment on this issue if you find it important.

Hey guys, the last months have been very exciting! We’re still working hard on A Blind Legend, there should be some blog posts about it sooner or later (you know how indie games are going)… 🙂 Next to that, we’re working on some HTML5 games. We already made several using pixi.js (with pure JavaScript and TypeScript) and others with Flambe (based on Haxe).

That time we wanted to test an other popular framework: the famous Phaser game engine. We had a long debate internally to choose the language we’d pick up between pure JS, Haxe and TypeScript and we finally opted for Haxe. There were already some Haxe externs for Phaser so that was great.

As Citrus Engine‘s developers, we were confident that Phaser comes with many good options on top of PixiJS (it is build with it) that we’d appreciate: state management, physics, multi-resolution support, sounds… However our journey isn’t as shiny as we hoped (we’re looking at you multi-resolution support)!
Continue reading Phaser and multi-resolutions textures issue →

Taking screenshots with Flambe, fighting multi-platforms

Canvas, Flash, Haxe, HTML5, JavaScript, WebGL, , , , ,

I enjoy playing with Flambe. It’s the only tech (except OpenFL) which enable you to have a SWF, Canvas & WebGL browser game with one code base made in Haxe (like OpenFL).
Having those three targets, you’re sure to reach your audience at 100%. However one feature, taking an in-game screenshot, may ruin your multi-platforms adventure.
Continue reading Taking screenshots with Flambe, fighting multi-platforms →

Unity, Flambe & OpenFL Skeletal animation libraries performance

Haxe, Unity, , ,

Hey guys, I concluded my AS3 performances test saying that AS3 math performances are still a bit low and that with other technology, we should have better performances. So here we go!

Again I remember that it’s really hard to compare different Skeletal animation engines using different models (and so an engine/a tech). I would really enjoy to have the same model available for each soft…

Flambe
Using Flump with AS3 implementation I had very good performances 30 mascots for 54 FPS. Since Haxe optimized AS3 code, we could imagine that we would win a bit more fps. However using Flambe (which is awesome) and its own Flump runtime I didn’t save FPS. Worst, I lost many! I had 30 mascots at 30FPS. Bad surprise.

OpenFL
OpenFL still use Haxe for coding however it may export native code! On mobile we could suppose that we would win some fps too. I tried several libararies, but the only one I succeed to make working was this one from Lugludum studio. They didn’t try it a lot on mobile, they focus on desktop, but for a first mobile run it wasn’t bad at all: 34 FPS for 30 animated characters.

Unity
For Unity I searched a free library, and I was really glad to see there is an implementation (no official, there was missing an eye with my model) of DragonBones. I put 30 dragons, damn I had 60 FPS! And finally 40 dragons at 46 FPS.

So what to conclude? I was sad to see that OpenFL didn’t save me some FPS relatively to my AS3 benchmark. But we can’t judge a technology on this test. Unity math performances seems to be really good. Is it the best tool for making 2D game? Maybe, without any doubt they are on the good road.

Download sources.

P.S. Gaming for change? Have a look on A Blind Legend! A really nice mobile project using binaural tones! Oh and my colleague and me will work on it. So stay tuned 😉

Flambe versus the World!

AIR, Entity/Component System, Flash, Haxe, HTML5, , , , , , ,

The game.

The (HTML5) engines war
You probably didn’t miss the engines war of the previous month: Unity announced Unity5 with WebGL support (which I already pre-ordered hurrah!) and Unreal Engine 4 did the same with an incredible price. That was for the big guys.
From a more indie friendly point of view, PixiJS continue to kick ass with awesome new features (cacheAsBitmap, blend mode for canvas, SpriteBatch…). Phaser using PixiJS as its rendering engine, is becoming much more popular every day and obviously more stable. PixiJS has really the wind in its sails because OpenFL switched to it for its HTML5 rendering engine!

Continue reading Flambe versus the World! →

Citrus Engine on Nape and physics performance improvement

AS3, Box2D, Citrus Engine, Flash, Games, Haxe, Nape, NME, Physics, Programming, , , , , , , , , ,

Hi folks! Since my studies are over and my new portfolio online, I have time to focus on personal projects. Yep, it was time to contribute again to the Citrus Engine. I’ve worked 3 days at full time focusing on its big issue : mobile performances. I’m glad to say that now they are just an old memories!

6 months ago, I’ve made the CE compatible with Stage3D thanks to Starling and added some cool stuff. CitrusEngineV3 BETA 1 has been downloaded 3047 in 6 months, that’s not bad! However it didn’t see lots of Stage3D game, because it was missing the point : people wants to make mobile games.

You will find all the sources at the end.

Continue reading Citrus Engine on Nape and physics performance improvement →

The Citrus Engine goes on Haxe NME, welcome to the CitruxEngine

AS3, Box2D, Citrus Engine, Flash, Games, Haxe, NME, Physics, Programming, , , , , , , , , , ,

One month ago I started to work on the CitruxEngine. I was very confident with Haxe performance on mobile and NME cross platform opportunities. And now, I can say those are awesome!

In April 14-15th, I was in Paris to assist to the Haxe conf 2012. It was really cool, Silex Labs has made a good job! Conferences were very interested and the community greatly friendly. And I had the opportunity to make a lightning talk concerning my contribution to the Citrus Engine 2D game framework and its port on Haxe NME. The presentation was a bit from scratch, but that was a good experience! I’m very happy to be the first to start the lightning talk, since there were very serious projects 😀

CitruxEngine Github.
CitruxEngine Demo. Simple demo which have been tested on Flash & CPP (using left/right key and spacebar) and iOS (touch & accelerometer). There are sound, animations (idle, walk and jump) and physics.
The port is currently not finished!

I will not present some code here. If you are already familiar with the Citrus Engine, there will be no problem. Take a look on the example on Github.

HTML5
When I started the port, I would the CitruxEngine be as cross platform as possible. HTML5 is promising, and Niel Drummond the man behind Jeash has made an incredible job! However I found that the Haxe NME Box2D port has not very good performance with HTML5. So I’ve dropped the HTML5 target at the moment, but I keep an eye on Jeash!

Box2D
Thanks to Haxe NME, Box2D runs very well on mobile! This is mostly the reason why I’ve started the CitruxEngine. The Citrus Engine uses the AS3 Alchemy version of Box2D which has some differences with the original. It seems there is a bug with the Haxe NME Box2D port : the beginContact & endContact listeners are fired all the time if a dynamic body is on a static body (like a hero on a platform), whereas it fires only once if there are 2 dynamics bodies. This behavior is blocking me.

SpriteSheets
I made my test with the spritesheet haxelib which uses SpriteLoq. At the moment it works well. I’ve not made serious test with animations.

Level Editor
I love how the Citrus Engine handles Flash Pro as a Level Editor. I would like the Haxe NME version handles it as well. But at the moment we can’t read AS3 code in a SWF file (it is the way that class and properties are defined), so I need to think to an external way. Maybe it’s time to reconsider the Level Architect!

Console
The console is really a cool feature of the Citrus Engine, it will be available in the CitruxEngine too. I’ve started to implement it, but it’s not ready yet.

I will continue to work on the CitruxEngine, but now I’ve to focus on my school project using Objective-C, it’s really hard to get back when you have tested Haxe power ! In less than two months I will be graduate and looking for a job, future is exciting.

Thanks to postite & elsassph for their help!

JavaScript slider made with haXe and JQuery

Haxe, JavaScript, , , ,

After playing with haXe and Php, it was time to try haXe and JavaScript! I used the JQuery library included in haXe. For more information on haXe JS take a look on its website.

Click here to see the slider in action. It uses keyboards and a timer. The slider centers a picture with a 50px margin, there is also a red or green filter.

Continue reading JavaScript slider made with haXe and JQuery →

Using native Php with haXe Php

Haxe, Php, , , ,

Recently I had some time to dig more with haXe Php. The major question was how does it integrate with existing native Php ? I’m glad to say that it works fine!
Let’s start a quick overview of our native Php file test (Simple.class.php) :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47

<?php
function makeSimple($text) {
    return new Simple($text);
}
 
function affichText($text) {
    echo $text;
}
 
class Simple {
 
    public $text;
    public $tab;
 
    public function __construct($text) {
        $this->text = $text;
        $this->tab[0] = "index 0";
        $this->tab[1] = "index 1";
    }
 
    public function doPrint() {
        echo $this->text;
    }
 
    protected function changeText($text) {
        $this->text = $text;
    }
}
 
class Simple2 extends Simple {
 
    public function __construct($text) {
        parent::__construct($text);
    }
 
    public function makeChange($text) {
        $this->changeText($text);
    }
 
    public function associativeArray() {
 
        $tab["num1"] = "number 1";
        $tab["num2"] = "number 2";
        return $tab;
    }
}
?>

There are a simple function, some inheritance stuff and an associative array which is very common in Php.

Now the haXe part :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

package;
 
import php.Lib;
 
class Test {
 
    static function main() {
 
    	new Test();
    }
 
    public function new() {
 
        // import php file
    	untyped __call__("require_once", "Simple.class.php");
 
        // call a php function with an arg
    	untyped __call__("affichText", "first msg </br>");
 
        // create a php object with an arg
    	var myPhpObject:Dynamic = untyped __call__('new Simple2', 'second msg </br>');
 
        // manipulate the object
    	myPhpObject.doPrint();
    	myPhpObject.makeChange("some new text </br>");
    	myPhpObject.doPrint();
 
        // print an array
        Lib.print(myPhpObject.tab);
 
        // trace the index 0 value
        trace(myPhpObject.tab[0]);
 
        // make some native php
        untyped __php__("echo '</br>php native from haXe !</br>'");
 
        // we need a Hashtable to parse an associative array from php :
        var phpAssociativeArray:Hash<String> = Lib.hashOfAssociativeArray(myPhpObject.associativeArray());
 
        // trace the key value num2
        trace(phpAssociativeArray.get("num2"));
    }
 
}

The output log : 

first msg
second msg
some new text
["index 0", "index 1"]Test.hx:32: index 0
php native from haXe !
Test.hx:41: number 2

If you are using everyday libraries/tools written in Php, you may wrap them with haXe for more comfort. Take a look there : Wrapping External PHP Libraries & the haXe Magic.

Unfortunately, there isn’t lots of ressources/tutorials for haXe Php on the website, I will update this post if I go deeper in haXe Php development. It is very pleasant to write Php this way. Give it a try!
haXe API.

And because memes are fashion :

haXe workflow with Sublime Text 2, Php & nme examples

Haxe, NME, Php, Programming, , , ,

A good IDE is the developer’s best friend. FDT is my favorite one to code AS3 stuff, however I’m not very satisfied with haXe integration… it could be better. A good source code editor is also an amazing tool. I’ve found Sublime Text 2 some months ago, and it sounds always awesome to me. There is an extension which add Package control management to ST2 for adding new plugin, like haXe one.

Come on, download Sublime Text 2, install the Package control and haXe plugins!

That’s ok ? Now we can create a simple Php project.
Create a new file, save it as Test.hx and add this code :

package;
 
class Test {
 
    static function main() {
 
    	new Test();
    }
 
    public function new() {
 
    	var number:Float = 4;
 
        trace(number + 5);
    }
}

Then press ctrl (even if you use a mac) + shift + b. A new file called build.hxml is opened with some code generated to compile. You should just need that :

# Autogenerated build.hxml

# www
-php www
-main Test

Then press ctrl + enter. Your php files are generated. Pretty easy!

Now let’s make more stuff, a PDO connection with a simple query.

var cnx:Connection = PDO.open('mysql:host=localhost;dbname=igobelins', 'myUsr', 'myPwd');

If you press ctrl + space you have some greats auto-completion features! ctrl + i and the class is imported. If you make some mistake your code is highlighted in pink.

Our php stuff :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

package;
 
import php.db.Connection;
import php.db.Mysql;
import php.db.Object;
import php.db.PDO;
import php.db.ResultSet;
 
class Test {
 
	public var cnx:Connection
 
    static function main() {
 
    	new Test();
    }
 
    public function new() {
 
      cnx = PDO.open('mysql:host=localhost;dbname=igobelins', 'myUsr', 'myPWd');
 
      var sql:String = "SELECT * FROM configs";
 
      var results:ResultSet = cnx.request(sql);
 
      for (result in results) {
       	trace(result.user);
       }
 
       cnx.close();
    }
}

According that you have a field user in your database, it will show the names.

Ok that was pretty cool, what about nme ? Go on this page and download the haXe project. In ST2 go in File/Open Folder… and select the Folder you have just unzipped. It should show the different folders & files in a left panel. Browse the Source and open SimpleBox2DExample.hx and then press ctrl + enter. It is compiled for flash and open quickly the result in the Flash Player. Ok but with NME I would like to target cpp. No problem press ctrl + shift + b then select cpp and compile. This way you can quickly change the target.
He wait, there isn’t html5 target !? I don’t know the reason but it is not offered. But you can add it (thanks to Julien Roche for the tips) : on Mac open the file Users/YourUserName/Library/Application Support/Sublime Text 2/Packages/HaXe/HaxeComplete.py and add html5 to nme_targets on line 124. Restart ST2, press ctrl + shift + b select html5 then compile. You have a new target 😉

Sublime Text 2 and the haXe plugin are awesome, but so far it can not be as powerful as an IDE for debugging. No breakpoint for example, anyway it is already a great tool for a simple code editor!

Recently, JetBrains has released a haXe plugin for IntelliJ. We should keep an eye on it!