Difference between revisions of "HTML5MediaLibraries"

From Sugar Labs
Jump to navigation Jump to search
m
m
 
(2 intermediate revisions by the same user not shown)
Line 3: Line 3:
 
<span style="color:#FF0000">This page is under construction</span>
 
<span style="color:#FF0000">This page is under construction</span>
  
 +
=Video=
 
== Display a Video ? ==
 
== Display a Video ? ==
  
Line 49: Line 50:
 
|
 
|
 
|}
 
|}
 +
==Record a video using the Webcam==
 +
==Take a picture using the Webcam==
  
 +
=Audio=
 
== Play sound ? ==
 
== Play sound ? ==
  
Line 60: Line 64:
 
=== Usage ===
 
=== Usage ===
  
You can use the audio tag - https://www.w3.org/wiki/HTML/Elements/audio
+
You can use the audio tag
 +
 
 +
  https://www.w3.org/wiki/HTML/Elements/audio
 +
 
 +
  <audio controls
 +
    src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.oga">
 +
    Your user agent does not support the HTML5 Audio element.
 +
  </audio>
 +
 
 +
  See http://createjs.com/SoundJS
  
 
=== Warning ===
 
=== Warning ===
Line 67: Line 80:
 
   Chrome on Android does not support autoplay as advised by the specification.
 
   Chrome on Android does not support autoplay as advised by the specification.
  
=== Sound Manager ===
+
== Record sound using the microphone ==
 
 
  http://createjs.com/SoundJS
 
 
 
 
 
== Interact with Canvas ? ==
 
 
 
=== Scene Manager ===
 
  
  http://createjs.com
+
=Input/Touch=

Latest revision as of 10:38, 15 May 2015

Overview of HTML5 media libraries and feedbacks

This page is under construction

Video

Display a Video ?

Recommendations

You should provide both .ogv and .mp4 files

Even if ogv is free, it’s not supported on all majors platforms.

 http://caniuse.com/#feat=mpeg4
 http://caniuse.com/#feat=ogv

Usage

You can simply use a video tag

 http://www.w3schools.com/html/html5_video.asp
   
 <video width="400" controls>
   <source src="mov_bbb.mp4" type="video/mp4">
   <source src="mov_bbb.ogg" type="video/ogg">
   Your browser does not support HTML5 video.
 </video>

Warning

On Android, >=2.3 is strongly recommended

 http://www.broken-links.com/2010/07/08/making-html5-video-work-on-android-phones/
Platform MP4 Support OGV Support
XO-1.5 X
Android 4.X X
iOS 8.X X

Record a video using the Webcam

Take a picture using the Webcam

Audio

Play sound ?

Recommendations

You should provide both .ogg and .mp3 files

Even if ogg is free, it’s not supported on all majors platforms.

Usage

You can use the audio tag

 https://www.w3.org/wiki/HTML/Elements/audio
 
 <audio controls
   src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.oga">
   Your user agent does not support the HTML5 Audio element.
 </audio>
 See http://createjs.com/SoundJS

Warning

 Volume is read-only on iOS.
 Chrome on Android does not support autoplay as advised by the specification.

Record sound using the microphone

Input/Touch