Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Name

Required?

Values

Description

items

required

EL

binding of a collection which has elements of types having these methods:

  • public String getSrc()
  • public String getContentType()
  • public String getMedia()
  • public String getCodecs()
    (ie. Collection<org.apache.myfaces.html5.media.MediaSourceInfo>)
    'src', 'contentType', 'media' and 'codecs' are explained in <hx<fx:mediaSource> above.
Notes:

...

Code Block
langxml
titleusage: no <hx<fx:mediaSource>
<hx:video value="#{videoBean.someVideoFileURL}" preload="metadata"
	 poster="somePosterImage.jpg"
	 width="600px" height="300px"
	 autoplay="true" loop="true" showControls="true" >
  <f:facet name="fallBack">
	 <embed player.swf ....>.....</embed>
	 <!-- SOME FALLBACK MECHANISM TO PLAY THE FILE (FLASH may be). or alerting the user about HTML5 video support.  -->
  </f:facet>
</hx:video>

...

Code Block
langxml
titleusage with <hx<fx:mediaSource>
<hx:video preload="none" 
	 autoplay="false" loop="false" showControls="false"
	 poster="#{videoBean.posterImage}">

  <f:facet name="fallBack">
	 Your browser does not support HTML5 video.
  </f:facet>
  
  <fx:mediaSource src="http://someaddress/someFile.ogg" contentType="video/ogg" codecs="avc1.42E01E" media="screen and (device-width: 800px)">
  <fx:mediaSource src="http://someaddress/some3DFile.ogg" media="3d-glasses">

  <!-- <hx<fx:mediaSources> component, not <hx<fx:mediaSource> -->
  <fx:mediaSources items="#{someBean.mediaInfoList}">      
</hx:video>
Code Block
langxml
titleexpected HTML5 code
<video preload="none" poster="somePosterImage.jpg" controls="false" autoplay="false">
  Your browser does not support HTML5 video.
  <source src='http://someaddress/someFile.ogg' Type='video/ogg; codecs="avc1.42E01E"' media="screen and (device-width: 800px)" />
  <source src='someAddress/some3Dfile.ogg' media="3d-glasses"/>
  
  <!-- elements below are generated with <hxfx:mediaSources> -->
  <source src='video.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' media="screen">
  <source src='video.mp4' type='video/mp4; codecs="avc1.58A01E, mp4a.40.2"' media="3d-glasses">
  <source src='video.mp4' type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"'>
  <source src='video.mp4' type='video/mp4; codecs="avc1.64001E, mp4a.40.2"'>
  <source src='video.mp4' type='video/mp4; codecs="mp4v.20.8, mp4a.40.2"'>
</video>

...