7:10 pm

Introducing “Video”

I’ve been working on a new website for about 2 weeks, and now it’s ready to share with the world. Quite simply, it’s a catalog of our home videos. Jaspenelle’s Dad bought us a video camera for Christmas, and we have made several videos.

Video by michaelandjaspenelle.com

Most people would use YouTube or some other video sharing site. I considered using them, but I prefer to host web-content myself whenever possible. If you are using a third-party, like YouTube, you have to agree to their terms and deal with their servers and their policies and restrictions. I don’t like being restricted.

The website was actually developed quite quickly - because of several existing open source solutions, I actually had a working (albeit not very pretty) mockup working after a few hours of coding. The remainder of the 2 weeks of development was making things nice and experimenting with different features. It’s built using the following technologies:

Linode
condor.garjasp.com is a Linode 360, a UML virtual server. This let’s me micro-manage everything about my hosting environment, and run any services or software that I need or want.
Ubuntu Linux
The OS is Ubuntu 7.10 Server Edition. I would have used Debian, but they are always out-of-date. Previously, this server (when it was known as manticore.garjasp.com) ran Gentoo (of which I was also a developer), but that became too difficult to keep up-to-date and secure.
Apache HTTPD Server
Only the world’s most popular http server. I have an intimate relationship with this beast, and have tamed it quite well. All configuration is pulled from LDAP (using a set of PERL scripts to autogenerate the config on startup) and is highly optimized to the server environment. For the video site, I have some mod_rewrite magic to create the pretty URLs.
PHP
The website backend uses PHP5. This is used to check for a valid video file, generate and read metadata, get a list of available video files, and allow for different templates based on the URL. It will be quite easy for me to extend the video site to have Categories, RSS feeds, or anything else I can come up with.
FFmpeg
After videos are uploaded to the server, they are encoded to FLV by FFmpeg. It is also used to generate the PNG thumbnails.
Flowplayer
Another great piece of open-source software, flowplayer plays the FLV files generated by ffmpeg. It’s highly customizable and scriptable, so I was able to make it do exactly what I wanted.
Yahoo User Interface Library
YUI provides the core scripting components to make the Web 2.0 features easy to create. I use it for easy DOM access and for dynamically loading the video metadata.
Carousel Component
This is an add-on to YUI that I use for the neat scrolling of available videos.
Blueprint CSS
In the past I have used YUI for designing websites and CSS design. I recently heard of Blueprint CSS, and it works pretty well for what I wanted to do. I’m not actually using much of the CSS framework directly - most of my CSS is actually a modified form of it’s classes. It provides a nice reference and jump-off point that YUI just couldn’t provide. YUI requires too much HTML bloat, and that’s something I’ve always disliked about it.

Currently, the code for the website is not in a releasable state - some things are very specific to the current environment. Over time, I hope to get it cleaned up, add a nice admin interface (right now all administration is done via WinSCP and SSH), and make it more configurable, then I may release it to the general public.

Let me know what you think!