Head First HTML5 Programming

Chapter 8. Not Your Father’s TV: Video ...With Special Guest Star “Canvas”

We don’t need no plug-in. After all, video is now a first-class member of the HTML family—just throw a <video> element in your page and you’ve got instant video, even across most devices. But video is far more than just an element, it’s also a JavaScript API that allows us to control playback, create our own custom video interfaces and integrate video with the rest of HTML in totally new ways. Speaking of integration... remember there’s that video and canvas connection we’ve been talking about—you’re going to see that putting video and canvas together gives us a powerful new way to process video in real time. In this chapter we’re going to start by getting video up and running in a page and then we’ll put the JavaScript API through its paces. Come on, you’re going to be amazed what you can do with a little markup, JavaScript and video & canvas.

Meet Webville TV

Webville TV—all the content you’ve been waiting for, like Destination Earth, The Attack of the 50’ Woman, The Thing, The Blob, and it wouldn’t be beyond us to throw in a few ‘50s educational films. What else would you expect in Webville? But that’s just the content, on the technology side would you expect anything less than HTML5 video?

Of course, that’s just the vision, we have to build Webville TV if we want it to be a reality. Over the next few pages ...