Of course there will be a lot people who might say that it’s bullshit to include JavaScript into a Flash file (.swf) to obfuscate the JavaScript code – and your right. This is just one thing you can do which has some advantages and also some disadvantages.

In case you want to hide your JavaScript source code not to be seen by other people because it takes you so much time or even money to develop this code – sorry to say, but this will not finally work. There are a lot websites out their which “encrypt” your JavaScript code and make it less readable for humans. But there are as well sites which do the opposit and make it really well readable again. So it will always be possible to have a look at your source code. Also hiding the JavaScript in a flash file will just makes it more difficult, but not impossible, because you could also decompile the flash file.

The worst disadvantage of executing the JavaScript code from within an flash file is of course that this requires flash support at the client side. So this is applicable if you already use flash on your site or at least for all JavaScript parts that are directly related to the flash application. This also encapsulates all application parts in one file ( and reduced the number of loaded files ).

Do it

The first thing you should do ist to compact your JavaScript to keep it small. You could use the JavaScript Compressor by Dean Edwards ( http://javascriptcompressor.com/ ), the Google Closure Compiler ( http://closure-compiler.appspot.com/home ) or other tools. Here is a little tool uses different compressors and shows the compared results: http://compressorrater.thruhere.net/. Be sure you have a clean JS code before you compress it ( JSlint – it might hurt your feelings ), otherwise the compacted JS might not work. You will end up in a single line string of compressed JavaScript code.

Here is a simple JavaScript example, which creates an new div-Container as child of an existing container. The id of the existing container is ‘myCurrentNodeID’. This should be changed dynamically. Therefore this will be replaced by an more abstract placeholder which will be replaced by an regular expression.

function myJSMethod( nodeId ){
  var node = document.getElementById( nodeId ),
  newNode;
 
  newNode = document.createElement( 'DIV' );
  node.appendChild( newNode );
 
  alert( nodeId );
}
myJSMethod( 'myCurrentNodeID' );

Compressed and with replaced node id this looks like this:

function myJSMethod(nodeId){var node=document.getElementById(nodeId),newNode;newNode=document.createElement('DIV');node.appendChild(newNode) alert(nodeId)}myJSMethod('###');

In our final implementation we will have one variable or const with the JavaScript code. In your final project you should create and ANT task for the JS processing. To include all JavaScript into one file, compress the file and paste the JS String into the ActionScript class.

public class myClass extends Sprite{
 
		// this JavaScript code will be injected first into the page
		private const JS_CODE:String = "function myJSMethod(nodeId){var node=document.getElementById(nodeId),newNode;newNode=document.createElement('DIV');node.appendChild(newNode) alert(nodeId)}myJSMethod('###');";
		private const JS_PATTERN:RegExp = /###/g;
		// node id given dynamical to the class
		private var nodeId:String;
 
		/**
		 * constructor
		 */
		public function myClass( nodeid ){
                        this.nodeId = nodeid;
			if( this.available() ){
				// injekt js code
				ExternalInterface.call("eval", this.getJSCode() );
			}
		}
 
		/**
		 * replaces a strings by pattern within the javascript code snipped
		 * @return replaced javascript code
		 */
		private function getJSCode():String{
			return this.JS_CODE.replace( this.JS_PATTERN, this.nodeId );
		}
 
                // do your stuff
}

In the class constructor the JavaScript will be executed the an eval statement via the External Interface. This will make the JavaScipt code available in the browser context. Even the JavaScript function “eval” ist evil, this will only be executed once. Be sure you don’t make to much use of it in your own code.

You can find full working demo code here – its used for my self resize class: http://blog.sebastian-martens.de/2010/06/resize-flash-application-container/

cheers,
Sebastian

Die FOTB fand im Brighton Dome und näherer Umgebung statt. Es gab bis zu vier parallele Sessions. Für alle die, die keinen Workshop am Sonntag gebucht hatten fing es Montag morgen mit dem Check-In an. Wäre schön gewesen hätte man sein Mobiltelefon auf UK-Zeit umgestellt. Dann hätte man noch ausschlafen können und wäre nicht eine Stunde zu früh.

Nicht nur der Brighton Dome ( ein altes Theater mit entsprechend größer Bühne und klasse Sitzen ) machte gleich zu Beginn Eindruck. Auch das Opening-Video lässt das kreative Herz höher schlagen:

Die Keynote machen Andrew Shorten, Thibault Imbert, Richard Galvan und Doug Winnie. Alle samt Produktmanager bei Adobe. Es gab wenig Neues. Aber es gab noch eine kleine Preview vom nächsten Flash Player zusehen. Gerade die Mac-User dürften sich freuen, wurde doch endlich deutlich an der Video-Performance Schraube gedreht. Mehr GPU lässt den Flash Player nicht mehr bei 80% sondern 5% CPU-Auslastung bei der Videowiedergabe sein Werk verrichten.

Weiter ging es mit Grant Skinner. Weg vo Code, hin zur Inspiration und was man mit Flash sonst noch so machen kann und ganz. Nimm dir die Zeit – und plane das am besten auch fest ein – etwas Neues auszuprobieren. Was gibt die Technologie sonst noch so her. Daraus ergeben sich dann neue Projekte ( und Kunden ) schneller als man das gedacht hätte. Dazu zeigte er seinen eigenen Experimente. Z.B. das Steuern der Carrera Bahn mit einem Android-Phone-Pedal, dem Android-Phone-Multiplayer-Game-Controler oder dem Steuern der Carrera Bahn mit Hilfe von Sound ( welches Kind freut das nicht – besonders die Großen ).

Next: Andre Michelle: Audio – was den sonst. Nichts wirklich Neues an dieser Front, aber in dem Saal ist der Sound einfach großartig. Da kann man auch einfach mal genießen was andere mit dem Audiotool so zaubern !

Next: Mario Klingemann. Mario hatte angekündigt, dass er nach diesem Vortrag erst einmal eine kreative Auszeit nehmen wolle. Also vorerst die letzte Chance Mario Klingemann auf der Bühne zu sehen. Das muss man sich dann natürlich auch ansehen. Wie immer wird man nicht enttäuscht. Höhepunkt: Wie baue ich in ein paar Tagen ein Tool aus einer Kamera und Flash, dass mir automatisch eine Puzzle löst …

Hoss Gifford: “Things i have learned”. Im Grunde schon eine “Get Inspired Session”. Der Vortrag ist nur schwer zu beschreiben. Aber er hat recht. “Frühstück ist die wichtigste Mahlzeit des Tages. Nimm dir die Zeit.”. Es ging nicht nur um die simplen, alltäglichen Dinge, die dann doch irgendwie nicht mehr selbstverständlich sind, aber dann eigentlich doch. “Warum gehe ich nicht jeden Tag meine Aufgaben so an, wie an dem Tag bevor ich in den Urlaub fahre.”

Next: Robert Hodgin: So gut, dass John scheinbar bewusst keinen andere Session zur gleichen Zeit angesetzt hat. Eine audiovisuelles Erlebnis der besonderen Art. Als Einleitung von John: “Wer benutzt iTunes ? Wer kenn in iTunes die Visualisierung zu den Songs ? Das ist der Mann der das gemacht hat!”. Hier mal ein sehr schönes Beispiel ( auch das im Theater mit riesiger Leinwand und super Sound natürlich “etwas” besser ):

Nach drei Stunden Pause und dem einem Freigetränk an der Bar ging es abends um 20h nochmal zur “Inspired Session”. Redner am ersten Tag: Stefan Sagmeister mit “Design and Happiness”. Wer irgendwann mal die Chance hat diesen Menschen live zu erleben, sollte dies unbedingt tun. Eine wirklich interessante Persönlichkeit. Der gute Mann ist erfolgreicher Designer. Eines seiner Geheimrezepte: Auszeit nehmen. Und in der Tat macht er alle paar Jahre ( 5-6 ) ein Jahr Pause von der normalen Arbeit um für sich kreativ zu sein. Letztendlich mit dem Erfolg, dass es sich nicht nur persönlich, sondern auch monetär für ihn auszahlt. Eine echte “Inspired Session”. [Update: Ted Talk von Ihm, quasi das gleiche: http://www.ted.com/ ]

Der Abend klingt aus bei eine paar Cola und gemütlichem Beisammensein ! Grüße an die Flash Usergroup Ruhrgebiet.

Tag 2

09.00 Uhr – “The Elevator Pitch”: 20 hochmotivierte Künstler / Coder / Speaker haben 3 Minuten Zeit um zu zeigen was sie können. Der Gewinner wird im Nachgang ermittelt und bekommt im nächsten Jahr eine eigene Session. Es war in der Tat ein bunt gemischter Haufen mit Vorträgen bei denen man sich schon gefragt hat – warum ?! – und sehr eindrucksvollen Präsentationen bei denen man gerne mehr als 3min gesehen hätte.

Branden Hall: Bisher hatte ich noch nicht die Gelegenheit mir das Hype Framework mal anzusehen und mal schauen wie lange es dauert, bis ich wirklich dazu komme ( -> Auszeit für die Kreativität nehmen ), aber man sollte es auf jeden Fall mal tun. Mit diesem Visualisierungsframework lassen sich wunderbare Sache erschaffen. Besonders erfreut hat mich die Ankündigung, dass auch erste Sachen nach JavaScript portiert wurden ( mehr als Versuch und weniger als dauerhafte Lösung wegen Zeichenperformance – Flash bleibt Nummer 1 ).

Joa Ebert: Eigentlich dürfte man schon gar nicht mehr zu den Vorträge gehen. Man geht immer mit dem Gefühl raus: “Was mache ich eigentlich den ganzen Tag.” Heute: Wir bauen uns einen eigenen Flash Player. Aus Joas stetiger Bemühung der Flash Plattform mehr Performance zu entlocken und dar kompilierte Gut zu optimieren, was derzeit in seinem Apparat Framework mündet, ist JITB der jüngste Spross. Letztendlich geht es darum bestehenden ActionScript Code in Java zu wandeln um diesen dann in der wesentlich performanteren JVM laufen zu lassen – also der Flash API innerhalb von Java. Einfaches und eindrucksvolles Beispiel: Ein winziges Skript, dass einfach nur ein paar tausend Instanzen eines Objektes erzeugt: Laufzeit Flash Player 560ms. Laufzeit in Java nach JITB: 16ms. Liebes Flash Player Team: Da geht noch was bei euch :)

Next: Florian Schmitt – “Business in the front – arty in the back.” Anfänglich eine wenig schwer aber letztend ganz gut anzusehen.

Julien Vallée, ist ein Designer aus Montreal, den John auf der Offf, für die er auch den Opener kreierte, rekrutiert hat. Er zeigte tolle Entstehungsprozesse und Make Ofs von seine Produktionen für die New York Times oder MTV.

OFFF Paris 2010 Sponsors titles from Julien Vallée on Vimeo.

Nando Costa – ein Designer aus den USA, der z.B. den bereits beworbenen Introfilm zur FOTB2010 begesteuert hat, zeigte Einblicke in seine Arbeit, und u.a. das Making Of zu dem Introfilm. Projekte die gelungen sind und Pitches die letztendlich an andere Studios gingen.

Pause, Freigetränk und Ready for Inpsired Session

Brendan Dawes – “Makers of Things”: Talk – Action = Shit. Eine Reise durch ein paar Jahr(zehnt)e in der digitalen Produktion und Projekten die Brendan gemacht hat. Den ganzen Vortrag gibt es bereits auf seiner Webseite zu sehen: http://www.brendandawes.com/project/makers-of-things/

Mehr Bar, mehr den Abend genießen.

Tag 3

Es geht los mit “6 of the Best – 10 Mins Each”. Irgendwie rissen die Sachen leider nicht so vom Hocker, wie man sich das bei dem Titel gewünscht hatte. Trotzdem wert so früh aufzustehen. Auch wenn es nicht live gecodet war, es gab noch mehr von Robert Hodgin zu sehen. Traumhaft.

Robert Reinhardt: Hab ich irgendwie verpasst. Wir haben uns mehr mit dem Gewinnspiel beschäftigt. Den auch in diesem Jahr gab es einen Fotowettbewerb. Die besten Bilder die mit der offiziellen Flash on the Beach Mütze eingereicht werden bekommen Freikarten für das nächste Jahr. Wir haben ein wenig außer der Reihe dann mehr ein Video eingereicht. Hier der Beitrag der Flex Usergroup Hamburg und der Flash Usergroup Ruhrgebiet:

Letztendlich gab es dann doch noch ein Ticket dafür, John: “I give it to the nacked guy.”

Ralph Hauwert – Auch immer wieder sehenswert. Mehr Code, mehr Mathe, viel 3D – am besten selber sehen !

Cyriak Harris – “Animated Mental Malfunctions”. Der Titel trifft es eigentlich. Wenn auch nicht in Flash umgesetzt sondern in After Effects is es ein großartiges visuellens und Hirnschmelzendes Erlebnis. Also mal “Cyriak Harris” Videos bei YouTube schauen !!! Weniger “Mental Malfunctions” aber zusammen mit der Musik sehr gelungen:

Joshua Hirsch ist technischer Leiter bei der Agentur “The Big Spaceship”. In seinem “Summer Fridays” berichtet er über die Erfahrung mit der kreativen Freizeit. So wird in der Agentur der Freitag Nachmittag in der Regel für interen Projekte genutzt und nicht für Kundenarbeit ( bei dringenden Deadlines mal ausgenommen ). Auch wenn Google in diesem Bereich immer noch den größten Freiraum gewährt ( offiziell 20% für eigene Projekte ) so gibt es auch bei Freitag Nachmittagen entsprechend interessantes das sich letztentlich auch für die Agentur lohnt.

Der letzte Vortrag gehörte Jared Tarbell. Der Designer und Entwickler ist u.a. Co-Founder von etsy.com. und derzeit begeistert von algorithmisch generierter Kunst. Beispiele hier: http://www.complexification.net/.

Fazit: Flash on the Beach 2011 – Ich komme !

Flex UG HH is everywhere

In each case you have to use the ExternalInterface. You call it from the flash application with parameters for the new height and width value of the flash container. On the other side you have to define an javascript function which do the resize operation with these values.

Here is an AS3 class which already includes the JavaScript part. Soyou don’t have to define an extra JS function. So you just have to import the AS3 class into your project and your ready to resize you application from Flash.

There are three methods to call:

• resize:This method takes two parameters height and width to completly set the absolute height and width of the flash application.
• addHeight: Takes one integer parameter. The value will be added to the current height. So “50″ for 50px more height or “-20″ for 20px less in height.
• addWidth: Takes one integer parameter. The value will be added to the current width. So “50″ for 50px more width or “-20″ for 20px less in width.

/**
 * resizes the flash container to needed dimensions
 * @param height - new needed height
 * @param width - new needed with
 */
public function resize( height:int, width:int ):void

/**
 * adds a specific value (+/-) to current height
 * @param valueHeight
 */
public function addHeight( valueHeight:int ):void

/**
 * adds a specific value (+/-) to current width
 * @param valueHeight
 */
public function addWidth( valueWidth:int ):void

To resize your application you could add an resize event handler to check specific containers for resize and do the resizing via this class in the event handler method. If you have fixed sizes per state you could of course also do it the static way.

/**
 * @author: Sebastian Martens; sebastian@sebastian-martens.de
 * @copyright: Creative Commons. Free to use "as is"
 *
 * Test Application
 */
package{
 
	import com.nonstatics.swfSelfResize.swfSelfResize;
 
	import flash.display.Sprite;
 
	[SWF(frameRate="31", width="500", height="100", backgroundColor="0x008866")]
	public class swfSelfResizeTest extends Sprite{
 
		private var resize:swfSelfResize;
 
		/**
		 * constructor
		 */
		public function swfSelfResizeTest(){
			super();
 
			this.resize = new swfSelfResize();
 
			// resize to 500px height, 400px width
			this.resize.resize( 500, 400 );
 
			// add 50px height -> 550px height
			this.resize.addHeight( 50 );
 
			// remove 10px width -> 390px
			this.resize.addWidth( -10 );
		}
 
	}
}

Download com.nonstatics.swfSelfResize.as (12kB)
Download bin-debug (20kB)
Full Flash Builder Project (131kB)

Be aware of the security model of the flash player! This won’t work on local filesystem (file://xyz). So please use it on your server (http://www.yourdomain.com) or with your locally installed testserver (http://localhost/whatever).

Hope this helps you.

cheers,
Sebastian

For this i wrote the swfJSPreLoader. This preloader accepts an array of assets (jpg,gif,png,swf) you would like to preload. Internally it will create an flash-application which does the preloading. You could define several callback handlers. So JavaScript gets to know when all assets are loaded or each single asset is loaded including SWF-files.

<script type="text/javascript">
	var swfJSPreLoaderConfig = {
		'_swfPath':'./', // configure path to preloader SWF file
 
		'assets':[	'assets/teaser.swf',
				 	'assets/img2.jpg',
				 	'--error--'],
 
		'assetLoaded': function( asset, bytes, status ){
			alert( asset + ' loaded (' + bytes + ')' );
		},
 
		'loadComplete': function(){
			alert('all assets loaded. totally loaded bytes: ' + swfJSPreLoader.loadedBytes() );
		},
 
		'loadError': function(){
			alert('load error');
		},
 
		'callback': function(){
			swfJSPreLoader.addAsset('assets/teaser2.swf',function( status ){
															alert('teaser2 loaded status:' + status );
														});
		}
	}
</script>
 
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="swfJSPreLoader.js"></script>

To use the swfJSPreLoader you have to include three js files for swfObjects, JQuery and the swfJSPreLoader.js. You also have to define an JS variable swfJSPreLoaderConfig to configure the preloader. The config-variable could hold the following items:

• assets: assets is an array of the assets which should be loaded. The asset-paths must be relative the html page. If you insert wrong asset pathes you could define an error handler. The assets array is optional. You could also add assets via method call.
• assetLoaded: assetLoaded defines the callback method for each loaded asset. So this method will be called each time an asset is loaded completly. There are three parameters. asset – gives the asset-path; bytes – gives the number of loaded bytes of the current asset; status – gives the loading status ( 200: Ok, 404: Loading error )
• loadComplete:The loadComplete callback method will be called after the queue of assets to load is empty. Not all assets need be loaded successfully. If not the error-callback will be fired.
• loadError:The loadError callback will be triggered if the current asset could not be loaded correctly.
• callback:With callback you could register a method which is called after the initialization of the swfJSPreLoader. After this method is called you could use the public methods of the pre loader.

There are two public methods of the swfJSPreLoader. Both methods are ready after the callback method is called and the initialisation is ready ( the loader flash is instanziated ).

swfJSPreLoader.addAsset: The addAsset method allows you to add a single asset to add to the loading queue. It takes to parameters. The first is the path to the asset, the second is the callback handler, which will be fired after this specific asset was loaded. The callback will also be called if the loading fails. The callback gets one argument status with the loading status ( 200: Ok, 404: Loading error ).

/**
 * @public
 *
 * adds asset to loading queue
 * @param {String} assetPath - path to assets to load
 * @param {Function} callback - optional callback handler when loading is complete
 */
addAsset:function( assetPath, callback )

swfJSPreLoader.addAsset('assets/teaser2.swf',
						function( status ){
							alert('teaser2 loaded status:' + status );
						});

swfJSPreLoader.loadedBytes: The loadedBytes method returns the number of total loaded bytes currently loaded bytes on each call.

Update 2011-08-07:swfJSPreLoader Flash Builder Project Sourcefiles (ZIP, 62kb)

Update 2010-05-17:swfJSPreLoader-Test (ZIP, 532kb)

Examples (added 2010-11-07, updated 2011-08-07)

After this seems to be difficult here are some more working examples. All tested at FF4.0b6/OSX; Safari5/OSX; Chrome7.0/OSX; FF3.6/WinXP; IE8/WinXP. Please not that this should be tested from an Server environment and not from local filesystem and requires an installed Flash Plugin.

Added an example for loading from other servers via crossdomain policy file and showing percent loading status.

download examples

I hope this is helpfull for anybody.

cheers,
Sebastian

The Wiimote uses several sensors to detect different motion values. It allows you to read the acceleration value for X-,Y-, Z-axis and Roll, Pitch and Yaw, which is the rotation around the x-,y- and z-axis. So you have a lot more degrees of freedom than with a simple mouse or keyboard. A funny thing you could implement with this for example is WiiSpray, which also uses the WiiFlash Lib.

The WiiFlash package consists of two parts. The first one is the WiiFlash Server. It’s written in C++ / .NET and handles the communication with the Wiimote. The second part is the WiiFlash ActionScript API, which gives you methods and events to get and handle the Wiimote data.

The Wiimote communicates via Bluetooth with its endpoint. So the WiiFlash Server connects to your PCs or Mac Bluetooth stack and reads the data from the Bluetooth connection. This data are send via Socketconnection to the Flash Player. The WiiFlash AS3 API now converts the Wiimote binary protocoll into useable data. Which means you could directly read the values and also get update and/or change events if anything happens.

Connect the Wiimote
The WiiServer is available for PC or Mac. At first you have to connect your Wiimote with your PC or Mac. That means you have to create a Bluetooth connection between them – pair them via Bluetooth. After this step the WiiFlash Server should be able to find the Bluetooth connection and create the connection to the Flash Player. Find a detailed description how to connect your Wiimote with your PC here.

After you could pair your PC/Mac with the Wiimote, disconnect the Wiimote and start the WiiFlash Server. When the server started connect your Wiimote again ( this is done by pressing the Buttons “1″ + “2″ of your Wiimote at the same time ). After a short time you should see the connected Wiimote at the WiiFlash Server. It shows you the Batterylevel and the Wiimote-ID. Both Server versions could connect up to four Wiimotes at the same time.

I did not test the WiiFlash under Windows Vista. But wit OSX 10.5.x you’ll get an Java error when you start the server:

Cannot launch Java application.  Uncaught exception in main method:
java.lang.IllegalStateException: Bluetooth failed to initialize.
There is probably a problem with your local Bluetooth stack or API.

You just have to declare the WiiFlash Server as 32bit application. Just open the file properties ( Apple + i ) and check the 32bit-mode checkbox. This will fix the problem. ( Otherwise the application is launched as 64bit application ).

Unfortunately both server versions aren’t that stabel. From time to time the server crashes or the connection between server and Flash Player doesn’t seem to work any more. You just have to close the server, disconnect the Wiimote from your PC or Mac and restart the connection. This also helps if the rumble function or the LED setter method seem to quit their work.

Connect the Wiimote with your Flex App
The WiiFlash AS3 API gives you a very clear set of methods, which gives you fully access to the Wiimote data. At first you have to create an instance of the Wiimote class. Now you could create the connection to the Wiimote and access the data.

import org.wiiflash.Wiimote;
 
private var wiimote:Wiimote;
 
public function init():void{
	wiimote = new Wiimote();
 
	/* use Event.Connect NOT WiimoteEvent.CONTROLLER_CONNECT */
	wiimote.addEventListener( Event.CONNECT, connectHandler );
 
	wiimote.connect();
}
 
private function connectHandler( evt:Event ):void{
	trace( "Wiimote is connected" );
}

Read Wiimote data
The accelerator values could be accessed on to different ways. First you could read the data directly from the Wiimote-instance. This is helpful if you have an timed update interval, which handles the data. For example if you use an the enterFrame event to call a method which handles the Wiimote data:

public function init():void{
	wiimote = new Wiimote();
 
	/* get Wiimote data onEnterFrame */
	this.addEventListener( Event.ENTER_FRAME, enterFrameHandler );
 
	wiimote.connect();
}
 
private function enterFrameHandler( evt:Event ):void{
	trace( wiimote.sensorX );
        trace( wiimote.roll );
}

The common way is to use the Wiimote Update event. This event is fired on each update update call from the Bluetooth stack. ATTENTION: The communication works with about 100Hz. This means you will get about 100 datasets per second. This is important for how you will later work with your data, and have to be aware of performance issues if you might bad datastructures or uneffective datahandling methods.

Write Wiimote data
You could not only read values from the Wiimote. You could also write two values of the Wiimote. This are the led and the rumble attribute. With the led attribute you should be able to specify which led-light on the Wiimote shines. This is not really working well, but works sometimes …
You could also use the Force-Feedback of the Wiimote. Just set the rumble value to true and the Wiimote start vibrating. If its used this way, its vibrating all time. You could also set the rumbleTimeout value. The parameter is the time in milliseconds the Wiimote starts to rumble.

/* set LEDs */
wiimote.leds = Wiimote.LED4;
 
/* set Force Feedback - for positiv direction */
// wiimote.rumble = ( wiimote.sensorX>3 || wiimote.sensorY>3 || wiimote.sensorZ>3 );
if( wiimote.sensorX>3 || wiimote.sensorY>3 || wiimote.sensorZ>3 ){
	wiimote.rumbleTimeout = 1000;
}

Interprete the Wiimote data
The Wiimote controller returns the acceleration concerning to the gravity value g. 1g means a gravity acceleration of 9.82m/s². The controller itself is able to detect values between -3.6g and +3.6g.

If the Wiimote will not be moved and rests still on the table, you will always have on value (sensorX,sensorY,sensorZ) which is -1 or +1. This is the gravity affecting on the Wiimote. This is the criteria to detect if you Wiimote is in motion or not. Therefore you could use the Euclid Normal Form. If you take the root of the sum of all squares, this will be near +1. Normally you will define a constant values which is a bit higher than exact +1 to ignore very little movements of the Wiimote.

/* const to detect motion */
private const THRESHOLD:Number = 1.01;
 
private function wiimoteUpdateHandler( evt:WiimoteEvent ):void{
 
	_x = evt.target.sensorX;
	_y = evt.target.sensorY;
	_z = evt.target.sensorZ;
 
	var euLength:Number;
 
	/* check for "NO MOTION" */
	euLength = Math.sqrt( _x*_x + _y*_y + _z*_z );
 
	/** set Force Feedback - for positiv direction **/
	wiimote.rumble = ( _x>3 || _y>3 || _z>3 );
 
	if(euLength>THRESHOLD){
		/* do something */
	}
}

Optimize Wiimote date
Normally you won’t directly use the rough data from the Wiimote. Because the detection is relative precise you will get a lot of little peaks and a very unsmooth curve of data. If you want to detect a specific gesture or just want to transform the Wiimote motion into a motion of objects in the Flash you should parse the data. For smoothing the input data you should use a lowpass filter. It will smooth the curve by multiply the actual value with older values. In the following example a new value will only enter 10%. 90% of the value is taken from the old value.

/* const for filtering values */
private const FILTER_FACTOR:Number = 0.1;
 
/* high pass filter */
private function highPassFilter( oldValue:Number, value:Number ):Number{
	return value - lowPassFilter( oldValue, value );
}
 
/* low pass filter */
private function lowPassFilter( oldValue:Number, value:Number ):Number{
	return  value * FILTER_FACTOR + oldValue * (1.0 - FILTER_FACTOR );
}
 
private function wiimoteUpdateHandler( evt:WiimoteEvent ):void{
	_x = this.lowPassFilter( _x, evt.target.sensorX );
	_y = this.lowPassFilter( _y, evt.target.sensorY );
	_z = this.lowPassFilter( _z, evt.target.sensorZ );
 
	/* do something with the data */
}

Gesture detection
If you know have smooth data, which you only will process if the Wiimote is really in motion, you could start to detect gestures. One of the very simple gestures is a shift. If you just shake the Wiimote a little step right it should detect a rightshift and maybe open the next Powerpoint slide. If you shift to left left the application should go on step back.

For this examples you have to watch the x sensor values of the Wiimote. Because you got the accelation of the controller you will not just get on positive peak in x-direction, but you will get a positive peak in x-direction followed by a negative peak in the x-direction. This is because you start a motion in positive x-direction but than stop to motion, which is a negative accelaration. An right shift is a positive x peak followed by a negative x peak. Vice versa a left shift is a negative x peak followed by a positive x peak.

So the first thing to implement is a peak detection class. I do this by writing several values to a history array ( for example of the last 40 values ). I now compare the avarage of the last 2 or 3 values to the avarage of all history values. If the difference between the two avarage values exceed a specific value ( depending on how exact my motion detection should work ) a peak is detected.

/**
 * @classdescription: peak detection. detects a peak in an array of values
 * @author: Sebastian Martens - http://blog.sebastian-martens.de/
 * @SVN: $Id$
 *
 */
public class PeakDetect{
	private var _history:Vector.<number>;
	private var _historyLength:int;
	private var _kernelLength:int;
	private var _peakFactor:Number;
	private var _lastPeak:Boolean;
 
	/**
	 * @constructor
	 * @param kernelLength Number of values which represent the actual motion
	 * @param historyLength Number of values which are taken as history of motion
	 * @param peakFactor If distance between history and actual motion greater than this value motion is detected
	 *
	 */
	public function PeakDetect( kernelLength:int=2, historyLength:int=32, peakFactor:Number=0.2 ){
		var i:int;
 
		_history = new Vector.<number>();
		_kernelLength = kernelLength;
		_historyLength = historyLength;
		_peakFactor = peakFactor;
 
		_lastPeak = false;
 
		// init with 0
		for(i=0;i<_historyLength;i++){
			_history[i] = 0;
		}
	}
 
	/**
	 * calculates the intersection value of items in the array
	 * @param startIndex to get avarage value from the history list
	 * @param length number of values which should calculate to avarage value
	 * @return avarage value
	 */
	private function _getIntersection( startIndex:int, length:int ):Number{
		var i:int;
		var mValue:Number=0;
 
		for(i=startIndex;(i<(startIndex+length)&&i<_historyLength);i++){
			mValue += _history[i];
		}
 
		return (mValue/length);
	}
 
	/**
	 * tries to detect a peak in the list of value
	 * @return true if a peak was detected
	 *
	 */
	private function _checkForPeak():Number{
		var pValue:Number;
		var aValue:Number;
		var peakVal:Number;
		var multiPl:int;
 
		pValue = _getIntersection(0,_historyLength);
		aValue = _getIntersection( _historyLength-_kernelLength, _kernelLength );
 
		if( aValue>0 ){
			peakVal = (aValue-pValue);
			multiPl = 1;
		}else{
			peakVal = (pValue-aValue);
			multiPl = -1;
		}
 
		return ( peakVal>_peakFactor )?(peakVal*multiPl):0;
	}
 
	/**
	 * Adds a new value to item history. Return true if peak is detected.
	 * @param value Number-
	 * @return Boolean -
	 */
	public function addValue( value:Number ):Number{
		_history.shift();
		_history[ (_historyLength-1) ] =  value;
 
		return this._checkForPeak();
	}
}

Finally you could now decide on the order of the different peaks which type of gesture it should be. Therefore i use a timer. If one peak is detected the timer starts. If another peak is detected within the runtime of the timer a gesture is detected if the peak order fits to a gusture.

Please find attached a example FlashBuilder Project which consists serveral steps with examples. Including the WiiFlash framework and my GestureDetection library.

WiiFlashTest – FlashBuilder Project
com.nonstatics.GestureDetection – Gesture Detection Library for WiiFlash v0.1

cheers,
Sebastian

  <param name="wmode" value="transparent" />
  <embed wmode="transparent" ...

With the transparent mode you can influence the relation between the Flash movie an the surrounding HTML. If the set the wmode to window the Flash movie will always lay on top of the rest of the page. This is absolutly helpfull if your application is “standalone”, means the only center of user interaction or if you have an full window application ( at least with full screen ).
But often you have other HTML elements around the Flash movie which are at the same level of user interaction and might be as important as the Flash movie ( Best example might by fly-out menus which has to overlay all other content. Or maybe confirm messages which are not realized by the JavaScript confirm-dialog ). If you use wmode window html elements will always behind the Flash movie (setting the html z-index has no effect ), so there is no real interaction between HTML/JavaScript an the Flash movie. For this you need wmode equals transparent.

wmode transparent allows an equal mixture between Flash and HTML/ JavaScript. Just as the parameters sounds, the Flash movie will also have an transparent background and let the behind HTML shine through. Attention: The transaparent background is expensive in performance. Use it carefully.
The third mode after window and transparent is opaque. The opaque also allows the mix of Flash and HTML/ JavaScript, but has now transparent background.

Since the introduction of these two modes (transparent, opaque) there is a bug with Mozilla based Browsers and textfields on Window plattforms. If you try to enter special character – famoused example is the @ – in text fields it wont work. This is very uncomfortable if you want to have a user login where you use e-mail adresses as username ( @see Adobe Bug Base ).

swfInput

My solution to solve this issue is called swfInputs. It uses the ExternalInterface class of the Flash player. swfInputs is a an AS3 which extends the Flex TextInput class. It communicates with an JavaScript class. This will create normal HTML Inputfields and places it exactly above the original Flash Inputfield.
On entering text in the overlay-HTML-Inputfield the text will be transfered via ExternalInterface into the Flash movie and the corresponding Flash Inputfield. For the Flash application this mechanism is transparent because the access to the field and change events on the input field will still work.

The JavaScript class will only generate the overlay input field if its necessary, means on the Mozilla-Windows-Combination. Other browsers will use the normal Flash movie inputs.

The styles (height, width, border, colors ) which you set on the Flash Input will be transfered to the HTML-Input and set via CSS styles. For further styling like background images you could of course also use standard CSS.

swfInputs also support multiple Flash movies within on HTML page and have an “point-to-point” connection between the overlaying HTML-Input and the Flash-Input. So there is no general keylogger on the complete HTML page, which might cause problems with your JavaScript functions. This also means that you could have different Flash movies on one page ( which might also communicate to each other via LocalConnection ) where each movie could have its own TextInputs.

What to do in your code?

swfInputs consists of two parts:

• The SWFTextInput AS3 Class (which create the connection to the JavaScript class)
• and the swfInputs JavaScript Class (which handles the creation and HTML communication)

To activate the JavaScript part you just need to insert two script-tags into the HTML code and call the constructor method. At the moment swfInputs uses the dojoToolkit JavaScript library for position calculation and basic connection handling. I looking forward to remove this need of dojo to reduce the filesize.

<script src="../javascript/dojo.js" language="javascript"></script>
<script src="../javascript/swfInputs.js" language="javascript"></script>
<script language="JavaScript" type="text/javascript">
			swfInputs.init('swfInputTestcase');
</script>

The String-value int the constructor call is the channel-name. This is optional if you just use on single instance within the HTML-page.

Within you Flash/ Flex application you have to use the SWFTextInput class for textfields instead of TextInput. The SWFTextInput class uses the JSCallStack to optimize the JavaScript communiaction ( which could be a lot on fast typing, so its recommanded to use it ).

A basic Flash/ Flex app could look like this. You see there is nothing very special instead of the swfInputs:SWFTextInput class.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	layout="absolute" height="400" width="600" backgroundAlpha="0.5" backgroundColor="#674523"
	initialize="init()" xmlns:swfInputs="com.nonstatics.swfInputs.*">
 
	<mx:Script>
		<![CDATA[
			import mx.controls.Alert;
 
			//
			private function clickHandler():void{
				Alert.show("swfInput01: "+swfInput01.text+"\n"+
						   "swfInput02: "+swfInput02.text+"\n"+
						   "swfInput03: "+swfInput03.text)
			}
		]]>
	</mx:Script>
 
	<mx:VBox x="10" y="10">
 
		<mx:TextInput width="160" borderColor="#674523" text="{ swfInput01.text + swfInput02.text }" />
 
		<swfInputs:SWFTextInput id="swfInput01" borderColor="#ff0000" fontFamily="Verdana" />
		<swfInputs:SWFTextInput id="swfInput02" borderColor="#00ffff" fontFamily="Arial" />
		<swfInputs:SWFTextInput id="swfInput03" borderColor="#0000ff" fontFamily="Times" />
 
		<mx:Button label="Senden" click="clickHandler()" />
 
	</mx:VBox>
</mx:Application>

Download Files (swfInputs 1.0)

SWFTextInput.as
swfInputs.js
SWFInputs Eclipse Testproject (ZIP)

Please feal free to leave some comments and let me know if its helpful or what should be done for future releases.

cheers,
Sebastian

With data structures i don’t mean an normal or byte array which might be the data structures an the flash  world, because you use it without waisting any thought of it ( me included ). in the very most situations were you used the Flash plattform right now this might be ok, because often you don’t have the mass of data. So the performance of the Flash Player is well enough.

But the possiblities of the Flash Plattform are growing ( very fast in the last time :) ) and more and more applications ( also real applications ) are written for the web ( or for both worlds if you use AIR ).

So you might now run in the situation to build an realy big application which has to handle a lot of data and you have to think about performance. One big thing in performance is the datastructure itself. Each application is different. Is it important for your app to write data fast or read it fast; which happens mor often; do you process all data always complete or do you just need a small part of it ?! For each use case there is for sure a very well data structure.

Data Structure

Example A: Joa Ebert had a talk on Flash Forum Conference 09 (which also inspired me for the second part – see below – and made me happy to see that datstructures are already present in the flash world ) where he presented his data structure for the audio tool. When they output the audio stream they always have to process a (large) list of single audio-items ( one for each bit of the stereo 44.100kHz Audiostream ). -> Fast access of elements (always complete and in the same order ) one by one. Best datastructure: Linked List.

What is a linked list ? A linked list is an list of very light weight elements where each element holds a reference to it next neightbour. In your app you only have one reference to the first node of this list and that loop over the list by setting the reference further (example for calculating the length of the list):

/**
 * Returns the cardinality of the map - the number of elements
 * @return A value of <code>Int</code>, the number of elemets
 */
public function card():int{
	var ref:SimplyLinkedListElement = this._root;
	var card:int = 0;
 
	while( ref ){
		ref = ref.next;
		++card;
	}
 
	return card;
}

You also could insert a new element very fast ( if it is ok to put it on the first position ). You just have to change the reference to the root element to the new element and link the next reference of the new element to the old root element.

Example B: You have an application which often reads from its datastructure, but always only searches on random element. If you would use a linked list, in the worst case you have to look at each element if it is the searched one. Looking at each element is to expensive. One solution are Tree-Datastructures. The simplest is the Binary Tree. Again you have an root reference. But each element now have to references to the next elements. One to the right ( bigger element ) and one to the left ( smaller element ). If you insert an element in the tree you’ll look at the existing node. Is your new node larger, you will look at the right reference, is it smaller at the left reference of the node. Is the reference empty you could place it there.

If not you will look at the data again. In the worst case you now don’t need to look at each element because you have a structure and will find the fastest way by compare the keys. The search is logarithmic not linear.

Garbadge Collector / Pooling

The next big thing with datastructure and performance in the Flash Player is the Garbadge Collector ( which it don’t were that aware before Joas talk ). So the Garbadge Collector is realy slow. So we have to avoid that he is coming to action. How ? By reusing your elements or pool them.

The Garbadge Collector will free space in the memory if there are no more references to an allocted section. So you have to control the references. In your mass of objects you should not drop unused items, because the are not used for now, but pool them. You remove the reference from the main datastructure to the unused element and reference it within a list of unsed elements. When you now need a new element you don’t have to create a new one ( which is also realy expensive ) but you could take one element from you pool.

Find attached some of my older datastructures (LinkedList, DoubleLinkedList, BinarySearchTree) which i just updated so they will now use pooling for unused elements ( and of course there are also some simple FlexUnit Testcases included ! :) – Florian Salihovic).

Download AS3DataStructure.zip

Binary Search Tree

Here is one longer example of an Binary Search Tree implementation. It’s not fully done yet, but most common methods are implemented and ready to use. I’m sure the is some optimaziation potential (please let me know if you find anything, then i will correct it).
Because there are no real Generics in ActionScript this is an Example for a Map which uses an String value as Key and an Number value as data. This has of course to be adopted for your case:

package com.nonstatics.as3collection.map.MapAsBinarySearchTree
{
 
	/**
	 * Implements a map as binary search tree
	 *
	 * @author Sebastian Martens http://www.sebastian-martens.de || http://blog.sebastian-martens.de
	 * @copyright Creative Commons, free to use "as is"
	 * @date $Id: MapAsBinarySearchTree.as 21 2009-05-18 20:06:59Z dinnerout $
	 */
	public class MapAsBinarySearchTree
	{
		/**
		 * root reference
		 */
		private var _root:MapAsBinarySearchTreeElement;
 
		/**
		 * root reference of pooled elements
		 */
		private var _poolRoot:MapAsBinarySearchTreeElement;
 
		/**
		 * cardinality of map
		 */
		private var _cardV:int = 0;
 
		/**
		 * is vadinality valid
		 */
		private var _validCard:Boolean = false;
 
 
		/**
		 * construction method
		 */
		public function MapAsBinarySearchTree( n:int = 0 ){
			// build pool elements to avoid construction on runtime
			while( n>0 ){
				this.poolPush( new MapAsBinarySearchTreeElement() );
				--n;
			}
 
			this._cardV = 0;
			this._validCard = false;
		}
 
		/**
		 * Test if Map is an empty map
		 * @return A value of code>Boolean</code>, if map is empty
		 */
		public function isEmpty():Boolean{
			return this._root == null;
		}
 
		/**
		 * Returns the cardinality of the map - the number of elements
		 * @return A value of <code>Int</code>, the number of elemets
		 */
		public function card():int{
			if( this.isEmpty() ) return 0;
			if( this._validCard ) return this._cardV;
			this._cardV = this._card( this._root );
			this._validCard = true;
			return this._cardV;
		}
 
		/**
		 * recursiv card() helper method
		 * @private
		 * @param node value of <code>MapAsBinarySearchTreeElement</int> processed node
		 */
		private function _card( node:MapAsBinarySearchTreeElement ):int{
			if( !node ) return 0;
			return 1 + this._card( node.l ) + this._card( node.r );
		}
 
		/**
		 * returns an element by its key
		 * @param key value of <code>String</code>, search key
		 * @return value of <code>MapAsBinarySearchTreeElement</code>
		 */
		public function getElement( key:String ):MapAsBinarySearchTreeElement{
			return this._getElement( this._root, key );
		}
 
		/**
		 * recursive helper method for getElement
		 * @private
		 * @param node value of <code>MapAsBinarySearchTreeElement</code>, processing node
		 * @param key value of <code>String</code>, search key
		 */
		private function _getElement( node:MapAsBinarySearchTreeElement, key:String ):MapAsBinarySearchTreeElement{
			var l:MapAsBinarySearchTreeElement;
			var r:MapAsBinarySearchTreeElement;
 
			if( !node ) return null;
			if( node.key == key ) return node;
			return ( key > node.key )?this._getElement( node.r, key ):this._getElement( node.l, key );
		}
 
		/**
		 * checkes if an value v is in the map
		 * @param v a value of <code>Number</code>,element value to search for
		 * @return true if value is containing in one element
		 */
		public function containsValue( v:Number ):Boolean{
			return this._containsValue( this._root, v );
		}
 
		/**
		 * recursive helper method for containsValue
		 * @private
		 * @param node value of <code>MapAsBinarySearchTreeElement</int> processed node
		 * @param v value of <code>Number</code>, search value
		 * @return value of <code>Boolean</code>, value found in tree
		 */
		private function _containsValue( node:MapAsBinarySearchTreeElement, v:Number ):Boolean{
			if( !node ) return false;
			if( node.value == v ) return true;
			return ( v > node.value )?this._containsValue( node.r, v ):this._containsValue( node.l, v );
		}
 
		/**
		 * Test if this map equals to another map ( equals means same elements not same structure )
		 * @param map value of <code>MapAsBinarySearchTree</code> to test this map with
		 * @return a value of <code>Boolean</code>
		 */
		public function isEqualTo( map:MapAsBinarySearchTree ):Boolean{
			if( this == map ) return true;
			if( this.isEmpty() && map.isEmpty() ) return true;
			if( (this.isEmpty() && !map.isEmpty()) || (!this.isEmpty() && map.isEmpty()) ) return false;
			if( this.card() != map.card() ) return false;
 
			return this._isEqualTo( map, this._root );
		}
 
		/**
		 * recursive helper method for isEqualTo
		 * @param map value of <code>MapAsBinarySearchTree</code>, map to compare with
		 * @param node value of <code>MapAsBinarySearchTreeElement</node>, processing node of this map
		 * @return false if element not in reference tree
		 */
		private function _isEqualTo( map:MapAsBinarySearchTree, node:MapAsBinarySearchTreeElement ):Boolean{
			if( !node ) return true;
			var item:MapAsBinarySearchTreeElement = map.getElement( node.key );
			if( !item || item.value!=node.value ) return false;
			return this._isEqualTo( map, node.l ) && this._isEqualTo( map, node.r );
		}
 
		/**
		 * inserts a new value into the map
		 * @param k value of <code>String</code>, key
		 * @param v value of <code>Number</code>, value
		 * @return this
		 */
		public function insert( k:String, v:Number ):MapAsBinarySearchTree{
			// invalidate cardinality
			this._validCard = false;
 
			// empty map
			if( !this._root ){
				var item:MapAsBinarySearchTreeElement = this.poolPop();
				item.value = v;
				item.key = k;
				item.l = null;
				item.r = null;
 
				this._root = item;
				return this;
			}
 
			// non empty map
			this._insert( this._root, k, v );
			return this;
		}
 
		/**
		 * recursive helper method for insert method
		 * @param node value of <code>MapAsBinarySearchTreeElement</code>, processed node
		 * @param k value of <code>String</code>, key
		 * @param v value of <code>Number</code>, value
		 */
		private function _insert( node:MapAsBinarySearchTreeElement, k:String, v:Number ):void{
			// existing keys will be updated
			if( node.key == k ){
				node.value = v;
				return;
			}
			var item:MapAsBinarySearchTreeElement;
 
			// insert left or right
			if( k > node.key ){
				// right node exist
				if( node.r ){
					this._insert( node.r, k, v );
 
				// new node at right leave
				}else{
					item = this.poolPop();
					item.key = k;
					item.value = v;
					item.l = null;
					item.r = null;
 
					node.r = item;
				}
			}else{
				// left node exists
				if( node.l ){
					this._insert( node.l, k, v );
 
				// new node at left leave
				}else{
					item = this.poolPop();
					item.key = k;
					item.value = v;
					item.l = null;
					item.r = null;
 
					node.l = item;
				}
			}
		}
 
		/**
		 * returns if the map contains an element with k
		 * @param k value of <code>String</code>, key to search for
		 * @return true if mao contains key
		 */
		public function contains( k:String ):Boolean{
			return this._contains( k, this._root );
		}
 
		/**
		 * recursive helper method for contains
		 * @param k value of <code>String</code>, key to search for
		 * @param node value of <code>MapAsBinarySearchTreeElement</code>, start node
		 * @return
		 */
		private function _contains( k:String, node:MapAsBinarySearchTreeElement ):Boolean{
			if( !node ) return false;
			if( node.key==k ) return true;
			if( k > node.key ) return this._contains( k, node.r );
			if( k < node.key ) return this._contains( k, node.l );
			return false;
		}
 
		// Traverse the tree complete
		private function _containsF( k:String, node:MapAsBinarySearchTreeElement ):Boolean{
			if( !node ) return false;
			return (node.key==k) || this._containsF(k,node.l) || this._containsF(k,node.r);
		}
 
		/**
		 * returns the rightes leave of an part tree
		 * @private
		 * @param node value of <code>MapAsBinarySearchTreeElement</code>, start node
		 * @return latest right leave from node
		 */
		private function _getRight( node:MapAsBinarySearchTreeElement ):MapAsBinarySearchTreeElement{
			// already latest right node
			if( !node.r ) return node;
 
			// find right
			while( node.r ){
				node = node.r;
			}
 
			return node;
		}
 
		/**
		 * returns the most left leave of an part tree
		 * @private
		 * @param node value of <code>MapAsBinarySearchTreeElement</code>, start node
		 * @return latest left leave from node
		 */
		private function _getLeft( node:MapAsBinarySearchTreeElement ):MapAsBinarySearchTreeElement{
			// already latest right node
			if( !node.l ) return node;
 
			// find right
			while( node.l ){
				node = node.l;
			}
 
			return node;
		}
 
		/**
		 * finds the parent node of the element with key k
		 * @private
		 * @param k value of <code>String</code>
		 * @param nod value of <code>MapAsBinarySearchTreeElement</code>, processed element
		 * @return parent node of node with key k, null if not found
		 */
		private function _findKeyParent( k:String, node:MapAsBinarySearchTreeElement ):MapAsBinarySearchTreeElement{
			//  root node to remove
			if( node.key == k ) return node;
 
			if( !node ) return null;
			if( (node.l && node.l.key == k) || (node.r && node.r.key == k) ) return node;
 
			return (k > node.key)?this._findKeyParent( k, node.r ):this._findKeyParent( k, node.l );
		}
 
		/**
		 * removes an element by its key
		 * @param k value of <code>String</code>, key of element to remove
		 */
		public function remove( k:String ):MapAsBinarySearchTree{
			// empty list
			if( this.isEmpty() ) return this;
 
			// search for parent node of key element
			var searchN:MapAsBinarySearchTreeElement = this._findKeyParent( k, this._root );
			var ref:MapAsBinarySearchTreeElement;
			var ref2:MapAsBinarySearchTreeElement;
 
			// parent of key found, remove element
			if( searchN ){
				// invalidate cardinality
				this._validCard = false;
 
				// remove root node
				if( searchN == this._root && this._root.key == k ){
					ref = this._root;
 
					if( !this._root.l && !this._root.r ){
						this._root = null; // only root element
						this.poolPush( ref );
						return this;
					}
 
					if( this._root.r && !this._root.l ){
						this._root = this._root.r; // empty left tree
						this.poolPush( ref );
						return this;
					}
 
					if( !this._root.r && this._root.l ){
						this._root = this._root.l; // empty right tree
						this.poolPush( ref );
						return this;
					}
 
					// both trees are filled
					ref2 = this._root.r;
					this._root = this._root.l;
 
					this._getRight( this._root ).r = ref2;
 
					this.poolPush( ref );
					return this;
 
				// remove node from tree middle
				}else{
					// found in left tree
					if( searchN.l && searchN.l.key == k ){
						ref = searchN.l;
 
						searchN.l = searchN.l.l;
						if( searchN.l ){
							this._getRight( searchN.l ).r = ref.r;
						}else searchN.l = ref.r;
 
						this.poolPush( ref );
						return this;
 
					// found in right tree
					}else{
						ref = searchN.r;
 
						searchN.r = searchN.r.l;
						if( searchN.r ){
							this._getRight( searchN.r ).r = ref.r;
						}else searchN.r = ref.r;
 
						this.poolPush( ref );
						return this;
 
					}
				}
			}else return this;
 
			return this;
		}
 
		/**
		 * @return the ratio of left to right tree card
		 * large number means heavy weight on left side, negavtive numbers means weight on right side
		 */
		public function getTreeBalance():Number{
			if( this.isEmpty() ) return 0;
 
			var l:Number = this._card( this._root.l );
			var r:Number = this._card( this._root.r );
 
			if( l > r ) return l / Math.max( r, 0.01 );
			if( r > l ) return -1* ( r / Math.max( l, 0.01 ) );
 
			return 0;
		}
 
		/**
		 * creates an string representation of the map
		 * @return String value of map
		 */
		public function toString():String{
			return this._toString( this._root );
		}
 
		/**
		 * recursice helper method for toString
		 * @param node value of <code>MapAsBinarySearchTreeElement</code>, processed node
		 * @return string reprsentation
		 */
		private function _toString( node:MapAsBinarySearchTreeElement ):String{
			if( !node ) return "";
			return this._toString( node.l ) + ' {k:' + node.key + ' v:'+ node.value +'} ' + this._toString( node.r );
		}
 
		/**
		 * Returns the cardinality of the pool - the number of elements
		 * @return A value of <code>Int</code>, the number of elemets
		 */
		public function getPoolSize():int{
			var ref:MapAsBinarySearchTreeElement = this._poolRoot;
			var card:int = 0;
 
			while( ref ){
				ref = ref.r;
				++card;
			}
			return card;
		}
 
		/**
		 * removes all unused elements from pool
		 */
		public function emptyPool():void{
			this._poolRoot = null;
		}
 
		/**
		 * pushed an element to the local pool
		 * @private
		 * @param n a value of <code>MapAsBinarySearchTreeElement</code> Item to push into pool
		 */
		private function poolPush( n:MapAsBinarySearchTreeElement ):void{
			// empty pool
			if( this._poolRoot == null ){
				this._poolRoot = n;
				this._poolRoot.r = null;
				this._poolRoot.l = null;
 
			// non empty pool, keep reference
			}else{
				n.r = this._poolRoot;
				this._poolRoot = n;
				this._poolRoot.l = null;
			}
		}
 
		/**
		 * gets an objects from pool. if pool is empty element will be created
		 * @private
		 * @return a value of <code>MapAsBinarySearchTreeElement</code> - single list item
		 */
		private function poolPop():MapAsBinarySearchTreeElement{
			// non empty pool, take first from pool
			if( this._poolRoot ){
				var res:MapAsBinarySearchTreeElement = this._poolRoot;
 
				this._poolRoot = this._poolRoot.r;
				res.r = null; // empty reference to pool nodes
				res.l = null;
 
				return res;
			}
 
			// empty pool, create new element
			return new MapAsBinarySearchTreeElement();
		}
 
	}
}

Download AS3DataStructure.zip

… to be continued.

cheers,
Sebastian