You can find the latest source and .app here.

Click here to have a look at the result (use your mouse, or, if running the newest WiiFlashServer, your Wiimote as input device). You can also download Wiimote Demo Ribbons.zip containing the source files to use it with the Wiimote and the WiiFlashserver.


Wiimote Demo Functions.zip (demonstrating LED, Rumble and mouse control)

Wiimote Demo IR.zip (very simple way of using IR blob/dots/point data)

Wiimote Demo IR Traces.zip (using bitmaps, filters and matrix functions to generate a nice effect when handling IR blob/dots/point data)

Wiimote Demo 3D Object.zip (using pitch, roll and yaw data to rotate and move a 3D object in Papervision 3D)

Wiimote Demo Head Tracking.zip (using two IR dots to do simple x, y an z positioning in Papervision 3D)

Wiimote Demo 3D Object Nunchuck.zip (using the Nunchuck to rotate and scale a 3D object in Papervision 3D)

More examples are on their way so check back soon!

Click here to have a look at the result. Enjoy!

The interesting part of the code:

private function loop(e:Event):void
{
	//bitmap containing difference between last & this frame
 	newBmd.draw(input);
 	newBmd.applyFilter(newBmd,bounds,topLeft,filter);
 	newBmd.draw(oldBmd,null,null,BlendMode.DIFFERENCE);
 	newBmd.threshold(newBmd,bounds,topLeft,">",0xFFAAAAAA,0xFFFFFFFF);	//remember bitmap for next time round
 	oldBmd.draw(input);
 	oldBmd.applyFilter(oldBmd,bounds,topLeft,filter);
 	//now get bounds of a given color...
 	var newBound:Rectangle = newBmd.getColorBoundsRect(m,c,true);
	//now use the newBound to move something...
}

Hope this is of any use to someone…

Lebensrettende Sofortmaßnahmen: Auf dem Handy jederzeit verfügbar

Medizinische Notfälle können jederzeit und überall passieren. Die wenigsten Menschen sind darauf vorbereitet einzugreifen: Zwar haben dem Deutschen Roten Kreuz zufolge rund 80 Prozent aller Deutschen einen Ersthelferkurs besucht - doch im Schnitt ist das 15 Jahre her. Eine noch unveröffentlichte Studie des Notfallmediziners Jan Breckwoldt von der Berliner Charité zeigt: Immerhin erkennen 66 Prozent der Ersthelfer, wenn ein Herz- oder Atemstillstand vorliegt. Aber nur 12,5 Prozent leiten eine sinnvolle Wiederbelebung ein. (1)

Vor diesem Hintergrund haben wir uns entschieden Quick Aid zu realisieren, eine Erste Hilfe Anwendung für Mobiltelefone. Quick Aid muss einmalig auf einem Mobiltelefon installiert werden und begleitet den Besitzer dann überallhin und kann jederzeit benutzt werden.

Die erste Version von Quick Aid wurde für das kommende Google Handy als Wettbewerbsteilnahme an der Android Developer Challenge der Open Handset Alliance entwickelt. Weitere Versionen, die spezielle Funktionen wie GPS und Google Maps (Wo bin ich? Wo bekomme ich Hilfe?) nutzen, sind in Planung. Des Weiteren ist auch die Realisierung einer Flash Lite und iPhone Variante von Quick Aid geplant sowie die Nutzung von Audio, Video und auch Webseiten.

Eine vollständige Dokumentation werden wir in Kürze hier auf Tojio Labs veröffentlichen.

Quick Aid (english)

Basic life support: Always available on mobile phones

Medical emergencies can happen anywhere and any time. Very few people know what to do. According to the German Red Cross 80 per cent of all Germans have attended a First Aid course – but on average the course was 15 years ago. A study carried out by the Berlin Charité Hospital has shown that 66 per cent of First Aiders can recognize cardiac or respiratory arrest but only 12.5 per cent actually initiate (any sensible) resuscitation procedures. (1)

It is against this background that Quick Aid, a basic life support application for mobile phones, came into being. Quick Aid, when installed on an (Android enabled) mobile phone, accompanies the user everywhere and can be accessed at any time.

At the current stage this software is a prototype of the concept. The next step is making use of and integrating Android specific functions such as GPS support, Google maps (Where am I? Where can I find help?) and extending the variety of
media used (using Sound, Video or Webpages for help and instructions). We are also planning a Flash Lite Version and an iPhone Version.

A full documentation will be available soon, here on Tojio Labs.

(1) Quelle: http://www.spiegel.de/wissenschaft/mensch/0,1518,546172,00.html

In the current version all data from a Wiiremote can be sent (button states, battery level, the acceleration axes, 4 IR points and sizes and data from the Nunchuck extension). Data sent from the Classic Controller extension has not been tested yet and can be considered ‘guessplimented’. Its possible to activate the vibrating and LEDs as well as activate the Mouse mode by WiiFlash now. If an error occurs while connecting the Wiimote is disconnected again.

Note
The software should be considered experimental. There is no guarantee the data sent by WiiFlashServerJ is exactly the same as by the Windows version provided by WiiFlash. WiiFlashServerJ was coded on lazy weekends and without insight into the interna of the official (Windows) version.

Download
WiiFlashServerJ (Alpha version, 30 Jun. 2008)
WiiFlashServerJ (Alpha version, 24 Apr. 2008)
WiiFlashServerJ (Alpha version, 14 Apr. 2008)

Examples
You can find some simple examples making use of the WiiFlash library in combination with e.g. Papervision here.

Known Issues
- Sometimes Wiiremote is not properly connected and in that case does not send data (properly)

- Sometimes its not possible to activate the LEDs, or rumble function

- If Nunchuck extension is plugged in, the IR point size does not change.

- Point size, battery level and perhaps some other data (extensions?) are sent, but values could differ from what the windows server sends. (Feedback would be great…)

- Battery level is just read once, when connecting or extensions are connected / disconnected. Working on that one…

- Button states and IR start playing random. In this case you are probably using an older version of the WiiFlash API.
(Since the first release of WiiFlash 0.4 there have been small, but important changes: In “Wiimote.as” -> “function update” -> pack.position = 36 has been changed to 37 and in WiiSocket.as you will find a “I80″ in the newer version. So make sure you have the newer version of WiiFlash 0.4. or even better WiiFlash 0.4.1)

- Nunchuck does not send data. This sometimes happens, just restart WiiFlashServerJ

- Classic Controller has not been tested yet

Used libraries and software
Java Wiiremote library: WiiremoteJ
Java Bluetooth library: Bluecove
Flash Wiiremote library WiiFlash

Here are some basic tutorials to get things started with the Wow Engine:
Your First WOW-Engine Application,
how to use boundArea,
how to use sphere and get position and

How to use plane, sphere & constraint.

The useful parts of the sourcode used in the hello World app is down below. Basicly you start by setting up the physics world, then the 3d. The Enterframe loop is used to update the rendering part to show what the objects in the physics world are doing.

Inititalize the physics world and its objects:

private function initPhysics():void
{
    //keep the objects in an array, so we can access them later on
    wowBalls = new Array();
    wowAnchorPoints = new Array();
    wowConstraints = new Array();

    // init wow basics
    wow=new WOWEngine();
    wow.collisionResponseMode = wow.SELECTIVE;
    //add some gravity
    wow.addMasslessForce(new WVector(0,gravity,0));

    var wowBall:WSphere;
    var wowAnchorPoint1:WSphere;
    var wowAnchorPoint2:WSphere;
    var constraint:WSpringConstraint;

    var x:int = 0;
    var y:int = -ballHeight/2;
    var z:int = 0;
    var fixed:Boolean = false;

    //make the physics represenation of the balls
    for(var i:uint=0; i < NUM_OF_BALLS; i++)
    {
        //add the ball
        fixed = false;
        wowBall = new WSphere(1+((i-center)*ballSpacing),y,z,ballRadius,fixed,ballMass,ballElasticity,ballFriction);
        wowBalls.push(wowBall);
        wow.addParticle(wowBall);

        //add the first anchorpoint 'holding' the ball
        fixed = true;
        wowAnchorPoint1 = new WSphere(x+((i-center)*ballSpacing),y+ballHeight,z-150,ballRadius,fixed);
        wowAnchorPoints.push(wowAnchorPoint1);
        wow.addParticle(wowAnchorPoint1);

        //add the second anchorpoint 'holding' the ball
        wowAnchorPoint2 = new WSphere(x+((i-center)*ballSpacing),y+ballHeight,z+150,ballRadius,fixed);
        wowAnchorPoints.push(wowAnchorPoint2);
        wow.addParticle(wowAnchorPoint2);

        //build the 'holding' mechanism by using constraints
        constraint = new WSpringConstraint(wowBall, wowAnchorPoint1,stiffness);
        wowConstraints.push(constraint);
        wow.addConstraint(constraint);

        constraint = new WSpringConstraint(wowBall, wowAnchorPoint2,stiffness);
        wowConstraints.push(constraint);
        wow.addConstraint(constraint);
    }
}

Now create the Papervision 3D world:

private function init3D():void
{
    pv3dBalls = new Array();
    pv3dAnchorPoints = new Array();
    pv3dMirrorBalls = new Array();

    // init papervision basics
    view = new BasicView(stage.stageWidth, stage.stageHeight, true, true);
    view.camera.zoom = 10;
    view.camera.focus = 150;
    addChild(view);

    //use interactive 3dmouse
    vMouse = view.viewport.interactiveSceneManager.virtualMouse;
    mouse3D = view.viewport.interactiveSceneManager.mouse3D;
    Mouse3D.enabled = true;

    //create lines obj representing constraints between anchorpoints and balls
    pv3dLinesArray = new Array();
    pv3dLines = new Lines3D(new LineMaterial(0x666666,1));
    view.scene.addChild(pv3dLines);

    // create materials
    var shadowData = new glasTexture() as Bitmap;
    var mp:BitmapMaterial = new BitmapMaterial(shadowData.bitmapData);

    var ballData = new ballTexture() as Bitmap;
    var ballMirrorMaterial:BitmapMaterial = new  BitmapMaterial(ballData.bitmapData);

    light = new PointLight3D(false,false);
    envMaterial = new EnvMapMaterial(light, ballData.bitmapData,ballData.bitmapData,1);

    //create the glas "table"
    var glasPane:Plane = new Plane(mp,600,400);
    glasPane.rotationX = 270;
    glasPane.y = -120;
    view.scene.addChild(glasPane, "glasPane");

    var dragPlane:Plane = new Plane(new ColorMaterial(0xFF0000, 0), 1000,1000, 6, 6);
    dragPlane.material.interactive = true;
    dragPlane.material.doubleSided = true;
    dragPlane.z = 50;
    view.scene.addChild(dragPlane, "dragPlane");

    var pv3dBall:Sphere;
    var pv3dMirrorBall:Sphere;
    var pv3dAnchorPoint1:Sphere;
    var pv3dAnchorPoint2:Sphere;

    //create the 3d representation of the balls
    for(var i:uint=0; i < NUM_OF_BALLS; i++)
    {
        //add the shiny little ball
        pv3dBall = new Sphere(envMaterial,ballRadius+2,16,16); //(new WireframeMaterial(0xaf8554),ballRadius+5,10,10);
        pv3dBall.material.interactive = true;
        pv3dBall.name = "pv3dBall"+i;
        pv3dBall.scale *=-1;
        view.scene.addChild(pv3dBall, "pv3dBall"+i);
        pv3dBalls.push(pv3dBall);

        //add the mirror ball
        pv3dMirrorBall = new Sphere(ballMirrorMaterial,ballRadius+2,10,10);
        view.scene.addChild(pv3dMirrorBall, "pv3dMirrorBall"+i);
        pv3dMirrorBalls.push(pv3dMirrorBall);

        //add the first anchorpoint 'holding' the ball
        pv3dAnchorPoint1 = new Sphere(new ColorMaterial(0x999999,0.5),1);
        view.scene.addChild(pv3dAnchorPoint1, "pv3dAnchorPoint1"+i);
        pv3dAnchorPoints.push(pv3dAnchorPoint1);

        //add the second anchorpoint 'holding' the ball
        pv3dAnchorPoint2 = new Sphere(new ColorMaterial(0x999999,0.5),1);
        view.scene.addChild(pv3dAnchorPoint2, "pv3dAnchorPoint2"+i);
        pv3dAnchorPoints.push(pv3dAnchorPoint2);

        //add lines from ball to both anchorpoints, coordinates are done later...
        pv3dLinesArray.push(new Line3D(pv3dLines,new LineMaterial(0x999999,0.1),1,
                            new Vertex3D(0,0,0), new Vertex3D(0,0,0) ));
        pv3dLines.addLine(pv3dLinesArray[i*2]);
        pv3dLinesArray.push(new Line3D(pv3dLines,new LineMaterial(0x999999,0.1),1,
                            new Vertex3D(0,0,0), new Vertex3D(0,0,0) ));
        pv3dLines.addLine(pv3dLinesArray[i*2+1]);
    }
}

Now get the Loop going:

private function loop( event : Event ):void
{
    //do the physics stuff
    wow.step();

    //set viewable stuff to physics stuff
    syncRenderingToPhysics();

    light.copyPosition(view.camera);

    //do some camera movement
    Camera3D(view.camera).hover(0, view.viewport.containerSprite.mouseX*0.003,
                                (view.viewport.containerSprite.mouseY-400)*0.002);

    //do the 3d rendering stuff
    view.singleRender();
}

This part will update the graphics part to show what the physics objects are doing:

private function syncRenderingToPhysics():void
{
    if(_dragging)
    {
        wowBalls[_actualDragObjID].px = mouse3D.x;
        wowBalls[_actualDragObjID].py = mouse3D.y;
    }	

    //just reposition the moving parts...
    for(var i:uint=0; i < NUM_OF_BALLS; i++)
    {
        pv3dBalls[i].x = wowBalls[i].px;
        pv3dBalls[i].y = wowBalls[i].py;
        pv3dBalls[i].z = wowBalls[i].pz;
        pv3dMirrorBalls[i].copyPosition(pv3dBalls[i]);
        pv3dMirrorBalls[i].y = (pv3dMirrorBalls[i].y*-1)-250;
		....
    }
}

Hope this is of any use to someone…

• reading data from a relational DB and transforming the data into a suitable (XML) format so that Flex can use this data to establish a DataProvider
• setting up a (editable) DataGrid with the DataProvider and checking user input for consistency

So now we’re ready to send the updated data back to our server: whenever the user changes the row (either by typing ‘enter’or by clicking into another row) the entered data will be checked. If the new Values are OK, the method sendData() will be called in order to construct an Object that will hold our parameters for the POST request by means of the AS3 HttpService Class:

function sendData(id:int, field:String, value:String)
{
	var params:	Object 	= {};
	params.id 			= id;
	params.field 		= field;
	params.value		= value;
	var at:AsyncToken = updaterequest.send(params);
}

The HTTPService updaterequest which is called here is defined in
our .mxml-file:

<mx:HTTPService id="updaterequest"
			result="handleUpdateResponse(event)"
			showBusyCursor="true"
			method="POST"
			url="http://yourserver.com/yourscript.php"
			useProxy="false" />

So far, the entered data has been sent back to our server. After the request is
done, the HttpService will call the
handleUpdateResponse() method in wich we can control the further
program behaviour acording to success or failure. But on the server side again,
we have to check the data before any attempt to write it into the DB: the param
id has to be numerical, the params field and value must be quoted to avoid
possible SQL injections! Let’s have a look at the PHP script that processes the
data and stores them in the mySQL Database:

if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['id']))
{
	// check whether the id is numeric and quote the other fields
	// for security reasons so that there can be no sql injection
	$id 	 = is_numeric($_POST['id']) ? $_POST['id'] : 0;
	$field  = quoteInput($_POST['field']);
	$value = quoteInput($_POST['value']);

	updateUserList( $id, $field, $value );
}

function quoteInput($value)
{
	 // Stripslashes
	 if (get_magic_quotes_gpc())  $value = stripslashes($value);

	 // Quote if not integer
	 if (!is_numeric($value))
	 	$value = "'" . mysql_real_escape_string($value) . "'";

	 return $value;
}

function updateUserList($id, $field, $value)
{
	// open the connection to our DB host and select the DB we need
	// you have to define these constants for your needs..
	$link = mysql_connect(DB_HOST, DB_USER_ADMIN, DB_PASS_ADMIN)
    	or returnError('Could not connect: ' . mysql_error());

	mysql_select_db(DB_NAME) or returnError('Could not select database');

	// prepare the update statement for the user row in question
	$exec 	= "UPDATE `user` SET `$field` ='$value'
				WHERE `id`='$id'";

	// execute the update and close the connection
	$result = mysql_query($exec);
	mysql_free_result($result);
	mysql_close($link);

	// this is the response that the Flex HttpService
	// will get, so that the Flex program can inform
	// the user of an error if necessary
	if ($result) 	print('<response>success</response>');
	else		print('<response>failed</response>');
}

function returnError($err)
{
	// HTTP-header?
	print('<response>failed</response>');
	print("<message>$err</message>");
	exit();
}

So we have the complete cycle of communication between a Flex program and a
relational database via Http-request and Webserver…
enjoy building your applications!

Task #2: getting the data entered into the DataGrid
Our DataGrid has three editable columns: credits, status and active. But we have some restrictions on them: credits must be a positive integer, status a positive integer from 1 to 4 and active can only be a boolean value.
So when and how can we check the data that was entered and reject the input if necessary? The DataGrid is defined with the following argument: itemEditEnd="checkInput(event)". That causes it to call the function checkInput() in our script when the editing of a cell has ended (i.e. the user has typed enter or switched the row or column).

Now let’s have a look at the function that is processing the input:

/**
 * This method is called when a DataGridEvent occurs. In case the user has
 * changed clumn or row, check whether new data was entered and send the new
 * value of the changed field to our PHP dataservice that will update the DB.
 *
 * @param e - the DataGridEvent that has just occured
 */

function checkInput(e:DataGridEvent):void
{
    if (e.reason == DataGridEventReason.NEW_COLUMN
        || e.reason == DataGridEventReason.NEW_ROW)
    {
        var newData:String;
        var selectedRow:Object = e.itemRenderer.data;
        var previous:String = new String(
            userCollection.getItemAt(usergrid.selectedIndex)[e.dataField]);

        for (var i:String in selectedRow)
        {
            if ( i == e.dataField )
            {
                // if the current field is the updated one,
                // get the editor and do some introspection to find out
                // which class we're using (TextInput or CheckBox)

                var editor:Object    = e.currentTarget.itemEditorInstance;
                var classInfo:XML    = describeType(editor);
                var className:String = classInfo.@name.toString();

                if (className == 'mx.controls::TextInput')
                    newData = TextInput(e.currentTarget.itemEditorInstance).text;

                else if (className == 'mx.controls::CheckBox')
                {
                    if(CheckBox(e.currentTarget.itemEditorInstance).selected)
                         newData = "1";
                    else newData = "0";
                }

                // this is the place to do some first consistency checks
                // on submitted fields [...]
                // if the data is not acceptable for any reason, you can
                // invoke the preventDefault()-Method on the Datagrid event
                // and make sure that the data will not be sent

                var dataOK:Boolean = checkData(previous, newData, e);
                // send the data if it's OK and different from previous value
                if ( dataOK && newData != previous )
                    sendData(selectedRow.id, e.dataField, newData);
            }
        }
    }
}

What the function does, in brief, is:

1. having a look at the fields of the selected row until we reach the field that has been edited
2. for the edited field: doing some introspection to find out which class is used as editor for the field
3. type casting the itemEditorInstance to an instance of its actual class
4. retrieving the new data entered by the user and let another function validate the data

Note that you won’t get the new data by the itemEditorInstance.data property! By accessing that, you’ll only get the data that the row previously held. In order to get the new data, you have to do the type cast as described above and retrieve the new value by the editor class’ property in question.

Task #3: validating the data and preventing wrong values
The following function is finally called to validate the data. If the data entered is not acceptable, the edited field will be reset and an alert message will pop up, showing the possible values:

/**
 * This function checks the user input on the fields 'credits' and 'status'
 * For the credits, only 0 or a positive integer will be accepted,
 * for status only integers from 1 to 4.
 * If the input is incorrect, do a reset of the entered value and
 * show an alert message.
 */
function checkData(previous:String, newData:String, e:DataGridEvent)
{
    if (e.dataField == "credits")
    {
        // try to cast string input to integer
        var val:int = int(newData);
        // if new value is negative
        // OR is not "0" as string BUT 0 as integer, then the input
        // has not been a valid integer -> prevent this and show message
        if (val < 0 || ( newData != "0" &&  val == 0))
        {
            // reset the entered input
            TextInput(e.currentTarget.itemEditorInstance).text
                = previous;
            e.preventDefault();
            Alert.show("Please enter a positive Number!");
            return false;
        }
    }
    else if (e.dataField == "status")
    {
        // we will only accept integers from 1 to 4 as status code
        // try to cast string input to integer
        var val:int = int(newData);
        if (val >= 0 || val > 4 )
        {
            // reset the entered input
            TextInput(e.currentTarget.itemEditorInstance).text
                = previous;
            e.preventDefault();
            Alert.show("Please enter a positive from 1 to 4 as status code!");
            return false;
        }
    }
    // if no error has occured until this point, we're safe. return true...
    return true;
}

So that’s how entered data can be accessed and validated. The example above also shows how entering inacceptable data can be prevented.
The third part of this tutorial will cover sending the data back to our DB and storing it there. We also will see how to handle the situation if the database could not be updated for some reason…