haXe : Conditional compiling

A nice and exciting feature about haXe is conditional compilation. That means one can specify which code to compile depending upon the target chosen at the compile time. Hah, that does not make sense ? Ya, I know. Let me explain again.
There is a compiler and while providing argument to it we have to specify which target we are compiling to. Like in case of haXe and NME we can compile it to a lot of different targets. The compiler argument for flash or swf output looks as below

haxelib run nme test app.nmml flash

Now we can compile the code to HTML5 with the following argument

haxelib run nme test app.nmml html5

Thats the beauty of the language. Most of the time its the same code, but then there are times when we need to write different codes for different targets (may be layout, view elements, can be anything). But then one does not need to keep a separate project for all the different cases. The solution is conditional compiling. What it does is depending upon the target type specified to compiler, it picks up the right code from the same file. Whoaa!! Magic :)
How does it do it or how we make it aware of this ?! You asked it. Lets see it.

#if flash
//Code for SWF output
#elseif js
//Code for HTML5/js output
#else
#end

Thats simple. Its one file, completely in itself, but when it comes to compiler it picks up the right code part depending upon the target type.

One thing to remember though, that when specifying HTML5 target, it picks up conditions from “js”, it does not have a “html5″ option. This particular thing took me sometime to figure out. Just thought would point out here saving someone’s time out there.

Happy haxe -ing :)

haXe : adding image to a project

Well, while its all well and good to create graphics and animations on runtime with code. We must agree that there are situations, when we need to external images in our project. This is done by defining a tag in our .nmml file. The exact thing looks as below.

<assets path="src/assets/" rename="assets/all/" include="*"></assets>

In the tag above we are defining that all the files inside “src/assets” folder will be copied over to our final project under folder “assets/all”. Thats one part of the story. Now in our haXe code, we access the assets with their path as below.

import nme.Assets;//import the Class
var img:Bitmap = new Bitmap (Assets.getBitmapData ("assets/all/home.jpg"));//get the asset

The code above the pretty self explanatory. First we need to import the “nme.Assets” and then use it to get the asset into our project. Things to note, while providing path to access the resource, its the “renamed” path we define in the “XML” while adding the asset.
Happy haXe -ing

haXe : switch-case

This syntax is slightly different from other languages in general. It requires a “default” case and without that the compiler will throw error compiling it. The second change is, we do not need a “break” at each “case”, the “break” is automatically called on the last statement.
The general syntax is

switch (result)
		{
			case 'one':
				i = 1;
				//break;
			case 'two':
				i = 2;
			case 'three':
				i = 3;
			case 'four':
				i = 4;
			case 'five':
				i = 5;
			case 'six':
				i = 6;
			case 'seven':
				i = 7;
			default :
				i = 0 ;
		}

Thats not a very huge change, but I think the information will save you sometime in the beginning.
happy haXe -ing.

haXe : dynamic datatype

It may be surprising to believe that the data types are static in haXe, though typed dynamically! This is awesome, for it gives you freedom to just type a variable without defining its datatype at the same time it will not allow to assign other data types to be assigned to the same variable. The best of both worlds. Whether you come from a dynamic language like javascript or a statically typed language like actionscript 3, this will surprise you in the beginning for sure. Another cool thing (rather hot thing) about haXe is these datatype mismatch will be checked at compile time and if mismatched, will not be compiled! Just beautiful.
Here is an example code.

private function testDataType()
	{
		var a;
		a = 2;
		trace(a);
		a = '2';
		trace(a);
	}

The compiler will throw an error saying “String should be Int”. But how it knew that the datatype is Int ?!! The catch is, when the variable is assigned a value for the first time, the datatype is defined for that variable at that point and there after can not be changed. In our case we defined it as Int when assigned the value for the first time.

This concept goes further to function arguements and return types as well.

private function testDataType(x)
	{
		trace(x);
	}

If we call above function with two different types of data as

testDataType(2);
testDataType('test');

The compiler will trow an error saying data type mismatch.
Lastly if there is a return type example code is as below.

	private function testDataType(x)
	{
		if (x==2)
		{
			return 2;
		}else {
			return 'hello';
		}
	}

Though we can assume to write something like above in a dynamic language, but haXe compiler will not compile this, instead throw an error saying data type mismatch.
Happy haXe -ing. :)

haXe : doing a regular update and NME

This came to me as a surprise while trying to write a script, which can run in iOS, HTML5, Flash and Neko. I knew it can be done by cross-compiling through NME to all these target platforms. While this hold good almost in every case but when it comes to regular stage update or the ENTER_FRAME event, it is a problem.
Well, if you are a flash developer and depend on ENTER_FRAME event for a long time, then it may come to you as a surprise like me. The game loop as the gaming engines call it, now has to be worked upon. Fortunately we have a timer function in haXe and that quite fits the game.
Before going ahead in timer, lets see the unreliable nature of ENTER_FRAME for all targets. Firstly I was creating different circles in stage area with an ENTER_FRAME, while that worked well in all platforms, I thought its good to go for all. But then I tried to rely upon the same ENTER_FRAME event with a drag and drop and position change of the elements. Whoa!! That does not work! I stopped relying on the ENTER_FRAME event and changed that with Timer and everything is back in the action again.
The haXe timer code is a little different than Flash timer and the code looks as below.

var timer = new Timer(10); //10 is the time difference in milliseconds between the timer call
timer.run = onEachTimerTick;//its kind of event listener
function onEachTimerTick():Void {}

For me, ENTER_FRAME event only worked for Flash targets and nothing else. So be careful if you want to target other delivery methods.

Happy coding!

haXe : A for loop

Well, this may be a simple case to write. But there is a chance that you may get it wrong in the first go. Thats for this kind of loop has got a slightly different syntax.
The syntax for a for-loop in haxe looks as below

for(i in min...max)
	{
		trace('This is inside for loop.');
	}

This loops from a value of “min” to “max” and “i” is the iterator.

Thats quite simple, even simpler than for-loops in other languages!
Happy haXe-ing :)

haXe : First HTML5 circles

We are going to write an application, which will just draw out different color circles to the HTML5 canvas. Once the number of circles reaches 1000, we are going to clean it up and start over again.
There are 2 files, the first one is the program entry point Main.hx and then there is an ApplicationStage.hx. Basically we are not going to write anything in the program entry class, rather we will keep it clean all the time. So for us, the first class to write some code is ApplicationStage.hx. Below is the code for the two files;

class Main 
{

	public static function main() 
	{
		new Main();
	}

	public function new()
	{
		var as:ApplicationStage = new ApplicationStage();
		Lib.current.addChild(as);
	}

}

We are not doing anything on Main class, rather creating an object of ApplicationStage and adding it to the stage. So the code for ApplicationStage looks as below.

package ;
import flash.display.Graphics;
import flash.display.Sprite;
import flash.events.Event;

class ApplicationStage extends Sprite
{
	private var count:Int;
	private var max:Int;

	public function new() 
	{
		super();
		this.init();
	}

	private function init():Void
	{
		this.count = 0;
		this.max = 1000;
		this.addEventListener(Event.ENTER_FRAME, onEachFrame);
	}

	private function onEachFrame(e:Event):Void
	{
		//count
		this.count++;
		//draw
		var g:Graphics = this.graphics;
		g.beginFill(Math.round(Math.random()*(256*256*256)),Math.random());//Math.random() * 256, Math.random()
		//g.beginFill(0xFF0000,1);//Math.random() * 256, Math.random()
		g.drawCircle(Math.random() * 600, Math.random() * 400, Math.random() * 50);
		//g.drawCircle(20,40,10);
		g.endFill();
		//clear everything
		//trace(this.count);
		if (this.count>this.max)
		{
			g.clear();
			this.count = 0;
		}
	}

}

If you are coming from Flash, it should look as if you are writing Actioinscript ! So no worries.
Now the last thing is to write the nmml file for NME. We save it with name compile.nmml and it looks as below.

<pre>
<?xml version="1.0" encoding="utf-8"?>
<project>
 
	<app title="haXe_Day_8" 
		file="haXe_day_8"
		main="Main" 
		package="com.example.saumyaray" 
		version="1.0.0" 
		company="saumya"></app>
		
	<window width="600" height="400" 
			fps="30" 
			orientation="portrait" 
			resizable="false" ></window>
 
	<set name="BUILD_DIR" value="Export" ></set>
 
	<classpath name="src" ></classpath>
	<haxelib name="nme" ></haxelib>
 
	<ndll name="std" ></ndll>
	<ndll name="regexp" ></ndll>
	<ndll name="zlib" ></ndll>
	<ndll name="nme" haxelib="nme" ></ndll>
</project>
</pre>

Finally the command for compiling it to HTML5 will go as below in the commandline.

haxelib run nme test compile.nmml html5

Well, that all to it.
The source files are here for your reference.