FlarToolkit made easy : SimplAR

As cool as bell-bottom pants according to Keith Peters! Which is pretty damn cool. And it can be really fiddly setting up the FLARToolkit, so I’ve finally released some of my AR code. Just in time for it to go out of fashion. 🙂

It uses the Alchemy branch of the FLARToolkit and includes everything you need to get up and running. It also has a very optimised automatic threshold adjustment system that takes virtually no extra processor time.

Here’s a quick intro :

It’s easy to use, there’s just one class. And I’ve also included swc files for the FLARToolkit Alchemy branch and the latest revision of Papervision2.1. You just need to extend the class and override the add3DObjects function.

package ly.seb.simplarexamples
{
	import ly.seb.simplar.SimplarBase;
	import org.papervision3d.objects.primitives.Sphere;
 
	[SWF (width="640", height="480", backgroundColor="0x000000",frameRate="30")]	
 
	public class AR_Sphere extends SimplarBase
	{
 
		override public function initialise() : void
		{
 
			var sphere : Sphere = new Sphere(null, 40); 
			sphere.rotationX =  90; 
			sphere.z = -50; 
 
			//add it into the container that is updated 
			//relative to the pattern marker
			container.addChild(sphere); 
 
		}
 
	}
}

Check out the screencast below to see how to use a custom marker, handle when the pattern is lost and found, and load a 3D model in.

You can check out the project from my googlecode repository at : http://code.google.com/p/sebleedelisle/

There area couple of extra things I’d like to add to the code, at the moment the size is fixed at 640×480 and the image is not mirrored; both things I would like to fix in the future.

I’d like to thank thesven.com for his FLARToolkit Alchemy code that saved me masses of time! Thanks also to Jesse Freeman and Kyle Kellogg for helping me test this.

Making a multi-track recorder in Flash part 2

Get Adobe Flash player

On Tuesday night I did a last minute ad hoc presentation to FlashBrighton to share the experiments I’ve done with the microphone capabilities of FlashPlayer 10.1. You should be able to see the recording at live.flashbrighton.org (if it’s not there, bear with us while we try to get it working). Click “media” to see the available videos.

I had a lot of fun and there were actually 85 people watching the live stream and heckling me (including Lee Brimelow and John “Flash on the Beach” Davey), which I really enjoyed, despite my feigned irritation. 🙂

I explained exactly how audio works, what it means when we see a wave form, and how that gets turned into audio that we can hear. And then I showed that a waveform gets all jumbled up when you mix sounds, but our brain can still separate it all.

Then I showed how simple it was to make a sine wave tuned to concert A, 440 Hz. And then we mixed in the C above it to make a two note chord. Here’s the code for that :
Continue reading “Making a multi-track recorder in Flash part 2”

Making a multi-track recorder in Flash

Toy recorder

Toy recorderOriginal Photo : PhotoCapy

I’ve been playing with the Flash microphone input to record and playback multiple tracks. I thought it’d be really easy, but sadly it’s been really really tricky. The main problem is to do with knowing exactly when data from the microphone was recorded, particularly relative to when some audio was played!

I could write a lengthy blog post about it, but instead, I’ll just be presenting my findings, along with source code, at FlashBrighton tonight. If you’re not in Brighton you can watch at live.flashbrighton.org. Sorry for the short notice, I’m covering for someone who had to pull out at the last minute.

It should be recorded but I’m not sure how quickly we’ll be able to post it so I’d recommend you watch it live if you can. It starts at 7.15pm GMT.

Mind your semi-colons!

ByteArray bug 1

(previously titled : Flash Player bug? for each..in loops)

[UPDATE] Kudos and much thanks to Tim Knip who pointed out that it was in fact my mistake – there’s a stray semi-colon at the end of the line :

 
for each(byteArray in soundSources); 

Which is of course ending the loop there and just running the code in braces after that once. I seem to keep accidentally typing semi-colons lately. Perhaps it’s the frustration of having to work with the sound API. 🙂

And of course the good news is that we can safely continue to use for each…in. Yay! Thank you everyone for helping me find this.


I’ve been pulling my hair out over the last few days trying to get a sound toy working, don’t you hate it when you feel like you’re fighting against Flash? Anyway, I think I’ve found a bug, I’m iterating through an array of ByteArrays using for each, but for some reason it will only give me the last ByteArray.

I’m sure this has been the source of several unexpected behaviours in my current project. Can you let me know if it happens in your FlashPlayer? I’m currently running the debug player version 10.1.51.82.

Here’s the swf :


[sorry, content no longer available]

And here’s what I see :

ByteArray bug 1

And here’s what I would expect to see :

ByteArray bug 2

You can see I’m iterating through the array twice, firstly with the iterator i and secondly with the for each directive.

And here’s the code :
Continue reading “Mind your semi-colons!”

ActionScript SoundDataEvent.position

… is measured in samples. Not bytes or mils.

So if you want to know how it relates to the ByteArray you’re working with, you need to multiply it by 4 (as each floating point sample requires 4 bytes). And if you want to convert it to mils, you need to divide by 44.1, the number of samples per millisecond.

I just thought I’d point it out because it doesn’t seem to be mentioned in the AS3 docs. Or the Flex docs. I checked this time 🙂

I expect you’re wondering why I’m discovering all this stuff. Watch this space 🙂

ActionScript SoundChannel.position

… is measured in milliseconds.

Why do I mention this? Because it seems to have been entirely omitted from the ActionScript live docs and it took me a while to figure it out. Maybe this post will save someone some time in the future. 🙂

[UPDATE] I just noticed that this is actually specified in the latest Flex 3.5 language reference, but not in the ActionScript reference. I guess it would be boring if it were too easy, huh?

3D engine in 10 lines*

Flash simple 3D particle renderer

UPDATE – HTML 5 Canvas version now online

During my session at the Flash Gaming Summit, I showed a very simple 3D particle renderer to attempt to demystify the process of converting 3D into 2D.


Flash simple 3D particle renderer

Click and drag.

The actual code that converts from 3D to 2D is easy! First you have to figure out how much you have to resize things depending on how far away they are. (ie what their z position is).

newscale = f/(f+z);

Where f is a notional field of view. Changing this will change how wide the (virtual) camera is. A good starting point would be 250. Then you multiply the 3D x and y positions by the newscale to get their 2D x and y positions.

x2d = x3d * newscale; 
y2d = y3d * newscale;

So that’s where we put our particle, in this case represented by a MovieClip that we also need to resize by our new scale :

clip.scaleX = clip.scaleY = newscale;

And then the final thing we need to do is sort by the z position so that particles in front appear above particles in the background.

particles.sortOn("z", Array.DESCENDING | Array.NUMERIC); 
for(var i:int = 0; i< particles.length;i++)
{
	particle = particles[i];
	particleClip.setChildIndex(particle.clip, i); 
}

There’s some other stuff in there too, to create the depth of field blur and also the bitmap trails, but have a look and see what you can do with it.

Download the source code for simple 3D engine.

* I haven’t actually counted the number of lines. I’m guessing it’s about 10. 🙂

More training courses in Cologne, Minneapolis, New York and San Francisco

I’ve just finished my Brighton training courses which were seriously good fun, and everyone seemed to enjoy themselves, I’ve certainly got excellent feedback so far!

My next training course is short notice; it’ll be a Papervision course in San Francisco on the 9th March particularly aimed at 3D games. It’ll coincide with the Flash games summit so if you’re interested, let me know and I’ll make sure to get in touch with more information as I have it.

Then it’s on to Cologne for FFK in April, where I’m running both a Papervision3D course and a Flash games training course! More info on the FFK website.

And back to NYC for Flash and the City in May, and I’ll be running courses around the conference. Again, mail me if you’re interested and I’ll send you the details as they are announced.

And finally in FlashBelt in June, I’ll be teaching a one day Flash games workshop. Teaching you maths by stealth – who knew that you could learn trigonometry from Asteroids and vector maths from platform games? 🙂 It’s a fantastic conference and I’m really looking forward to coming back for my fourth year in a row!

Can’t make any of these events? Then help me organise one near you! Mail me.