[iOS - Javascript] Khalou


Hi everyone,

I was working for several weeks on making a game for iOS with Javascript for my company.
The challenge was to use native components from the Javascript, like Facebook and GameCenter.
I made it and created Khalou, a reflection board game.
The most difficult part was to create bindings.
I made a double wrapper: Javascript calls C++, that calls Objective-C.
I would like to share my work, hoping this will help other people and contributors to Cocos2d-x.
The goal of my game is to make a completely white board by flipping stones following 2 types of moves.
I can’t give you any download link, but I took as many screens as I can.

The splashScreen:

The menu:

Connected to the GameCenter:


A game:


EndGame with iAd integration:

Sharing with Facebook:

So far, it’s impossible to call native functions without creating bindings, so I’ll tell you my procedure.
You can also first look at the github that I used to help me
I made a singleton for facebook in Obj-C, here is facebook_objc.h:

@interface FacebookHelper_objc : NSObject
@property (strong, nonatomic) NSMutableDictionary *postParams;
@property (nonatomic, retain) Facebook *facebook;

- (BOOL) publishScore:(int) score;
+ (FacebookHelper_objc*) sharedFacebookHelper;


So, when I want to call publishScore, I do

[[FacebookHelper_objc sharedFacebookHelper] publishScore:score];

I put this in a static function of a C*+ class, inside the facebook.mm file :
#include “facebook.h”
bool FacebookHelper::publishScore
return publishScore:score];
and create the class, here the header facebook.h:
#include “facebook_objc.h”
class FacebookHelper
static bool publishScore;
Don’t forget to put your methods public.
Next, I created the bindings. I used the cxx-generator joined in the tools, and used the generator.py, with the file BindingsHelper.ini
You need to tell to the script the paths to the different header directories through this file.
It was certainly the most painful part of my project, because I used the OSX C*+ library, that uses sometimes other keywords, like OGL for openGL and so…
After satisfying all the header required for the binding generation, I put all the generated files (facebook_bindings.cpp, facebook_bindings.hpp, facebook_bindingsapi.js) into my project.

In fact, It has a lot more difficult and long to make bindings for me, because of dependences of the bindings generator.

I would make soon a public github project with that game, but I can’t yet… :wink:
I want to share my great (and creepy) code to you, because that’s the most interesting.

Sorry, but the second (the bigger) *.ini file joined in this post is the good one, and I don’t know how to delete old files.

userconf.ini.zip (0.3 KB)

BindingsHelper.ini.zip (0.8 KB)


Congratulations! It’s no easy to create a js-binding game on this time.
Will this game be published on appstore?
And have you tried to run in with cocos2d-html5 in webbrowsers?


Yes it will, but it’s currently in beta test, waiting for validation.
We are looking for a good multiplatform 2d framework, but JSB is not mature enough, because it’s quite hard to put extra functionalities.
I will not test in html5, but I can give a try at home.

>Congratulations! It’s no easy to create a js-binding game on this time.
>Will this game be published on appstore?
>And have you tried to run in with cocos2d-html5 in webbrowsers?


Yeah, it’s not mature enough, especially for 3rd SDK integration. That’s the reason why my coworker kick off this project https://github.com/cocos2d-x/plugin-x. The quick thought is that, we can wrap social SDKs, Ads SDKs, analytics SDKs to some different “protocols”, then we only bind these limited “protocols” to javascript. As the result, we only need to wrap 3rd SDKs to protocols in C++, then game logics and easily invoke them from PluginManager. Plugin-X is still in very very early stage.


The game discussed in this thread is now out on the app store

It’s the first cocos2d-js game by C4M!
We hope we’ll have the opportunity to do more. It’s exciting to see how fast cocos2d-js environment is progressing.

Thanks to all the cocos2d makers!