Manish's journal. » fTube: the YouTube player

I wrote this app live during my session at BarCamp Delhi.

It's a YouTube player that downloads (using YouTube's REST API) the list of 25 most recent videos featured on the YouTube front page. The user can select a video from the list and hit the play button to play it in-Flash.

I built the app entirely in Vim (no IDE). To save time (and show off CSS), I had put the visual stuff into a CSS file, which I then applied later on once the app was functioning.

The demo went really well, although I was able to complete only about 60% of it in the allotted time. I wasn't able to show the Ajax integration, for example - something I thought the crowd was interested in. But never mind - it's available online now for everyone to see (right-click and say View Source!).

fTube: the YouTube player (requires Flash Player 9)

Stuff to look out for (besides video playback):

• Ajax integration (exchanging data with JavaScript): when a video is selected from the DataGrid, the details appear on the HTML side of the page. Search the source for "ExternalInterface".
• Client-side data filtering: the list of videos can be filtered by title and rating using E4X. Search the source for "filterFunction".

And then you'll notice the little things - like the same CSS file being applied to both the HTML page and the Flex app (which is cool, capability-wise).

Finally, I'd like to mention that the concept, the UI, and a lot of the code, come from Sho Kuwamoto's fTunes demo at the Adobe Tech Summit in February. He built the app live using Flex Builder 2.0 (beta) in 5 minutes flat! Many thanks to Sho for the inspiration, the guidance and the source.