Jumpeye V3 Components for Flash

Raul Popa emailed me last month asking for a fair review of their Jumpeye V3 components for Flash 8 & Flash CS3. I get a lot of product & book review requests and ignore all the ones that sound boring. This one sounded interesting, although, mis-placed since until recently, my AS2 work had all but died now that I do full-time Flex. I mentioned I could either use them on a project and write a war story review, or just open up the code base and do a code review. He was cool with that but mentioned I couldn’t crack them easily; I think he interpreted me trying to hack them which wasn’t my intention. I just wrongly assumed that if you give out components, you also get the source code & FLA’s. Ah, to be young and naive…

Anyway, cleaning out my inbox yesterday morning while waiting for her majesty’s car to be lizz-ubed, I came across his email starred and wrote a follow up. At my current gig, there is a client who needs yet another video player. I had refused to get involved in any large scale Flash development projects since in my opinion there was a lot of Flex work to be done, and the current Flashdevs could handle it. Now that I was getting dragged in, I was going to do it right. Keep in mind, we’re doing our stuff on the video player end in AS2 because of Flash Player 8’s penetration numbers far exceed Flash Player 9, and AS2 compiles to Flash Player 7 & Flash Player 6 as well, so it’s a no-brainer.

First order of business was getting team agreement on a component set to use. Those mentioned were mCom (pre-Flash CS3), Bit Components (aka the Beamjive), and my Flash Lite Shuriken ones. Upon coming upon his email, I let Raul know that I may be able to use them in a project. After sending, I opened them up, and tested a few out. They worked, and seemed to be aimed at IDE integration and XML configuration. As a developer of Flash components, the first thing I did was look for source code, but found none. I asked in another email, and Raul replied that you do not get the source code.

I responded saying that you need to change your business strategy; people like me need source code to debug, build upon, and customize. After a few back and forth emails, I learned I was not his target market. He cited survey responses that I mostly agreed with and could corroborate. I got my start in this industry by building simple Flash components back in Flash MX . They were targeted at designers who wanted to drag and drop things on the stage from the library. These components would then be customizable by the Property Inspector (more challenging than it sounds to support that for someone like me who didn’t know OOP very well back then). Finally, all the components were skinnable via the graphic symbols in the library.

To this day, there is a lot of people who have very successful careers (even in 2002 when the market blew) by using pre-built components that have configurable properties. Furthermore, with the explosion of server-side API’s the last few years, you can make some sophisticated solutions for clients in Flash without having to know a lot of programming. That’s powerful, and a fun market to develop for since most of the customer (FlashDevs) feedback is very excited and ecstatic. As users, their feature requests for the component IDE integrations aren’t all that complicated. It’s just a matter of finding time.

So, upon reading Pixelfumes’ review, I totally got it. Furthermore, it reinforces where I wanted to take a lot of my ideas. Basically, you create mini-applications as components. A button is one thing, an mp3 player is another. Jumpeye isn’t just making Flash components, they’re making mini-RIA components as well like their XML Slideshow for example. Yes, you could use component sets to build these things, but why? Why not just use a component instead, and build the branding around it? Makes perfect sense to me for small scale contracting, and larger scale agency work. I could even see it in small scale RIA development if your deadlines are short. They’ve also done the little things that all Flash Devs do; modify things on a common component they’ve always wanted, but didn’t get out the box. A horizontal Accordion for example. I cannot count how many times I’ve seen emails asking for that on Flash & Flex email lists.

Bottom line, I think for Flash Devs working with designers, or even just designers, this set was made for them. It has skinning as a forefront in their creation, and integrates in the normal ways you expect a Flash component to integrate with the Flash IDE (property inspector, helpful errors in output window, drag and drop to stage and “they just work”). Haven’t read the docs since I only read docs when I have problems, but the amount of examples seems to reduce the need. Furthermore, the pricing is apparently a direct result of the support costs, something I’ve heard in the past as a deterrent to doing commercial component sets. Meaning, it sounds like their support structure will counter what has plauged a lot of the other component sets in the past.

Will I use them? No, I don’t do that type of work anymore. I do see a lot of people, however, really getting excited about this set? Yeah, definitely. If you are a designer or Flash Dev doing small scale RIA work, and/or doing heavy design integration, check ’em out. If you are a Flex dev, the AS2 versions aren’t going to work for you, but will give you some design & customization ideas for the Flex 2 SDK ones. Furthermore, if the AS3 ones are easily wrapped in a UIComponent, they may have a future in integrating.

Yes, they are working on an AS3 set, and yes, if you buy now, you’ll get those without having to purchase them separately.

Check ’em out.

I have to get out of Las Vegas

Down on one knee, I leaned back against the rusty pipes behind me. They are cold. I can feel their icy indifference through my jacket. The sensation is fleeting, though. I am starting to lose myself in the moment. One second to breathe. My arms feel weak, my legs tired, my confidence naked in a large world, alone. I need to concentrate, but something inside me yearns to savor the cold touch of the pipes. Their solidity is my piton driven into the rock face of desperation I am scaling. My anger can make me fly.

My right eye half-closes, I inhale, and lift my Beretta perpendicular to my face. The clip slides out, and I catch it at attention. Five rounds. An odd number. I reload the clip, ready to make them even.

Inhale. The air powers my overhead view. I scan the last memory I have of the old factory I’m in, the floor I saw from 3 stories as I fell towards the ground. I knew I’d need this, and so review intensely. I am a rat in a maze, moving near the speed of light. Each dead end, I reset my position to the beginning, scanning for the correct way through. Left.

My teeth clench as I hear the inescapable sound of feet pounding the pavement to my side, someone landing from a jump. My feet know the direction, let them handle this, I need to buy them time. I continue to spring forward, my gaze swinging to the left, my hand leading the way. I start pulling the trigger before my shot is even lined up. His glok starts to respond in turn. I am still moving. The bullet exits the chamber. It is halfway there as I turn my gaze back forward, thinking my farewells to #5, dragging my wrist who in turn drags my berreta forward. There is cover ahead, one shot is all I can afford to pay fate for the next turn.

I have little left anyway.

They took everything dear to me… it wasn’t personal I knew. I was merely involved by being alive. The emptiness of happenstance only fueled the black hole of rage that grew within me. I turned right, ordered my feet to stop, my right arm ecstatic he was back in the fray, reared right back around towards my target. I slid into the metal container, shoving off of it with my left arm, changing direction back towards the way I came. I needed to make sure the last goon I shot at was no longer a threat and if he wasn’t, he better make sure I am. They would pay… they would all pay. Compensation in their blood, my gun an invoice for death.

I turned the corner in a full sprint, my arm leading the way, firing two shots. Number 4 and 3 joined #5 in his chest, his arms going slack, he looked at the ground, frustrated that it would catch him, the last to hold him alive. Again, I ordered my feet to stop, skidding into the fallen man’s legs. My right hand covering my back, my left scooped up the man’s gun. Just in time; they were flanking me on the balconies above, trying to seal my exit. The fools had confirmed my destination as the right one. No sooner had I scooped up more for the party, lead sparked on my path, rebounding skyward. The goon on the balcony was pouring his clip towards me, a gourd showering the ground with malice.

I was already drenched. Sitting in a chair, my hands cuffed on the 3rd floor, I had escaped only to have filth from the abandoned factory mixed with my own blood personify my emotional scars. They were taunting me, beating me, demanding answers with no care if I answered them. Apathetic sadists, all of them. I kicked off the table, falling out of the window backwards, managing to take one of them standing behind me along for the descent. We fell onto the side of the overhanging catwalk, my chair breaking violently, shoving a large splinter into my lower back. My solace was my travel mate breaking my fall, knocking him unconscious as we tumbled upon some old, stacked pipes that clanged loudly to the floor, covering us in dirt. I managed to work the gun out of his holster, step my legs through my cuffs, and use #6 to severe their connection.

Gunshots signaled my exit, bullets bit at my heels. I needed cover.

I kept running, a catwalk up ahead my only chance for getting more ground behind me. The goon didn’t care, and continued firing as I ran with all haste under the catwalk, bullets ricocheting loudly, each one causing my body to be infused with more endorphins. I could see the far wall up ahead, and could only hope the door was there, and open. It was.

The daylight harshly surprised at my arrival, did not illuminate an exit strategy. I was in a maze of metal and rock. I ran forwards, knowing more distance between me and my pursuers was my only chance. Not much of a chance really… I was sorely out-manned and somewhat out-gunned. I didn’t care, I’d find a chance.

…but first, I have to get out of Las Vegas.

***

Actually, I’m not really in a Max Payne situation… I’m in my hotel room at the Venetian, fixin’ to don my Universal Mind uniform, and head down to the welcome party that Adobe is throwing at this years MAX conference. I’m sore from climbing yesterday, and taking a trail ride on horse with the crew… I need to start working out again, haven’t felt this way in awhile, pretty cool to remember.

http://www.jessewarden.com/archives/10222006(002).jpg

Saw a lot of friends today and other code-celebrities, and snagged me one of the uber-posters. For the next few days, when I’m not speaking, I’ll be on the 5th floor exhibition hall at the Universal Mind booth, or nearbouts. Come say, “Yo!” and bring leads.

Server-Side FFmpeg Converter: Flash, ARP, & SWFStudio

Preface

As part of my Flash & Flex speech I’ve been giving throughout the year, I wanted to create a real-world app where you would want utilize Flash & Flex together. Back in late July, I started creating a YouTube clone. There was a good blog entry posted awhile ago on this. The goal was to create a really rich front-end in Flex that pretty much required the use of Flash. I purchased a design from Templatemonster.com that looked impossible to do in Flex, and set out to implement it.

Introduction

The one thing you need for a YouTube clone is a server-side tier that can upload videos of various formats, and convert them to FLV’s. After receiving the cliche “You could of searched on Google instead of asking that question” on FFMPEG’s developer list, I realized I wasn’t going to get any help from the community on finding a scriptable executable, at least in my aggressive time frame, especially for Windows. Stefan from the chattyfig Flashcom list hooked me up with a Windows compiled ffmpeg.exe. I wanted to build the whole back-end in PHP, though, since although I’d prefer to use Ruby, I don’t really have the time with this specific project so had to go with what I know. I spent 3 days trying to get the FFmpeg php module to compile as a PHP add in. I even went so far as to try to learn MAKE and friends.

On the 4th day, exasperated, I gave up and took drastic action. I decided to create the back-end converter in Flash. I’ve only once before created a server program in Flash. Flash is typically used on the client as a front end technology, in a web browser, or as rich desktop apps. There was one time in the past, however, where it was perfect as a server application. Macromedia (now Adobe) had a program called Central. It was their first foray onto the desktop client world. In Central 1.5, they incorporated an API that allowed you to access AOL instant messenger & ICQ messaging capabilities via code. It was pretty neat. I couldn’t for the life of me figure out a good use for it on the client, though. Instead, I created a bot server. The bot, called FEEDBot, allowed people to IM it. If you were a buddy of FEEDBot, you could then ask it to monitor your favorite blogs. It’d check every hour, and if a feed was updated, it’d IM you with a link to the blog and an excerpt. I’d basically run the Central program, leave my computer running so it’d act like a server.

I did a few tests and found that via SWFStudio, I could talk to FFMPEG via Flash 8 pretty well. I didn’t have a legal license of Zinc back then, and didn’t want to create it in Flex 2/ActionScript 3 because for a quick and dirty server app, strong-typing was too slow to develop in. Flash 8 was perfect. So, I proceeded to create a video converter for the back-end in Flash 8, SWFStudio, and Flashcom. Flashcom allowed the client to convert video and get real-time updates. It also allowed the EXE to act as a service so to speak, so multiple clients could all ask Flashcom to convert videos after it uploaded them, and the EXE would then tell FFMPEG to churn away.

How does it work?

Through a few technologies and steps.

messages.gif

A client will upload a video. This video is uploaded via PHP. Upon a successful upload, the client then tells Flashcom to convert the video. Flashcom then tells the VideoConverter application, which also exists on the same server as PHP, to start converting the video. The VideoConverter then tells FFmpeg to convert the video to FLV with certain parameters. When FFmpeg is done, it tells the VideoConverter. The VideoConverter then tells Flashcom that it is done with that particular video. Flashcom then tells the client that it is done, and the client can now play the FLV via Flashcom.

flow.gif

Since the above process utilizes Flashcom, this allows the client to get real-time updates as to the process, unlike the “wait for frikin’ ever for a respone” one gets on YouTube. Additionally, you can use the same server to play back the video. Obviously having the same computer converting video via FFmpeg, running a Flashcom messaging server, as well as a Flashcom video serving server won’t scale. That wasn’t the point; the point was to get a proof of concept application up and running. Naturally, I bit off more than I could chew. The video conversion part works, but the actual client portion of the application is taking longer than expected, mainly because of my full-time consulting work; I’m traveling a lot, thus don’t really have enough time to devote to finishing it.

However, since the server portion DOES work, I figured I’d release the code in case it might benefit someone.

Points of Interest

One particular architecture challenge I had with the server portion is the same problem I’ve had with Flex Data Services and Cairngorm 2 for Flex 2. Cairngorm, as well as ARP, do not natively support a methodology for doing server push. They are built around a request / response model. This means that the client initiates a request and the server responds. The entire framework is built around this concept. Therefore, there is no real model built around the server pushing a message to the client, and the client acting upon it.

So, I came up with a concept an Observer. My boss & architect on a previous project, Thomas Burleson, helped me hash out the cleanest way to implement it into Cairngorm. I used that same 10 minute conversation to do it in this implementation via ARP since both frameworks are very similar, and Cairngorm 2 won’t work in Flash 8.

observer_pattern.gif

This Observer class basically listens for events coming from the server in a push fashion, in this case, utilizing Flash Media Server which supports a real-time binary socket connection with the Flash Player. This helps in 2 ways.

First, Flash Player 9 doesn’t seem to support the old slash syntax that has been in Flash for years, at least with regards to how the old Flashcom server-side framework expects it to. A lot of my server-side code expects this to work, so I had to find a way that didn’t require a major rewrite of the existing Flashcom server-side component framework since I like how it works and didn’t have time to invent a new one. The client to server method calls work, but the server to client ones did not. Therefore, I merely pass in the namespace string and have the Observer parse it to something useful. This requires a very minute change in the ASC code on the Flashcom server; instead of passing a namespace as a method call, you merely pass the method name as the first call, and the namespace as the first parameter.

Second, I can segregate the server push, the part that doesn’t fit well into Cairngorm/ARP, into it’s own class. This base class is extended by business specific classes. For the VideoConverter, I extend this Observer class, and act on specific messages by dispatching events. The Observer doesn’t actually respond to the server, nor does it send messages. Instead, it dispatches events like normal. This allows Cairngorm/ARP Commands to determine if there is a need to send a message to the Flashcom server in the classic request/response way. Since I can encapsulate the fact I’m talking to a real-time server in the Business Delegates, Cairngorm/ARP work great!

One minor detail is that you can, via a Command, turn the Observer on and off. Additionally, I’ve hacked ARP to have a singleton event dispatcher much like Cairngorm 2 does.

SWFStudio API Parameters

Another thing is that SWFStudio uses vanilla (un-typed) Objects as parameters to it’s methods. I despise this. While I enjoy the ability to get away some loosely typed things in Flash, those particular cases make it extremely challenging to debug. So, for the relevant methods, I created strongly typed ValueObjects so I can ensure all my calls to SWFStudio are correct; if something messes up, I clearly know where to look for the problem. It makes unit testing the SWFStudio to FFmpeg calls easier & quicker.

I’ve only implemented one shell method and one file copy method for SWFStudio but because I used ARP, it’ll be easy to add more as time goes on. Hopefully the Northcode peeps could uh… you know… do it themselves, hehe! I know most Flash devs don’t really strongly type everything, so I highly doubt it’s a common enough use case to support development effort on. Since they DO support Flex 2, I know they care, but probably not enough for Flash 8 and below.

Anyway, here’s the code, hope it is helpful/beneficial to you in some way.

Video Converter – Source ZIP

FABridge: Flex AJAX Bridge

Adobe has just released “FABridge”, the Flex AJAX Bridge on Adobe Labs which exposes Flex apps to the browser.

This should also interest web developers if you want to utilize Flex 2 components / mini-apps in your AJAX & DHTML applications, have limited Flex/Flash resources on staff, and/or don’t feel like coding all of the bridge code… Adobe just coded it for you.

Check it out.