sakri rosenstrom blog

Ice Cube, How… How could you?

I’ve always liked you. Even after Anaconda, and your last attempts I heard on the radio, I still remember… Jumping on my bed, memorizing lyrics and blasting ‘Straight Outta Compton’

“Flash is outta here”… It’s not so much the message, it’s the messenger. I don’t care what Ice Cube thinks about flash, it’s just so damn surreal to hear him say it?! He might as well have said, “Singleton pattern is for Suckas!”. People outside working hours just don’t say things like that. Period. It’s wrong. It’s like seeing your teacher outside school. Or your grandpa talking about sex. Ice cube?! wtf?

Will Adobe respond? Too bad Eazy-E is dead? Maybe Snoop Dogg could churn out some dope ass AIR apps… East Coast West Coast? Puff Daddy? Browser wars are so passe, puhleaze, I for one welcome our new MTV Gangsta driven RIA Platform warring Overlords!!!!11

Last week I started preparing an “Example Cairngorm app” that I could train the new nascom flash team with. Last night, I modified it :

Click to placate your Ice Cube Hate

There’s an HttpService which points to a php script, which in turn returns insults scraped from some online “insult generator” pages. These are displayed over randomly rotating screen shots from the offending video . If the Cairngorm training does happen, I may continue work on this masterpiece!. “AddInsult” (yeah baby, web2.0). “Viewed insults” screen with a datagrid (so sexy :D) . Maybe some HOTT text effects, tomato cannon, even some Fire?!! As usual, you can right click for source, prolly not worth it though. Some original code, some source from here and there…

If you’re new to Cairngorm, David Tucker has some well written tutorial style articles. Not to stray from the topic of Ice Cube, but I’ve been weighing PureMVC and Cairngorm… I lean more towards Cairngorm, but am not crazy about it. There’s a funny (but makes a point) posting at the bottom of this blog entry concerning these two frameworks. But that’s another topic.

Go insult Ice Cube!

For shizzle, ice cube is more this than this

Right, my phone is an outdated piece of crap (relatively speaking), beat up too, for good measure.

I haven’t bothered to update, as there just aren’t any “killer features” I feel I’m missing out on. I will once Nokia releases a phone with wifi. Yes, Nokia, not an iPhone, I am from Finland after all

Anyway, I deviate from flash and flex and text effects, simply because opera mini 4 knocked my socks off. I’ve had Opera mini installed for a long time, and I like to read reddit and slashdot etc. when in the train, tram, walking the dogs, rocking my baby to sleep in her pram, on holidays, taking a dump (yes, I’m a man of class).

Anyway, without opera mini in the first place, I wouldn’t use my phone for surfing (d000d hang10). (if you don’t know about the optimization process, do visit operamini.com). A few days ago, an “update opera” link appeared, I clicked it, and very quickly (the .jar file is under 100kb) tested out the new browser. HOW THINGS HAVE IMPROVED!!!!!

I punch in reddit, a site with some ajax features, the layout isn’t too complex, but still, I used to have to scroll through a bunch of ads and other crap to get to the headlines. Now when I start, I see the entire page, zoomed out.

It’s unreadable, but OMG?! There’s a mouse!!! Suddenly my phone has a mouse?!!! I can move around to the part of the website which I find interesting and zoom! No more ads, no more menu items I don’t care about, just headlines:

And… to top it off, I can actually log in, and I can up/down vote stories! None of that was available before. (ok, logging in, a whole new can of worms, not fodder for this post though).

(am I a top notch photographer or what?)

anyway, there’s a ton of new features, read about them here : http://www.operamini.com/features/

Opeara, hats off

What these fine men of Norway have in effect accomplished, free of charge, is upgrade my mobile phone! Value has been added! It has suddenly leaped forwards, and become a more useful tool. Amazing!

One upping myself here… happens everyday.

I overcame the font size limitation of my previous attempt at the ““Giant Letter Creator”” by focusing on the bitmap image, not the text field. So now, I create the desired text, in the desired font at size 12. Then I grab a BitmapData of it using matrix to scale it, and base the “comment text” rendering on this.

The result is much better… This is total overkill ofcourse, but you know, if you wanna surprise your friends when they update their cvs

Huge commenting text generator

This version even has buttons to generate commenting code!!! (// and /* */), and 5 lines of CSS!!!! DAMN LIFE IS GOOD!!!

And then, There are still a few issues…

Naturally the bitmapdata size limitation in flashplayer… I solved that with, what else, and Alert.show()

THen, for monospace fonts this works great, however, for script fonts etc. the spacing of characters can overlap from time to time, meaning the “big character” sometimes has the wrong “small character” (duh, sounds really scientific, here’s an image):

Huge commenting text generator

Again, the code is still quick and dirty, right click to view source or click here

So I created an as3 3d engine which pretty much pwns and humiliates papervision3d…

…then I woke up from my fantasy and wept.

John posted a “Giant Letter Creator” on his blog. The idea is nifty, but what caught my attention was that I could use my ‘trick’ from the Dazzling Bat Man Text Effect to, (and this is probably the only time in my life I can say this) ONE UP JOHN GRDEN

I know, pathetic, but I’m a dork like that

Anyway, what I figured was I could create the desired text in a big font, take a snapshot of it using bitmapdata, then run through the relevant pixels in the image to generate “huge commenting text” from any font and any character.

Now, I only had a good hour to spare, this version has shortcomings, but here it is (proof of concept style):
Huge commenting text generator

The code is quick and dirty, but there really isn’t much of it Either right click to view source or click here

What is truly craptacular is that in (flex only?) flash the size of a non embedded font has a maximum of 130 or something, bigger than that and nothing happens. I suppose I could fix this by scaling the snapshot of the text field… Maybe next week…

. . YAARRRRRR….. AIRRRRRSOME…. . .

nascom logo:

Brand Spanking New AIR logo Released yesterday (Mnemonic Square Icon Version) (stolen from Ryan Stewart) :

Coincidence? I think not?!

Nascom was DESTINED to be the numba one like super Greg

yo!

. . . .

Boulevart and all you other sucker agencies might as well start looking at Silverlight

…confessed Serge. Unfortunately the setting was not in a specialist Amsterdam nightclub, rather, at the SAP Lounge in Brussels. After an insane month working as a consultant at thesedays, I had only one day to prepare two sessions for the Adobe
Beyond Boundaries event in Amsterdam and Brussels. My topic was “introduction to AS3 for designer types”, and as conversion bait, I did some benchmarking between flashplayer9 (as3) and fp8 (as1/2). I ran and timed some loops (files : as2 as3), with fairly predictable results. Well, I was positively surprised by 5 secs for 1 billion loops in as3 :eek:.

I also wanted to showcase the speed increases for rendering graphics. I was hellbent on creating a cheap version of the Sony Bravia Bouncing balls commercial, in as2 and 3, then woo the crowd with flashplayer9 pwning and humiliating its older counterpart. Unsurprisingly, I didn’t finish the as2 version for Amsterdam, so, during my lunch break in Brussels I hacked it together. To my disbelief they both performed more or less equally?! Right then, my moment of bewilderment was broken by the entrance of Danny Dura, “right on time” I thought to myself. Danny quickly suggested I flag useBitmapCache, and use Shapes instead of Sprites, but to no avail. At this point Serge joined the conversation, suggested I save this nutcracker for later and showcase teh 1337N355 of AS3 with the famous papervision x-wing fighter demos. This is the point where, (within the hearing distance of a number of suit&ties from some other conference) Serge announced this blogposts title

Joking aside, wtf? I’ve uploaded the two files, feel free to test:

AS2
AS3

(and yes, they are different files, for proof just let yourself be knocked out by the beauty of the as3 button component over it’s dinosauring sibling)

At 4000 balls, the as2 version runs at times faster than as3!!!??

Any ideas? Is it rendering? The code is pretty much identical… If you are motivated, you can even look at it:
ze zip

Oh yeah, not worth it’s own blog entry, here’s my “quick app tutorial” used in my presentations, showing some basic tasks and how they are done with AS3:

HOTT Jean Claude Dance AXXXion

I’m currently working on a multiplayer game (well, 2 player), a flex app which uses Flash Media Server2.
I use the Command Pattern in the app for “player moves”. I have a IGameCommand interface and a bunch of Command classes which implement it. Users select/create moves (command instances) which they send to the Media Server using AMF0 . The Media Server then validates both moves, and sends them back to the players, at which point the client side flashes execute the commands.
Here the tricky bit was the serializing / deserializing, as AMF0 only handles generic Objects… I didn’t want to have this massive switch statement to determine the type of command, then serialize it… Miraculously I recalled this blog post by Colin Moock, and salvation was at hand! I love AS3.

It turns out that in flash.utils there are a few VERY useful functions…

first, flash.utils.getQualifiedClassName() returns a string like : “net.sakri.commands::KickAss” (I’m not sure why the double colon, I’ve seen that syntax before in php and so). As an argument, you can pass an instance of an object, or the classname. This is perfect for the serializing, as the serialized object can be given a variable which holds the “qualified” name of the class that it was serialized from.

Below is an example implementation inside a Command classs (function getSerializedAMF0Object():Object is defined in IGameCommand interface):

[as]
public function getSerializedAMF0Object():Object{

var obj:Object=new Object();
obj.qualified_class_name=getQualifiedClassName(this);

//rest of props

return obj;
}
[/as]
This is kosher AMF0. The server then pushes such serialized commands to both players, and here is the code which releaved me from the nasty switch statement:


[as]
public function commandFromServer(c:Object):void{

var ClassReference:Class = getDefinitionByName(c.qualified_class_name) as Class;
var command:IGameMoveCommand=new ClassReference();
//pass the rest of class props from the serialized object,
//all of which adhere to the IGameMoveCommand interface

}
[/as]
The reason this rocks so much, is that I can now create as many commands as I like, without having to touch the send/receive, serialize/deserialize code. This method could also be used for “real” serializing, meaning, you could store your data objects as xml or strings or whatever, and know that painless instantiation awaits the stored objects return

This is the final posting about my presentation at multimania (sniff sniff), and I’ve saved the best for last… The idea is nothing new, a text, which either comes together from pieces, or explodes into pieces… I made one at nascom for a Belgian radio station called Donna a few years back… Pigs Farting, right up my alley


seems there is still a version online

I wrote a flash based “fart text generator”, where I could create letters by adding and removing bubbles, dragging them around and eventually storing an entire alphabet in xml… this was then referenced by the animation, and fart text was born… took a good 5 days to make the “text generator” if memory serves me…

I came up with an automated way to do this (though I must disclaim that someone has probably done this before, as always). The idea is to grab a snapshot (bitmapdata) of a textfield, using a Matrix transformation to shrink it… When the bitmap data is small enough, a “for loop” can grab all the pixels which are not transparent (using getPixel() ) . These are stored in an array, which in turn can be used to place “the pieces”. With the speed increases in flash player 9 this happens acceptably fast. Works for any font (download the source and change the font if you don’t believe me).

here it is (Make sure you have sound on!):

The riveting batman text effect!

Click to see the text explode (and sound thunder), right click to view source (or click here

I have a bunch of ideas to use this for… bleeding text, smoking text, burning text… if any of my infinite fan-club members decides to use this technique, be sure to post here about it

So, when your local user group meets up, a bunch of geeks get together and drink wine in posh castles like this:

Right? Didn’t think so Gotta give it to the organizers….

So, try imagining someone that ‘codes optimized bump map rendering for vm 3d engines’…

With an instinctual sense of schadenfreude, one conjures up images of 2 inch thick glasses with bandaid, nervous twitches and other generally creepy character attributes… Yet, as so many times in the past (with flash devs), I was surprised that Ralph Hauwert was not only “totally normal”, but a very nice guy and a great public speaker! (not forgetting inspirational). I’ve been reading lots, seen demos and even tried some tutorials with papervision3d before. I was enthusiastic, but getting a ‘first hand’ walkthrough the project really got me psyched! No wonder my mailbox is daily filled with the papervision mailinglist Can’t wait to get my hands dirty….

It was cool to see him create a Collada file in 3dsMax (oh, and explain wtf collada is in the first place, nothing to do with coconut alcohol), then import it into a flash project and manipulate it… He also spoke about the groups philosophy for creating the best possible api (easy for flash users to grasp), which got a bit thumsup for me. Impressive demos, great info… thanks for coming!

Koen’s presentation went straight for the jugular of image manipulation in as3… It’s tough to make the matrix class sexy speaking material, but Koen was well prepared and I learned a couple of things… First thing I did this morning was to try out the DisplacementMapFilter… I grabbed some old code and put together this magnificent rip off of Koens wavy text effect

displacement filter text effect

again, right click for source, or click here

I used net.sakri.graphics.WaveGraphic to create a (wait for the surprise) a wave graphic, to which I added 60 y blur… It’s the same wave graphic as in the infamous “web2pointOHmyGod Logo Explorer” I then scroll the lil bastard using net.sakri.component.HorizontalBitmapScroller to (again, tough to anticipate this one) scroll a snapshot of the wave graphic… HorizontalBitmapScroller does the “panorama thing”, at first I tried BitmapData.scroll() , but the displacement fun ends real quick like that Then, as Koen had demonstrated (I still can’t believe I never saw it before), I run DisplacementMapFilter on a textfield, and, VOILA!

I just had to add the reflection, but damn… my dual core is going to 60%… resource hog from hell… oh well, no time to optimize (I guess the .swf could be smaller than 800×600), but such is life

anyway… Looking forwards to the next event!

Right, as an attempt to imprint my name into the retinas and craniums of all who made the mistake of attending my multi-mania presentation, I had a “text effect which reacted to sound” covering the moviescreen… (see a piece of it here). My name, accompanied by my very own pirate smileys, bouncing to the wicked sounds of dj Zinc’s “super sharp shooter”.

I later on explained how I used the “split text field” effect (see text effect explorers, split text effect explorer), to react to the wonderful AS3 flash.media.SoundMixer.computeSpectrum() functionality. All the magic happens in the “reactToSound” method (just view source). The code loops one of the returned channels, grabs a readFloat() from the spectrum at an interval defined by the number of letters in my effect, divided by the available bytes (256). I then use this value to “y position” each letter and a few “followers”…

View the lobotomizing und brainwashing text effect!

click here for source goodness, or right click on the .swf then “view source”

The reflection was more or less copied from : Ben Stuckis reflection , I also used a “Easy Button” from the original AS3 samples written by the mighty Senocular, not his greatest contribution to the world of flash , but saved me a few seconds, and, gave me a good reason to give a shoutout to the great man I used audacity open source sound editor (the gimp of sound editors) to create the “loops” (lol). If nothing else, I know I have no future in the world of music