North Star Labs

I had $15 in expiring gift cards from when I bought my new TV, so I decided to pick up an inexpensive 2gig Flash drive online.

To increase my peace of mind, I decided to store everything important to me in an encrypted disk image on the device. I used the same method I use to create a FileVault image, and then just moved the image file over to the flash disk.

I’ve been really happy with the performance, and it’s great know that WHEN I lose this tiny thing, none of my private and very sensitive information will be accessible to whoever picks it up.

In addition, there’s really no additional barriers to using this encrypted disk image. I store the password to the disk image in my Keychain, and it’s also encrypted with the FileVault Master certificate as an added layer of protection against forgetting my password.

Finally, even though the following command creates a sparse bundle capable of storing 300 Gigs of data, the Finder will realize the image file lives on a 2 Gig flash drive, and will only display the free space available on the “parent” filesystem.

The command to create the Leopard-only disk image is:

umask 077
export NAME="secure"
hdiutil create -size 300g \
    -encryption -agentpass \
    -mode 0700 \
    -fs "HFS+J" \
    -type SPARSEBUNDLE \
    -layout SPUD \
    -volname "$NAME" \
    "$NAME".sparsebundle;

After doing some research, I’ve found the widely used method of distributing a small Flash player which acts as a streaming proxy for the “real” video file stems back to the Satay Method of embedding Flash content. More specifically, YouTube and the widely used JW FLV Player, among others, all appear to be derivatives of this method.

The article, “Flash Satay: Embedding Flash While Supporting Standards” by Drew McLellan has been an excellent source of information while working on my problem of streaming ISO standard MPEG-4 Part 14 content directly from my own website.

Overall, I’ve found a single <OBJECT> tag is sufficient to support both RSS syndication and embedded flash video in a standards-compliant manner. The trick is to simply nest an <a><img> tag inside the object tag. Google Reader will strip the object tag, leaving it’s children intact. This results in a static image being displayed when reading the syndication, along with a hyperlink back to the original article and the streaming video.

I noticed that the embedded video I posted in my last post didn’t show up properly in my RSS feed reader, so this post is an attempt to get things right.

The goal here is an accessible, high quality embedded video that works properly on both this site, and through syndication.

First, the MPEG-4 AVC Video:

Second, the embedded youtube video:

Here’s hoping this works…

Edit: (2007-09-28 01:05 -0400) Added placeholder images for google reader, which will strip the flash object from the feed.

I noticed in my RSS feeds recently that the new version of the Adobe Flash Player browser plug-in supports H.264/MPEG-4 AVC and AAC audio, but I didn’t think much of it at the time. As it turns out, I’m really happy that Adobe supports standard MP4 files accessible through plain HTTP, as it cuts out the proprietary Flash Video (FLV) format.

Macs are wonderful when creating rich media since they now ship with iMovie, and relatively inexpensive tools such as ProfCast are out there. This rich media derives a lot of value from being represented in standard formats such as MPEG-4 AVC (H.264) video, and AAC audio, all rolled up into the standard MP4 container. However, it turns out to be incredibly difficult to publish this standards-compliant media to a web page player that “just works” like Youtube.com.

Until now, the only viable way to embed this content in a web site was to use the quicktime plug-in, which is a bit heavy for the task. With the most recent versions of Flash Player 9, we now can directly play high quality videos, in a standard format, produced with free tools.

Here’s an example using Jeroen Wijering’s excellent, and free (Creative Common’s Licensed) Flash Video Player. Check out how nice “The Machine is Us/ing Us” looks, compared to the Youtube version at: http://www.youtube.com/watch?v=6gmP4nk0EOE

The code for this is relatively simple, though a bit of a pain to get formatted correctly. And by “bit” I mean, it took me hours. If I start to do more video content, I’ll definitely look into a plug-in so the blog handles these details.

<embed src="/blog/flvplayer.swf">
  allowfullscreen="true"
  allowscriptaccess="always"
  flashvars="&displayheight=350&file=/blog/media/WeschWeb2v3.mp4&width=420&height=315"
  align="middle" height="315" width="420" />

The video is a conversion from a high quality Quicktime file to standard H.264/AAC video.

Hopefully we’ll start to see higher quality videos up on Youtube now. In the meantime, you’re able to do it yourself if you need to publish higher quality video in an easily accessible manner.