Jump to content

HTML5MediaLibraries: Difference between revisions

From Sugar Labs
Mohayon (talk | contribs)
mNo edit summary
Mohayon (talk | contribs)
mNo edit summary
 
(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