Mozilla Hacks

connecting html5 video to the web

By

Posted on June 19, 2009 in 35 Days, Canvas, Firefox, JavaScript, TraceMonkey, Video, and XMLHttpRequest

29 comments

  1. Quxxy

    Pretty cool. One thing that’s annoying me about these HTML5 videos is that there’s no way to fullscreen them. I suppose it’d be too late to add some kind of fullscreen option on the context menu for 3.5?

    June 20th, 2009 at 01:42

  2. anonymous

    I like this FF 3.5 player, but where is fullscreen mode ?

    June 20th, 2009 at 01:44

  3. Ken Saunders

    That was extremely cool!

    Does 3.5 have a dummy mode, or an alert system to let people know that they can not use the video controls to change the volume or seek through the video WITH THE CONTROLLER THAT IS IN THE ACTUAL VIDEO?!

    Geesh, can you believe that I’m admitting that I attempted that?
    You’d think that I would have noticed the extra cursor on my screen. I guess it’s kind of like a bird flying into a closed window.

    June 20th, 2009 at 02:14

  4. scribu

    I would have never guessed that something like that would be possible in a browser, in 2009. Amazing.

    June 20th, 2009 at 03:23

  5. […] This is cool, seems a bit futuristic for 2009. http://hacks.mozilla.org/2009/06/connecting-html5-video/ […]

    June 20th, 2009 at 03:50

  6. Kanenas

    There is something funny going on with the video’s encoding. The mozilla star (the one with the dragon/godzilla) seems to “twitch” every few seconds.

    June 20th, 2009 at 04:21

  7. Magne Andersson

    Check this, http://people.mozilla.com/~prouget/demos/DynamicContentInjection/play.xhtml too :)

    June 20th, 2009 at 04:52

  8. Theodora Vorbix

    Save Video As… will be the most welcomed feature of all

    June 20th, 2009 at 06:45

  9. ghis

    When I play a video in Firefox3.5b99, all my CPU is used (I tested with various videos). It’s strange that a native implementation of video used more CPU than Flash…

    June 20th, 2009 at 07:26

  10. Ken Saunders

    Hey I too would love full screen mode (who wouldn’t) but for now, you can at least use full page zoom. In my experience, it works great with open videos in 3.5 and not so well at all for Flash or other formats in any version of Firefox.

    Try this zooming this (fast paced) animated video on openvideo.dailymotion. The quality when zoomed is great.

    http://xrl.in/2ig3

    June 20th, 2009 at 10:58

  11. Anonymous (*)

    @anonymous:

    In plans (i hope) –> https://bugzilla.mozilla.org/show_bug.cgi?id=453063

    June 20th, 2009 at 13:06

  12. Anonymous

    Yes, this small 500×375 video element consumes ALL of my Sempron 3000 CPU too. Is it a bug or feature?

    I wonder what kind of powerful machine did they use to make this demo, since there is a face recognition overhead.

    June 20th, 2009 at 13:57

  13. Maik Merten

    @Kanenas: The “twitching” is an encoding artifact introduced by using a Theora encoder based on an old codebase (Theora 1.0) (keyframes happen to have a different visual quality than surrounding frames, thus sticking out). Encoders based on current Theora 1.1 alphas do better.

    June 21st, 2009 at 03:43

  14. Boris

    For me, whe the browser is not in the background the sound play with a lot of noise and very “¿chopy?”, if i put the browser in the background the sound play fine.
    The probles is only related to the video elements, all other sound in the browser and windows play fine

    June 21st, 2009 at 13:04

  15. AndersH

    Full screen (under control of the webpage) for video, as well as for normal content, is something that you still need flash or silverlight for. “window.open(…, …, ‘fullscreen’)” aren’t really usefull since it is blocked by the popup blocker, would start a whole new window and doesn’t disappear on escape.

    June 21st, 2009 at 13:48

  16. […] 原文地址：connecting html5 video to the web 系列地址：颠覆网络35天 […]

    June 22nd, 2009 at 01:02

  17. […] Omdat beelden meer zeggen dan woorden, check it out! Open video format in combinatie met javascript zorgt er voor dat de gezichten herkend worden en hun twitter status wordt opgehaald… http://hacks.mozilla.org/2009/06/connecting-html5-video/ […]

    June 22nd, 2009 at 04:47

  18. […] Blizzard posted his Open Video Conf talk on connecting HTML5 video showcasing the great demos of Paul Rouget […]

    June 22nd, 2009 at 05:15

  19. […] is coming soon. In the meantime, you can see one of the demos that Blizzard and Paul Rouget gave here and Blizzard and my slides […]

    June 25th, 2009 at 11:35

  20. […] is coming soon. In the meantime, you can see one of the demos that Blizzard and Paul Rouget gave here and Blizzard and my slides […]

    June 26th, 2009 at 11:32

  21. […] html5 video to the web http://hacks.mozilla.org/2009/06/connecting-html5-video/ […]

    June 26th, 2009 at 15:58

  22. […] is coming soon. In the meantime, you can see one of the demos that Blizzard and Paul Rouget gave here and Blizzard and my slides […]

    June 26th, 2009 at 16:46

  23. […] is coming soon. In the meantime, you can see one of the demos that Blizzard and Paul Rouget gave here and Blizzard and my slides […]

    June 26th, 2009 at 18:15

  24. Dan Hackner

    This is very cool. Keep up the good work, I look forward to playing around with this.

    June 30th, 2009 at 08:06

  25. […] Check out this video of what HTML5 can do. http://hacks.mozilla.org/2009/06/connecting-html5-video/ […]

    June 30th, 2009 at 13:56

  26. […] Connecting HTML5 Video to the Web (screencast by Chris Blizzard, Director of Evangelism at Mozilla) […]

    June 30th, 2009 at 18:13

  27. Tony Murphy

    Good demo of html5 video. The possibilities are endless. This has got me thinking about potential apps :-)

    cheers
    Tony

    July 18th, 2009 at 10:27

  28. […] 原文地址：connecting html5 video to the web 系列地址：颠覆网络35天 […]

    August 5th, 2009 at 22:36

  29. Katerina

    And ones more here :D

    Hi Chris! I’m reading (for my study at the uni) canvas & videos. I need just this one feature!! Bounded Boxes on one video (like these two red & green) in HTML5, appearing dynamically.

    Have u maybe published this source code anywhere as a demo? :) Thanks in advance!

    March 11th, 2011 at 05:28

Comments are closed for this article.