Erain 3D
-->

Author: Max Pellizzaro
Date: June 10th 2008
version: 3.0.3

Importing MD2 files Part I

Objective of the tutorial

With this tutorial you will learn how to use the new importing features present in Sandy: MD2 files.
This features will allow to import 3D Models in Sandy World and thread them as any Sandy object.
It is a great feature introduced by Makc!! When first I saw it I did not even know what was an MD2 file, and so I have found this article that explain a little bit of this file format.
At the end of the tutorial you will see a riding horse and a flying bird.

How to

Set up

The Document class must be changed to Example025.as The name of the class in the .as file and the name of the constructor now is: Example025. No extra classes can are needed for this tutorial, but you will need all extra the resources: 2 MD2 files and 2 skins that can be found in the attached rar.
All the required files can be found here:

example025.rar

The AS Code

package {
	import flash.display.*; 
	import flash.events.*;
	import flash.net.*
	import flash.utils.*
	
	import sandy.util.*;
	import sandy.core.Scene3D;
	import sandy.core.data.*;
	import sandy.core.scenegraph.*;
	import sandy.materials.*;
	import sandy.materials.attributes.*;
	import sandy.primitive.*;
	import sandy.events.*;
	

	public class Example025 extends Sprite {
	private var scene:Scene3D;
	private var queue:LoaderQueue;
	
	private var imp:MD2;
	private var imp02:MD2;
	

		public function Example025() { 
		    queue = new LoaderQueue();
			queue.add( "bird", new URLRequest("md2/bird_final.md2"), "BIN" );
			queue.add( "horse", new URLRequest("md2/horse.md2"), "BIN" );
			queue.add( "birdSkin", new URLRequest("md2/bird_final.jpg"), "IMG" );
	        queue.add( "horseSkin", new URLRequest("md2/horse.jpg"), "IMG" ); 
			queue.addEventListener(SandyEvent.QUEUE_COMPLETE, loadMD2Complete );
            queue.start();
		}

		private function loadMD2Complete(event:Event):void {
			
			scene = new Scene3D( "scene", this, new Camera3D( 600, 600 ), new Group() );
			imp = new MD2 ( "imp", queue.data["horse"], 2 ); 
			imp.y = -100;
			imp02 = new MD2 ( "imp02", queue.data["bird"], 0.05 );
			imp02.y = 50;
			imp02.x = 0;
			imp.appearance = new Appearance (new BitmapMaterial( queue.data["horseSkin"].bitmapData ));
			imp02.appearance = new Appearance (new BitmapMaterial( queue.data["birdSkin"].bitmapData ));		    
			scene.root.addChild( imp );
			scene.root.addChild( imp02 );
			addEventListener( Event.ENTER_FRAME, enterFrameHandler );
			stage.addEventListener (MouseEvent.MOUSE_MOVE, mouseMovedHandler);
			
		}
	
	  private function mouseMovedHandler (event:MouseEvent):void{
			imp.rotateY=(event.stageX-600/2)/4;
	  }
		
	  private function enterFrameHandler( event : Event ) : void {
			if (imp != null) {
				//imp.rotateY += 1; 
				imp.frame += 0.3;
				imp02.frame += 0.3;
			}
			scene.render();
		}
	}
}

Examining the code

The first thing we need to do is loading the new files. I wanted to use the LoaderQueue class, but initially that class was not able to handle Binary files, so I have made a little change and now with that class with can load both skins (jpg files) and M2D files (binay files). Here is the code to load what we need (I have added an extra parameters to tell the LoaderQueue what is getting loading):

queue = new LoaderQueue();
queue.add( "bird", new URLRequest("md2/bird_final.md2"), "BIN" );
queue.add( "horse", new URLRequest("md2/horse.md2"), "BIN" );
queue.add( "birdSkin", new URLRequest("md2/bird_final.jpg"), "IMG" );
queue.add( "horseSkin", new URLRequest("md2/horse.jpg"), "IMG" ); 
queue.addEventListener(SandyEvent.QUEUE_COMPLETE, loadMD2Complete );
queue.start();

Now that we have loaded the required files, we are ready to place the object in our Sandy world:

imp = new MD2 ( "imp", queue.data["horse"], 2 ); 
imp.y = -100;
imp02 = new MD2 ( "imp02", queue.data["bird"], 0.05 );
imp02.y = 50;
imp02.x = 0;

The usage of MD2 class is so simple that does not need to be explained: just need to define a name, the Binary Data of the file, and the resizing dimension of the loaded object (default is set to 1).

Now we need to place skins to our loaded objects, so we just use our Appearance class:

imp.appearance = new Appearance (new BitmapMaterial( queue.data["horseSkin"].bitmapData ));
imp02.appearance = new Appearance (new BitmapMaterial( queue.data["birdSkin"].bitmapData ));

Now it comes an important section of the code, so take a note on the following explaination!
If you have read the paper explaining the M2D file format, you know by now that the M2D file can have a sequence of frames. Looping through these frames we have the animation effect of the movie clip. We need to tell sandy how to loop, and the MD2 class will manage also the interpolation between frames… isn't it cool !!
So let's see how to loop between frames:

...
imp.frame += 0.3;
imp02.frame += 0.3;
...

As you can see the MD2 object has a property, frame, that can be looped to animate the object. In this example we have just use a very simple loop just to see how it works, in the next tutorial we will use Tweener class to produce more cool effects.

And now let’s see the result !

The output

Move the mouse to see the horse rotating