Create extern classes for the Dojo library. The Dojo library is invoked using an in-built package manager. The Haxe - equivalent extern classes can mirror this package structure to keep things nicely organised. First off, create a Dojo.hx file in the root of your Dojo package folder structure:
extern class Dojo {
public static function addOnLoad(fn: Void -> Void):Void;
public static function require(moduleName: String, ?omitModuleCheck:Bool):Void;
public static function byId(id:Dynamic, ?doc:Dynamic):Dynamic;
public static function body():Dynamic;
}
I have only included a few functions here so far. Notice that all of them are static.
In your Haxe application Main class, include this in the main() function:
Note the "Dojo=dojo" line. This took me sometime to figure out. The javascript dojo library uses the root "dojo" namespace for it's top - level functions. But Haxe does not let you define a Class with a lowercase first letter. This statement assigns the native "dojo" object to another object called "Dojo". This magically makes all the javascript code generated from the Haxe compiler work.
import Dojo;
...
class MyDojoTest {
public static function main() {
untyped __js__("Dojo = dojo"); // assign "Dojo" javascript object to actual "dojo" object. Workround because Haxe requires class names to start with uppercase character
Dojo.addOnLoad(MyDojoTest.doSomething );
}
public static function doSomething() {
...
}
}
The Dojo.addOnLoad() method call utilises the dojo page loader call to hook in the rest of your Haxe javascript application startup code (in this case, a class method defined in MyDojoTest class).
Compile your haxe application with the -js flag (e.g. -js main.js).
In your HTML file, import the top-level Dojo javascript library .js file, and the .js file created by the Haxe compiler.
<head>
...
<script type="text/javascript" src="js/dojo/dojo.js"></script>
</head>
<body>
...
<script type="text/javascript" src="js/main.js"></script>
</body>
Running this HTML file should trigger the dojo.addOnLoad() function call and off you go!
You can now go ahead and write further extern classes for the specific Dojo and Dijit classes you need to use programmatically from your Haxe application. For example, here's a simple extern class (in BorderContainer.hx) that let's you create a new BorderComponent from within Haxe code:
package dijit.layout;
extern class BorderContainer extends LayoutContainer {
public function new(params:Dynamic, ?srcNodeRef:String):Void;
}where LayoutContainer.hx contains the following definition:
package dijit.layout;
extern class LayoutContainer {
public function new(params:Dynamic, ?srcNodeRef:String):Void;
public function addChild(widget: Dynamic, ?insertIndex:Int):Void;
}Note the haxe package structure mirrors the dojo native package structure for these components / widgets.
