Twelve hours of coding without a mouse pad, and my wrist had a painful callous. What would MacGyver do? Make a mouse pad!
Materials
Roll over to play, roll off to stop. Click the Flash movie below once if you are in IE.
Bunch of small things about Flash this week, in particular, 8’s IDE.
JSFL Automation
Reading Steve Bryant’s post about Sharpening the Axe. I’ve actually been doing a lot of the same. I’ve been writing a lot of JSFL in the past few weeks to automate a lot of the repetitive tasks that my team and I have been doing in Flash on this project. Although she’s a tad un-forgiving because she’s so boilerplate level code, that same low-level also gives you a lot of power. Error handling is a bitch, but so far 100% of my efforts have been rewarded with time saving scripts to automate a variety of tasks. Publish all, setup a FLA with a specific SWC and stub code, build a custom UIComponent, amongst other things. With the RAD development we are doing via multiple people in multiple FLA’s, it certainly helps since we have to re-build a lot of the same things and ensures less of an error in doing so. I really do wish, however, the XUL implementation had more controls. While I’m ecstatic I can actually talk to them via code now, I could really use a Tree and a Dropdown. I’m curious if I could implement them anyway and see if the engine supports it via an unsupported fashion. Regardless, much faster to build minor GUI’s in record time vs. creating them in a WindowSWF.
Initialization Order & Default Values
Had some serious issues earlier in the week. While the designers chug away at production art, I’m trying to make our components more useful at authortime, so have been implementing Inspectable metatags like mad. They are the tags that expose your component’s public properties via the Property Inspector in Flash when you drag a component to the stage. What I didn’t realize is that the default values are ONLY written if the component is created at authortime. If you create it dynamically, you lose the default values. I kept some notes at my work computer, but the initialization order is crazy hard to memorize. Basically, it’s like static, prototype (class member), init object OR inspectable tag values, and finally constructor. So, I can’t do default values in the init function anymore; I have to do the old skool of setting them on prototype via:
private var __label:String = ""; private var __childHMargin:Number = 0;
I believe this still works in AS3 too, but it makes a lot of purists uncomfortable. Anyway, it’s really hard to support both the programmer and designer workflow at the same time. We’re getting damn good at it, though.
Extension Manager 1.7 Problems
Finally, having a hell of a time with Extension Manager 1.7.240 on both PC and Mac. Sometimes it won’t uninstall your files for Flash 8 from the user directory and you have to clean up the mess manually. On Mac, it’ll crash after uninstalling leaving files still there too, or at least it “thinks” they are. Really frustrating since I’ve come to love this app’s ability to seemlessly deploy desktop software.
I can tell a user to clear their browser cache, but there is no “clear cache” on a user’s desktop. I can see why a lot of old skool Win32 / fat client developers love web applications since those problems effectively vanish. Naturally, the thought of writing code to delete specific files on a user’s machine makes me cringe with horror. So much so, I refuse to do it, and instead opt for writing documentation on how to delete the files so the user can do it themselves. In IE and Firefox, this is trivial; you click the button, and your server delivers the latest / greatest build. Anyway, the effort is worth it, but damn, this is harder than web application development.
Scale 9
Last frustration. We all LOVE Scale 9. However, apparently Scale 9 in Flash 8 & Flash 9 alpha only works for vector shapes and not for bitmaps. Scale 9 DOES work in Flex 2 with bitmaps so… kind of frustrating. Hopefully Flash 9 (Blaze) will implement whatever magic mxmlc, Flex’ command line compiler, is using so Flash can do this too. I’ve heard you can use code in Flash 8 to get this to work, and although unconfirmed, that’s not the point; it should work in the IDE. The docs are not clear on this at all.
BTW, Dictionary.com’s new design is really nice!
I miss the Crocodile Hunter. You’ll be missed Steve Irwin; you were a good bloke.
Crank = Good flic. I have a feeling they removed a kung-fu scene from the beginning when he goes into a biker gang’s bar. Since Jason Statham‘s character was a lot more edgy, and less rico suave than his smooth roles in the Transporter 1 & 2, my guess is they wanted a clean seperation, so removed the scene in post. Don’t take your kids. I laughed a lot. There was some really progressive editing in there, like, sub-titles would stay, and he’d read them. Good stuff.
Check this crud out; I set my iPod on the window sill at my office in Detroit, and the earpiece fell on the power strip, turning off my computer. Thankfully I saved, but what are the odds!?
Finally, I’ve been travelling to and from Atlanta & Detroit for the past 4 weeks without incident. Suddenly, last Sunday (August 27th), my belt sets off the metal detector in Atlanta airpot. I’ve been wearing the same belt for a whole month without incident. I think we need another gun test just to exacerbate the idiocy of the facade. All the hype the US media spouts about airport security is bullshit. I’ve been flying every Friday & Sunday for the past 6 weeks, and security has been the same both before, during, and after the UK thang, the crazy woman thing, and the crazy dude thing. In all fairness, I’ve heard of delays; my mom 1 day after the UK thing, took 1 hour through security (usually 4 minutes for me), and her flight was delayed 4 hours. She abandoned the trip for that weekend.
It’s a good thing I drink too much caffeine, and thus my hyper-alert status can compensate for my mediorcre hand-to-hand skills if a situtation arises mid-flight. Terrorists and nut cases beware.
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.
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.
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.
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