It looks like Firefox will support the <video> tag in 3.1, due in 2009. It will join Opera, which already supports it. That is good news. Unfortunately, Internet Explorer 7 does not support it, and it doesn’t look like IE8 will either. Until all the major browsers support a standards-based approach, playing video in browsers will continue to be a challenge.
The current state of rendering video in browsers is pitiful. Browsers require a plug-in to play video, and web developers are not guaranteed that one is installed. The Flash plug-in is the most popular, and most video sites, like YouTube, convert their video to Flash format and embed it in a custom wrapper that offers play/pause and other functionality.
Gallery Server Pro uses the Flash plug-in for swf files, so if your animation or video is in this format, you are good to go. But Gallery Server can’t take your mpeg or wmv file and wrap it up in Flash for you. I believe there are ways to do this using open source converters, but it is not trivial to implement. If someone wanted to volunteer some time to add this, I would be happy to include it in a future release.
So what do you do when you want to post your videos in their native format, whether it is mpeg, wmv, mov, avi, or some other format? Or, more specifically, what should Gallery Server Pro do when you upload one of these videos? Should it assume a particular plug-in is installed? Should it convert everything to Flash?
There are pros and cons to each potential solution, and in the end I came up with a flexible HTML template system that provides a default solution, but allows you – the web administrator – to change it to conform to your needs. For example, version 2.0 will output the following HTML for most videos:
<object type="{MimeType}" data="{MediaObjectUrl}" style="width:{Width}px;height:{Height}px;">
<param name="src" value="{MediaObjectUrl}" />
<param name="autostart" value="{AutoStartMediaObjectText}" />
</object>
This produces XHTML 1.1 Strict syntax that lets the browser decide how to render it. If a plug-in is installed that can handle the MIME type, then it is used. If no plug-in is available, the browser may – or may not – give you some help in choosing and installing one.
This approach works reasonably well in current browsers, but older ones don’t handle the <object> tag very well. If backwards compatibility is more important than conforming to web standards, you can edit the template to use the <embed> tag. You can read more about this in the Admin Guide.
The introduction of Silverlight adds new possibilities, and the upcoming release of 2.1 will have new templates that use the Silverlight plug-in for wmv, wma, asf, asx, and mp3 files. One of the greatest benefits to the Silverlight control is the ability to start playing video once a few seconds have been buffered. Most plug-ins I had previously tested play the video only after it has been completely downloaded. So far this feature is working nicely, but I have been struggling with some issues with Firefox 3. It’s been a real cat and mouse game in figuring out the guilty party; I don’t know whether to blame Silverlight, Firefox, or the ComponentArt ASP.NET controls.
Probably the most robust and reliable way to play video in Gallery Server is to use the new External Content feature of version 2.1, and I am really happy with how this is working out. With this release, you add a media object to the gallery, *not* by uploading a file, but by pasting HTML code that refers to the media object hosted elsewhere. For example, every video on YouTube has embed code you can copy. It looks something like this:
<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/0tNzoCw9xms&hl=en"></param>
<param name="allowFullScreen" value="true"></param>
<param name="WMODE" value="opaque"></param>
<embed src="http://www.youtube.com/v/0tNzoCw9xms&hl=en" type="application/x-shockwave-flash" allowfullscreen="true" wmode="opaque" width="425" height="344"></embed>
</object>
The Add objects page in Gallery Server Pro now has two tabs: Local Media and External Content. The Local Media tab works like before, where you can upload media files to the gallery. The External Content tab allows you to paste the embed code, as seen here:
When you view this media object, Gallery Server Pro embeds the HTML fragment as part of the entire page, where it will play the video directly from YouTube. The beauty of this approach is you get the benefits of YouTube’s technology for converting video and buffering content. Also, YouTube pays for the bandwidth. The video never actually passes through the web server Gallery Server Pro is running on.
You aren’t just limited to YouTube. You can also use Silverlight Streaming to host your video files, or add your favorite The Daily Show clips from Comedy Central. In fact, any HTML can be used. This is a powerful new feature, and I am sure some people will find applications for it that I haven’t even imagined.
No comments:
Post a Comment