SVG Video Demo

[ Update 2007-10-01: Patch 5 for the video element support can run this SVG demo. Binaries and SVG source available here. ]

Vladimir Vukićević ported a Silverlight demo to SVG. The photos.svg file runs in Firefox and you can move, resize and rotate the photo's using a nice interface. It demonstrates that the types of things that Silverlight is being used for can also be done using open standard technologies like SVG.

I took Vladimir's work and modified it to work with the HTML video element support I'm adding to Firefox. With this version you can resize, rotate and move video files while they are playing. The topmost video in the z-order has the audio track played. Performance is pretty reasonable considering I haven't done any optimisation of it.

The magic of including the HTML video element inside SVG is done using <foreignObject>. Something like

<foreignObject>
  <div xmlns="http://www.w3.org/1999/xhtml">
    <video src="myvideo.ogg"/>
  </div>
</foreignObject>

. A screen cast of this running is available (in various file formats):

• Ogg Theora
• Youtube
• Flash
• Quicktime

The videos being played are:

• Open Road Trip interview
• A Scanner Darkly movie trailer
• Video of Pitcairn Islanders making Molasses

To get this working I had to make a few changes to the video element code, some of which are in the git repository already. The rest will be pushed soon, along with the source to the SVG demo which I'll add to the list of test/demo files I use.

If you have a browser with support for <video> you should see the option to play it below.

Sorry, this browser does not support the video element.

Categories: firefox, ogg

Dave Winer Visits Mozilla

Dave Winer visited Mozilla yesterday to give a talk about RSS during the all hands meetings. I've been a reader of Dave's blog for awhile and was previously a Radio Userland user for a couple of years so it was good to meet him in person.

He outlined his views on the 'river of news' format of aggregating feeds that Radio Userland uses. This seems to be Dave's preferred way of dealing with RSS. The advantage of this approach is that the new news items appear at the top of the list so you can quickly scan the new information and discard the old if you don't have time. I don't think he was too impressed with the way Firefox handles RSS feeds with the 'live bookmarks' and the way things are handed off to external readers.

I briefly talked to Dave afterwards about the new Video and Audio elements that are being specified, and about the Video implementation in Firefox. This came up in the context of if it was possible to build a podcast player in a web browser. With the video/audio elements I think this is more than possible and could make for a great user experience - all in standards (or at least, draft standard) based HTML.

On his blog he wrote about following up on his ideas on integrating RSS and podcasting into the web browser. I'm interested in seeing what he has to say on this and how the new functionality we are implementing could help with this.

Categories: firefox

Firefox Video Element Patch Version 4

Version 4 of the Firefox Video Element Patch is up. It has a number of bug fixes and contains changes suggested by the reviewers.

Before applying the patch to the Mozilla Firefox CVS trunk, you should first apply the third party modules patch. Another option is to just use the git repository I've been maintaining.

One major change is I'm no longer using PortAudio. Instead I'm using the Sydney Audio library included with liboggplay. This works well and now sound works across Windows, Linux and Mac OS X for both debug and optimized builds. I abstracted out the sound library implementation behind an interface. If it is decided to go to another library it's fairly simple to implement that interface.

I've done binary builds for Windows, Linux (x86) and Mac OS X (Intel). They are available at the test page. I put together. Remember this is alpha code from the CVS trunk with the patch applied - it may crash or do nasty things so run it in a Firefox profile specific for testing this (using the -P or -ProfileManager command line option for example).

If you try it out, let me know of any bugs you come across, or if the Git repository doesn't build on your platform. I'm off to the Mozilla All Hands meeting in Mountain View next week, so if you're in the area and want to meet up, let me know.

Categories: firefox, ogg

Using the Factory Window Manager on Mac OS X

Factory is an X11 window manager written in Factor by Eduardo Cavazos. Although best used in Linux, it can also be run using the X11.app in Mac OS X.

First you need to build Factor using the X11 backend rather than the standard Mac OS X backend. This can be done with the latest darcs code using these steps:

cd Factor
make macosx-x86 X11=1
./Factor.app/Contents/MacOS/factor -i=boot.x86.32.image -ui-backend=x11

The X11.app program usually runs a Quartz based window manager. You can run any window manager by providing a .xinitrc file in your home directory. Copy /private/etc/X11/xinit/xinitrc to ~/.xinitrc:

cp /private/etc/X11/xinit/xinitrc ~/.xinitrc

Edit it so the last line which runs the window manager is removed, and remove the '&' from the end of the line that invokes 'xterm':

# Change this
xterm &

# to just
xterm

#Delete this line
exec quartz-wm

Now when you run X11.app you'll find an ugly looking xterm window starting with no window manager decorations. From within this xterm, run the X11 Factor you built, and start Factory:

cd ~/x11-factor/Factor
open Factor.app
USE: factory
":0" start-factory

This starts a UI instance of Factor, loads the Factory code, and starts the window manager on the given display. You can also run it as a terminal application rather than the UI:

cd ~/x11-factor/Factor
./Factor.app/Contents/MacOS/factor -run=listener
USE: factory
":0" start-factory

Either way you run it, you'll see the X11 windows instantly get the Factory decorations. The key bound to bring up the Factory menu is F12 which by default on my Macbook does something else. This can be configured, along with the menu, by copying two files and editing them to do what you want:

cp ~/x11-factor/Factor/extra/factory/factory-rc ~/.factory-rc
cp ~/x11-factor/Factory/extra/factory/factory-menus ~/.factory-menus

In ~/.factory-rc, change references to the F12 key to F8. Now when you start Factory, F8 will bring the menu up for running applications.

With Factory loaded this way you can modify the window manager code on the fly and the effects occur immediately.

Categories: factor