Forum > Javascript Binding > JavaScript Bindings

JavaScript Bindings

By funkaster Posted 2012-03-23 19:06 Comments 53
funkaster
  • Posts: 11

Hi guys,

sorry for announcing this so late, but here it goes:

My name is Rolando and I’ve been working on the cocos2d-x-javascript bindings for a while. We (Zynga) released as open source the branch old-js-bindings, that was using JavaScriptCore last week and right now we’re openly working on a new, better, improved, faster, javascript bindings using SpiderMonkey. You can check the progress in my personal fork (I’ll be merging code to the cocos2d-x project as it gets stable):

https://github.com/funkaster/cocos2d-x/tree/js-bindings/js

Why we moved from JavaScriptCore to SpiderMonkey?

Apparently everyone is using JavaScriptCore, but although that seems to be true, they are all infringing the LGPL license (actually Apple is infringing the License), so we searched for other JavaScript VMs and decided that SpiderMonkey was a good candidate. We got it working on iOS and Android fairly easy:

https://github.com/funkaster/spidermonkey

And we’re using that on the new bindings.

How do the new bindings work?

We’re going to build them in a two step process: we want to create a simple script that will parse the cocos2d.h header file and automagically create the bindings for cocos2d-x (or any other C/C++ project for that matter). We’re half-way through with this script and you can check the progress in my fork. The script is using clang to produce an xml for the AST, so that makes it very powerful. This script will only get us that far: producing a 1-1 mapping of the API. Although that’s a good thing, is not what we’re aiming, we want to have a very javascript-friendly and awesome API, leaving room for a future where you could code your game in javascript and run it natively (using cocos2d-x) on your device, or using another port of cocos2d on the browser.

The second part will be written in javascript, we’re going to take the 1-1 API conversion and we’re going to wrap it to make it more appealing for javascript developers. We’re going to start on that as soon as we finish the automatic bindings.

As you can see, we decided to move with this in the open source model, so you can join us in the fun and contribute (either just testing, bug reporting, or with code) to this project to make it even better.

What is working today?

We have a working SpiderMonkey for iOS and Android and basic autobindings for properties (fundamental, pointer and reference types), classes and a few other things. We’re adding functions/constructors support as I write this, so that should be there pretty soon. You can check the Readme in the js directory in the js-bindings branch to test it.

Anyway… that’s it, I hope you’re all as excited as we are regarding this project and hopefully you’ll be coding your games in javascript pretty soon[]()

Rolando

funkaster
  • Posts: 11

#1 RE: 2012-03-23 19:08

Oh, also… since we’re using clang to parse the headers, we’ll try to do the same for cocos2d-iphone.

Enjoy!

walzer
  • Posts: 1735
  • Location: Xiamen, China

#2 RE: 2012-03-24 00:43

Great job! gles20 branch is also improving very fast. We can probably merge these 2 branches in April, if each of them are mature, then launch a super release. :)

Less is More. Keep Focus.

l4u
  • Posts: 54

#3 RE: 2012-03-24 01:55

very cool! i’m trying it out.

funkaster
  • Posts: 11

#4 RE: 2012-04-16 22:41

a more functional version is on my fork:

https://github.com/funkaster/cocos2d-x/tree/js-bindings/js

currently working:

CCPoint CCSize CCRect CCDirector CCNode CCSprite
CCScene CCSpriteFrameCache CCSpriteFrame CCAction
CCAnimate CCAnimation CCRepeatForever CCLayer
CCTouch CCSet

check the JS-test for a sample javascript demo.

sparkart
  • Posts: 77

#5 RE: 2012-04-17 00:55

Dang, sounds extremely exciting.

How long do you think it would take to get to a functional state where we can use Javascript to develop for iOS, Android, and HTML5?

funkaster
  • Posts: 11

#6 RE: 2012-04-17 19:46

for iOS and Android that should be soon (couple of weeks?). For the HTML5 side… I would say more, but maybe the cocos2d-x team has more insight in that.

For now, here’s a sneak peak (iOS only, Android following soon[]()

https://github.com/funkaster/testjs

Enjoy)

jandujar
  • Posts: 175
  • Location: Spain

#7 RE: 2012-04-18 09:59

Would be possible to add non-cocos2d-x clases to the build?

Like Ad-related librarys (admob/tapjoy/etc…)

I’m very interesting in the JS binding, but I need to know If I could extend the funcionality (easily).

I apologiced for my english.

http://www.jandusoft.com
More than 10m downloads of my first game "Guess the Character"

l4u
  • Posts: 54

#8 RE: 2012-04-18 10:38

Probably you need to write js wrappers for cpp, and cpp wrappers for objective c/ java

funkaster
  • Posts: 11

#9 RE: 2012-04-18 17:09

It is possible to use extend the functionally easily. The current bindings are being generated automatically using the cocos2d.h header file, and our purpose is to do the same with other libraries.
Currently you need clang-2.8 and it only works for C++ (so far, we’re trying to extend it for obj-c as well), you can then give a look at the generate_cocos2d_xml.sh script, which basically runs clang and outputs an XML version of the AST:

https://github.com/funkaster/cocos2d-x/blob/js-bindings/js/generate\_cocos2d\_xml.sh

that xml file is then feeded to the generate_bindings.rb script that will create the proper .hpp and .cpp creating javascript classes, methods, etc. There are some conventions that I’ll describe in a document soon, but it works for most of the cases. It will not produce a “pretty” API, but is a great first step. You can then write a simple JS wrapper if you want to make it more js-friendly. That’s the way we’re approaching to release a fully functional cocos2d-x API.

Now, if you don’t want to generate the bindings automatically, you can always use the SpiderMonkey API (which is very nice!) to create your custom bindings:

https://developer.mozilla.org/en/SpiderMonkey/JSAPI\_Reference

hth,
Rolando

jandujar
  • Posts: 175
  • Location: Spain

#10 RE: 2012-04-18 17:12

Thank’s Rolando, I will begin using the JS binding on my next project. Any date for the Android version?

http://www.jandusoft.com
More than 10m downloads of my first game "Guess the Character"

funkaster
  • Posts: 11

#11 RE: 2012-04-18 17:25

Later this week we’ll have Android support, I’ll update this thread as soon as we have that ready.

walzer
  • Posts: 1735
  • Location: Xiamen, China

#12 RE: 2012-04-21 09:12

Rolando, gles20 branch of cocos2d-x is much improved recently. FishingJoy2 is using this branch, so I’m sure that it’s mature enough. Could you bind js onto gles20, we can abandon the js-binding feature on 1.x. I saw that CocosBuilder v1.1 and higher only supports cocos2d 2.0

Less is More. Keep Focus.

funkaster
  • Posts: 11

#13 RE: 2012-04-23 16:23

Moving to the gles20 branch should be straight forward: I assume very little external API has changed, and I didn’t modify any part of cocos2d-x internals, so migrating to that should be easy. I’m focusing right now on having a working javascript bindings and then I’ll move the code to the new branch.

Kellog
  • Posts: 5

#14 RE: 2012-05-18 12:07

Will the JavaScript bindings work with the Windows 8 Metro cocos2d branch? Thanks!

walzer
  • Posts: 1735
  • Location: Xiamen, China

#15 RE: 2012-05-28 05:23

@Paul, We have no plans to run jsbinding in win8 metro currently. But it can work on win8 desktop, using compatible mode the same to most windows programs.

Less is More. Keep Focus.

Kellog
  • Posts: 5

#16 RE: 2012-05-28 07:16

Thanks for the reply. I guess Metro apps can be authored using HTML5 cocos2d.

MartinJ
  • Posts: 1

#17 RE: 2012-06-01 06:38

This JS binding looks amazing! I’m really eager to start learning it. But… Is it possible to submit a JS-binded game to the App Store? Indeed, I’d like to be sure about that before writing a very time consuming application…

jandujar
  • Posts: 175
  • Location: Spain

#18 RE: 2012-06-01 06:48

As far as I known, the JS-Binding is compiled to native code using a script.

The JS-Bindig is for multiple deployment. (with the same source-code)

http://www.jandusoft.com
More than 10m downloads of my first game "Guess the Character"

funkaster
  • Posts: 11

#19 RE: 2012-06-01 16:23

`martin it is possible to submit a game to the AppStore. We're internally developing the bindings at Zynga and we did some research before investing time. This is the same as with the lua bindings, and even better than other approaches doing the same using JavaScriptCore: due to licenses problems, you should not be submitting a game using JavaScriptCore, but we're using SpiderMonkey, which has a more permissive license.

`Jose: it does not compile to native. Ideally, however you want to have something like google’s closure compiler to run through your code before shipping it.

sparkart
  • Posts: 77

#20 RE: 2012-06-15 09:28

I am just curious if you could give an estimate of how much work hours are required to implement Javascript bindings? The reason I ask is because perhaps a kickstarter project could be started to get bindings for all of the other platforms as well (XNA and Blackberry). I think that there really is something here with Cocos2d-x. Free, open-source, native support for multiple platforms, lua and javascript scripting, decent tools (cocosbuilder, tiled map editor), most importantly single codebase.

shinriyo_twitter
  • Posts: 25

#21 RE: 2012-09-27 00:14

Hi

Is this complete for Android?
I want to write cocos2d-x by JavaScript. :)

crazyrems
  • Posts: 14
  • Location: France

#22 RE: 2012-11-21 10:29

Hi everybody,

I am working on a ios project, and I want to call an Obj-C class from Javascript with Cocos2D-X JSB.
So I created a .mm class wrapper, I can call a static function of my Obj-C class with C**.
Now I need to bind JS functions to that C** class.
I try to make my own binding with help of this : https://github.com/funkaster/cocos2d-x/tree/js-bindings/js/test\_bindings
After making my binding files, what is the exact procedure, because I think these only files don’t make any bindings.
Is there some code to write ?
Which files must we include to register JSB functions ?

Thanks

pinosh
  • Posts: 9

#23 RE: 2012-11-21 22:53

Hi,
You need to include the spidermonkey lib in scripting/javascript/spidermonkey-ios as well as the files in scripting/javascript/bindings and scripting/javascript/bindings/generated
To generate your own js bindings from the native class use cxx-generator from tools/cxx-generator. As an example, check out tools/tojs
As a JSB example, you can check out the MoonWarriors or TestJavascript projects in the samples directory.
Best of luck

crazyrems
  • Posts: 14
  • Location: France

#24 RE: 2012-11-23 13:53

Hi,

Thanks for your quick reply.
I tried to make my bindings with your help, but I can’t make it working..

Here is my unsuccessful story about trying to generate JS file from C*+ files wrapping Obj-C files:
# I made Obj-C files and made a wrapper in C*+, until here no prob.
# Then I went to the tools/cxxgenerator folder to create our corresponding JS bindings.
# From there, I created our own ini file but I first wanted to make the test sample work with the simple class file.
# With test.ini I launched test.sh which launches generator.py internally
# Here becomes the nightmare. I needed to painfully install the following:
* YAML with all the dependencies
* Pygment.lexer
* Cheetah, Cheetah.Templates and from there I had a badValueSubstitution error where the only solution was to modify the dynamic paths with hardcoded paths
* Python, and python sources in the system headers
* Need to compile _namemapper.c

I ended with the following message:

You don't have the C version of NameMapper installed! I'm disabling Cheetah's useStackFrames option as it is painfully slow with the Python version of NameMapper. You should get a copy of Cheetah with the compiled C version of NameMapper.
  "\nYou don't have the C version of NameMapper installed! "
Exception ctypes.ArgumentError: "argument 1: : 'TranslationUnit' object has no attribute '_as_parameter_'" in > ignored

Did you encounter any similar issues ? Do you have some clues to fix my problem ? Do you know if other simpler tools to generate the bindings would be available in the near future ?

Thanks very much

pinosh
  • Posts: 9

#25 RE: 2012-11-23 16:34

Yes it’s indeed a daunting task to do all it’s necessary.

Ok. The first “You don’t have C version…” you can ignore that - it’s basically saying you don’t have _namemapper.pyd compiled from c/c++ sources. It is working fine with the python one too, so you can ignore it.
The Exception, i had a similar one, basically you probably set a path or a headers filename wrong, and python can’t find it. Check again your config files and make sure everything is allright, as well as check the userconfig.ini auto generated file to make sure it’s being generated correctly.

Other than these, i’m getting a bunch of errors about some problems in android ndk sources, but i just ignore those. If you don’t see any errors about your own source files, you should be good to go. Granted that you’ll be able to solve the Exception above.

Copyright © 2010 - 2013 Cocos2d-x.orgClustrmaps