Quite simple, load as binary first and than load the ByteArray as Bitmap.


var urlLoader:URLLoader = new URLLoader();
urlLoader.dataFormat = URLLoaderDataFormat.BINARY;
urlLoader.addEventListener(Event.COMPLETE, urlLoaderComplete);

var url:String = "http://www.adobe.com/images/shared/product_mnemonics/50x50/flash_player_50x50.gif";
urlLoader.load(new URLRequest(url));

function urlLoaderComplete(e:Event):void
{
  var loader:Loader = new Loader();
  loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderComplete);
  loader.loadBytes(urlLoader.data as ByteArray);
}

function loaderComplete(e:Event):void
{
  var bmp:Bitmap = e.currentTarget.content as Bitmap;
  addChild(bmp);
  var bitmapData:BitmapData = bmp.bitmapData
  bitmapData.applyFilter(bitmapData, bitmapData.rect, new Point(0, 0),
    new ColorMatrixFilter([
      0, 0, 0, 0, 0,
      1, 1, 0, 0, 0,
      0, 0, 1, 0, 0,
      0, -1, -1, 1, 0
  ]));
}



var container:Sprite = new Sprite();
var balls:Vector. = new Vector.();
var m:Matrix;
var s:Shape;
var r:Number;
var c:uint;
for(var i:int = 0; i < 10; i++){
r = Math.random() * 100 + 100;
m = new Matrix();
m.createGradientBox(r, r, 0, -r * 0.5, -r * 0.5);
s = container.addChild(new Shape()) as Shape;
c = Math.random() * 0xFFFFFF;
s.graphics.beginGradientFill(GradientType.RADIAL, [c, c], [1, 0], [0x00, 0xFF], m);
s.graphics.drawRect(-r * 0.5, -r * 0.5, r, r);
s.x = Math.random() * 400;
s.y = Math.random() * 300;
moveBall(s);
balls.push(s);
}
function moveBall(s:Shape):void
{
//whatever easing to move the spheres
}
var s2:Shape = container.addChild(new Shape()) as Shape;
m = new Matrix();
m.createGradientBox(200, 200, 0, -100, -100);
c = Math.random() * 0xFFFFFF;
s2.graphics.beginGradientFill(GradientType.RADIAL, [c, c], [1, 0], [0x00, 0xFF], m);
s2.graphics.drawRect(-100, -100, 200, 200);
var bmpData:BitmapData = new BitmapData(400, 300, true, 0x00000000);
var bmp:Bitmap = addChild(new Bitmap(bmpData)) as Bitmap;
addEventListener(Event.ENTER_FRAME, render);
function render(e:Event):void
{
s2.x = mouseX;
s2.y = mouseY;
bmpData.applyFilter(bmpData, bmpData.rect, new Point(0, 0), new BlurFilter(2, 2, 2));
bmpData.draw(container);
var i:int, l:int;
var aArr:Array = [];
var c:int;
for(i = 0; i <= 0xFF; i++)
{
c = (i - 0x80) << 1;
if(c < 0) c = 0;
aArr[i] = c << 24;
}
bmpData.paletteMap(bmpData, bmpData.rect, new Point(0, 0), null, null, null, aArr);
}


It’s really simple drawing installation.
You get your iPhone and access the URL from your browser in the instruction on the projection, and just start drawing, and you can see it right away on the projection.
You don’t need to install any application.

You can check some videos here: http://www.facebook.com/event.php?eid=106749376013168

So, I used HTML5 + JavaScript for the web application, PHP for the socket (I know, it’s not the best solution, but it was what I could’ve done at this time), C++ & OpenFrameworks for the application running for the projection and a MySQL database to store all the drawn data.

What I’ve learned from this?
- you don’t really need to learn Objective-C and pay hundreds to Apple to make some simple application
- don’t try to do what everyone is doing
- I know c++ now
- flash is slow even on AIR
- sockets on PHP works pretty well
- HTML5 won’t be replacing Flash any time soon
- people are afraid to do something different at work until someone does something new
- don’t try to do everything by yourself

Anyway, at the end, everything went well, personally the result was really good.

If you read this post before 29th of March, you can still go check it out at Hoxton Square.

The demo is in this link:http://www.hellokeita.in/xp/DragDrop/

As I said, it’s really simple, it’s not the best code but it gives you some ideas of how it’s made.

Inside the “tags” folder, I have three pngs for each shape (triangle, square and circle).
You draw the shape you want, I trim it, and compare to each png.
The comparisson is, get the drawn image, stretch it to the size of each png, and apply threshold. The BitmapData.threshold returns you an uint, the number of pixels that has been changed. With this number, divide it to the area of the png, and than, you choose the one that returns you tha smallest number.

and… that’s it. simple simple…

actually, it’s a technique used for some facial/object recognition softwares, but in a simplified way.

The first night, I had some inspiration, nothing to deal to any of the presentations I saw, but just something that I wanted to test. I couldn’t upload it because I didn’t have internet at the hotel, and at the venue the firewall was blocking me to connect to my FTP.

So, what was my experiment this time?
Gesture!
I think it’s working quite nice for a code I took less than an hour to write. It was much easier than I thought.

Just click and try to draw a Triangle, Circle or Square.

Enjoy!
I’ll post the source code later… let me take a nap now.

http://www.hellokeita.in/presentations/LFPUG/20090827/MakingMusicFP10.pdf

And the source files zipped with the demos I showed.

http://www.hellokeita.in/presentations/LFPUG/20090827/examples.zip
The contents are:
Example01-SineWaveExample: Simple example generating a sine wave
Example02-KeyboardExample: Example of a piano keyboard
Example03-WaveformExample: Changing the waveform of a sound
Example04-TimePitchExample: Changing pitch and tempo of a mp3
Example05-HeliumBalloon: Real time pitch shifting using Java

Enjoy!

UPDATE
LFPUG website uploaded the video of my presentation
http://www.lfpug.com/flash-10-making-music/

Just another test now controlling the pitch and the tempo of the playback.
Source… soon, I’m re-writing the classes trying new approaches.

Basically, the curveTo method uses a quadratic bézier, so you need a control point and a anchor point.
But it’s difficult to find the precise control point for a curve you want, because the control point is not inside the curve.
Also, you just can create a curve with just one control point, or if you want to use many curveTo methods in sequence, sometimes the curve doesn’t became as straight as you want.

So, I created a class that calculates the control points with multiple values bézier.
You can also get the position in this curve.

Here goes the examples. (you can click and drag the points)

Sorry for lack of explanation, actually I’m in vacation now, but I wanted to post this class.
Later I’ll try to post more examples and uses.

I will try to update my svn with these classes, commented, after I came back from vacation.
So, for now, here is the source code.

So… what I have been doing?
Actually… nothing interesting…
Then, couple days ago I started developing my own 3d engine.
I won’t make it public because it will take all my free time that I actually don’t have…

I didn’t run any benchmarks, I think it’s more heavy processing than Papervision3d.

anyway… here is it…