JavaScript to build Cocos2d-x Games for Modern Windows

Datetime:2016-08-23 04:31:20          Topic: JavaScript  Cocos2d-X           Share

MS Open Tech has just contributed JavaScript support for Cocos2d-x for Modern Windows . With this version of the popular “Cocos” family of technologies, named Cocos2d-JS, developers who like to program in JavaScript can now create Cocos2d games that will run on Microsoft Windows 8.1 and Windows Phone 8.1 platforms.

As with previous open source code contributions made to Cocos2d-x by MS Open Tech , this new JavaScript language support implements the Universal Application Platform paradigm.

The Cocos2d-x engine is exposed via a set of JavaScript objects and APIs. Therefore, when you develop a Cocos2d-JS game using JavaScript, you will also be able to leverage the robust and high performance C++ engine from your JavaScript code. It is intuitive, and JavaScript rendering also takes advantage of the C++ rendering engine (our tests in the example below show 60 FPS).

Getting Started

As with our other Cocos2d-x open source projects, all of the bits can be accessed via GitHub. Follow the steps as outlined within the readme file .

If you opt to fork from the GitHub repository or download the package from GitHub, you may need to do a little extra work:

· Run git submodule update --init --recursive in the cocos2d-js root folder, to init and update submodules recursively, such as cocos2dx/plugin.

· Run frameworks\js-bindings\cocos2d-x\download-deps.py to download external dependencies for Cocos2d-x

· Run tools\cocos2d-console\download-bin.py to download bin files for some cocos2d-console plugins like Google Closure Compiler and JSC Compiler.

· Run setup.py and restart your command line.

Once set up is complete, you may create a JavaScript game with Cocos2d-x, by simply running this command line:

Cocos new MyGame4 –l js –d projects

This will create the project structure shown in the figure below:

projects\MyGame4\frameworks\runtime-src\proj.win8.1-universal

Note the presence of the resources.props file. I will cover this in more depth in a future blog post, but this file is essential to integrate all of the needed C++ and JS files associated with this kind of solution.

When you open the solution file (MyGame4.sln in the above example), you will see the following project structure. For each project, the structure will be the same, with shared code and dedicated code to Phone and Windows.

The good news here is that you should not need to touch these files J. All of the game code that you will create will be contained within the root folder of the game directory and in the src folder as seen below:

JavaScript Game Sample: MoonWarriors

Bundled with the Cocos2d-js source, you will also find a ready to use JavaScript sample game called MoonWarriors [\cocos2d-js\samples\js-moonwarriors].

MoonWarriors is easy to build. Open the sample from the above directory, then open the solution file with Visual Studio and begin building it (Press F5 to build and run in debug mode).

Beyond being a fun, simple game to play, MoonWarriors offers a good overview of some of the basic techniques that may be used with Cocos2d-js. You may also reference it to learn how to use different graphics scenes or menu scenes, how to use the HUD and sprite layer within the game scene, and how to manipulate sound and a variety of inputs (touch in this case). All the source files are located in \cocos2d-js\samples\js-moonwarriors\src

If you are a JavaScript developer you now have all you need to start releasing awesome games for Windows Phone via Cocos. Give it a try, and let us know about your experience!

Happy coding!

Eric





About List