firststeps

This page will step you through installing jeash and writing a small flash sample that compiles into canvas html5 javascript, and renders across browsers.

Installing


Jeash is currently hosted haxelib, to install run:

haxelib install jeash

Getting your feet wet


Create three files in the newly downloaded source code ''App.hx", "app.html" and "app.hxml", containing the following snippets:
import flash.Lib;
import flash.display.Shape;
import flash.display.Sprite;

class App extends Sprite
{
    static function main ()
    {
        var ellipse:Shape = new Shape();
        ellipse.graphics.beginFill( 0xFF9900, 1 );
        ellipse.graphics.lineStyle( 0, 0xCCCCCC );
        ellipse.graphics.drawEllipse( 40, 40, 100, 60 );
        ellipse.graphics.endFill();
        
        var app = new App();
        app.addChild( ellipse );
        Lib.current.stage.addChild( app );
    }
}

The html should be:

<html>
    <head>
        <title>My first Jeash example</title>
    </head>
    <body>
        <div id="haxe:jeash" style="width:150px; height: 150px"></div>
        <script type="text/javascript" src="./app.js"></script>
    </body>
</html>

The div element with id haxe:jeash indicates to the jeash library where the stage should be created, you can control the stage width and height through CSS.

You can compile the above code using the following hxml:

--remap flash:jeash
-js app.js
-main App
-lib jeash

The above includes the following steps:

  • The remap statement translates all packages in the flash top-level domain to jeash,
  • js indicates that the compiler should run the javascript generator,
  • main indicates that the program should start at App.main at runtime,
  • and lib indicates that it should include the jeash library in the classpath of the compile.

Note: If you are using FlashDevelop:

  • Open Project > Properties > Compiler Options. Click on right-side [...]-button for Additional Compiler options, and add --remap flash:jeash in the string collection editor.
  • Open Project > Properties > Compiler Options. Click on right-side [...]-button for Libraries option, and add jeash in the string collection editor.

Baked into the browser

You can simply open the HTML file in the browser, and you should see the example rendering an ellipse.

What now?


What now ? Well, maybe you could try some more complex flash applications - not everything is implemented, but a lot of things are. If something does not work, we're eager to fix it - let us know on the Jeash bug tracker or simply ask a question at the Jeash community site.
version #11754, modified 2011-11-15 13:09:39 by cambiata