Pages

Monday, May 6, 2013

Second Meeting - Code Setup

For our second meeting, we sat down with the goal to setup our environment, and to get a square moving on the screen.  We were successful after 3 hours of work.  Here's what we did.


Purchasing Engine Licenses

First, each of us purchased an ImpactJS license for $100 and we were emailed the download links to the engine with different example games for reference.

Familiarity with the Engine Directory

The engine download did not come with an installer.  Rather, it was a simple zip file containing the source code for a simple game test example, the engine source code, and the level editor source code.
  • lib/
    • game/ <-- game code (with "hello world" currently)
    • impact/  <-- engine code
    • weltmeister/ <-- level editor code
  • media/ <-- game asset files
  • tools/ <-- "bake" tool that compresses the game code for distribution
  • index.html <-- runs the game
  • weltmeister.html <-- runs the level editor

Creating a workflow to run the game

Both the game and the level editor are web applications, meaning they are run in the web browser rather than as native executables.  We could run the test game by just opening "index.html" in a browser, but the level editor "weltmeister.html" did not work.  This is because the directory needs to be presented by a web server with PHP enabled, since the level editor is doing dynamic server side things like polling for and saving files to our directory.

Thanks to this post in the Impact forum, we learned that we didn't have to install a full LAMP web server stack for our workflow.  So, on the Windows side, we downloaded PHP 5.4, extracted it to some folder, added that location to the PATH variable, and created a "runserver.bat" script with the following line:

php -S localhost:8000

Whenever we want to start work on the game, we just open "runserver.bat" and go to "http://localhost:8000" to run our game, and "http://localhost:8000/weltmeister.html" to run the level editor.

On Mac, I just ran "port install php54" and created a "runserver.sh" script to execute the command "php54 -S localhost:8000".

Setting up an Editor

We installed Komodo Edit, then created a project file inside our code directory.  I think if we set this up correctly, we will get auto-completion, but it is not working currently.

Learning the debug pipeline

Debugging has to be done in the browser.  The level editor gives alert boxes on malformed entities.  And the game gives error message in the Console, which has to be enabled in your browser.  We enabled the "Web Console" in Firefox in the developer tools menu.

Setting up Version Control

To backup code, keep track of our changes and to synchronize edits between us, we created a free and private mercurial repository at Bitbucket.  On the Windows side, we installed TortoiseHg to synchronize our code with the repository.

Meeting our Implementation Goal

We drew a simple character with a transparent background in GIMP.  Then we saved it to the media/ folder.  Created an entity for the character in /lib/game/entities, then created a level with "weltmeister" that placed our character in the level.  After debugging, watching tutorials, and comparing with the working examples, we accomplished a first working example.

No comments:

Post a Comment