+1 on the facet
-Matthias
PS: can you add this to the wiki as well ? ;-)
On Tue, Jun 1, 2010 at 9:11 PM, Ali Ok <al...@aliok.com.tr> wrote:
> Hi again,
> I couldn't settle the fallback stuff, so I want to discuss it again.
> I noticed that a fallback facet may be better.
> If HTML5 video[1] is not supported on a browser, it will ignore this element
> and render its children:
> <video ....>
> <p>Your browser does not support Html5 video! This text is ignored on
> Html5 video enabled browsers and shown on not supported browsers.</p>
> </video>
> Respectively, Html5 video enabled browsers will ignore the children of
> <video> element (except <source>[2]).
> And this look like a good use-case of facets to me.
> If we limit fallback with two attributes, we will definitely restrict the
> users in coming up with their own solutions. With
> "actionOnNoHTML5VideoSupport" and "loadAlternatePlayerAction" properties,
> we're forcing user to write Javascript for playing the alternate video
> player.
> Let's say, we wrote some javascript function to activate alternate video
> player: activateFlashPlayer()
> Using attributes, our JSF XHTML will be something like:
> <script>
> function activateFlashPlayer(){
> // run flash video player (player.swf is down below)
> }
> </script>
> ...
> <hx:video loadAlternatePlayerAction="activateFlashPlayer()">
> ...
> <embed player.swf ....>.....</embed>
> and, which may output an Html page like this:
> <script>
> function activateFlashPlayer(){
> // run flash video player (player.swf below)
> }
> </script>
> ...
> <video ....>
> <script>
> activateFlashPlayer();
> </script>
> </video>
> ...
> <embed player.swf ....>.....</embed>
>
> On the other hand, using a facet, we'll have a JSF xhtml page like:
> <hx:video>
> <f:facet name="falback">
> <embed player.swf ....>.....</embed>
> </f:facet>
> </hx:video>
> which can output:
> <video ....>
> <embed player.swf ....>.....</embed>
> </video>
>>
>> <hx:video>
>>
>> => fallBack: does it need to be a facet ?
>
> A late answer, but that's why I think it needs to be a facet :)
> I don't like them much (find them not IDE-friendly), but what is the
> disadvantage of facet here? Why do you avoid using that?
> [1] http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#video
> [2] http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#the-source-element
> Thanks,
> Ali
> On Wed, May 26, 2010 at 3:42 PM, Matthias Wessendorf <mat...@apache.org>
> wrote:
>>
>> On Wed, May 26, 2010 at 2:38 PM, Ali Ok <al...@aliok.com.tr> wrote:
>> > Hi Matthias,
>> > I couldn't quite understand what you've meant.
>> > Do you mean, (ignore the bad naming)
>> > * having property named something like "actionOnNoHTML5VideoSupport" :
>> > "useFallBack" | "alert"
>> > * and having another property named something like
>> > which can have the JS activation code for some
>> > flash video player?
>>
>> that's right
>>
>> > Or do you mean automatic fallback to flash video player?
>> nope :-)
>>
>> > I've done some
>> > research about this before and I couldn't found any ASL or compatible
>> > licensed flash video player to distrubute with the project (I haven't
>> > done
>> > too much research since this seems not practical to me). Assuming there
>> > is
>> > one ASL-compatible flash video player somewhere, is it practical?
>> > Regards,
>> > Ali
>> > On Wed, May 26, 2010 at 3:10 PM, Matthias Wessendorf <mat...@apache.org>
>> > wrote:
>> >>
>> >> Hi Ali,
>> >>
>> >> looks good so far.
>> >>
>> >> One quick comment:
>> >>
>> >> -<hx:video>
>> >> => fallBack: does it need to be a facet ?
>> >> What about "alternatePlayer" and warning (or alert) ?
>> >>
>> >> -Matthias
>> >>
>> >> On Wed, May 19, 2010 at 10:30 PM, Ali Ok <al...@aliok.com.tr> wrote:
>> >> > Hi all,
>> >> > I've prepared some component prototypes, and your feedback is
>> >> > appreciated.
>> >> > There are 20+ components and I want to send them to discuss here, one
>> >> > by
>> >> > one; "to have a 'cleaner' separation of the discussion".
>> >> > Also, IMHO, it is better to post prototypes inline.
>> >> > ===============================
>> >> > ==========<hx:video>============
>> >> > ===============================
>> >> > REFS:
>> >> > [0] http://www.whatwg.org/specs/web-apps/current-work/#video
>> >> > [1] https://developer.mozilla.org/En/HTML/Element/Video
>> >> >
>> >> > EXTENDS:
>> >> > May extend a abstract component with hx:audio.
>> >> >
>> >> > specific ATTRIBUTES:
>> >> > preload can be:
>> >> > none: do not preload the media from the server
>> >> > metadata: fetch metadata (length, quality, etc.)
>> >> > (default)
>> >> > auto: load the data from the server, even if user doesnt
>> >> > play it
>> >> > showControls:
>> >> > true: browser's media controls are shown (default)
>> >> > false: controls are not shown unless page author provides
>> >> > one
>> >> > explicitly
>> >> > loop:
>> >> > true or false (default)
>> >> > poster:
>> >> > image to show when not playing or seeking
>> >> > width:
>> >> > width of the video
>> >> > height:
>> >> > height of the video
>> >> >
>> >> > FACETS:
>> >> > fallBack:
>> >> > content to display when HTML5 video is not supported.
>> >> > possible
>> >> > actions
>> >> > can be using a flash player as a fallback or displaying a
>> >> > message that displays this is not supported.
>> >> >
>> >> > NOTES:
>> >> > see <hx:mediaSource> and <hx:mediaSources>
>> >> > new <track> feature is not included, since there is no
>> >> > browser
>> >> > support yet (impossible to test). this feature can be added
>> >> > when a browser starts supporting it
>> >> > <!-- ---------------------------------------usage
>> >> > --------------------------------------------------- -->
>> >> > <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>
>> >> >
>> >> > <!-- expected HTML5 code -->
>> >> > <video src="someAddress/someFile.mkv" preload="metadata" autoplay
>> >> > loop
>> >> > controls poster="somePosterImage.jpg"
>> >> > width="600px" height="300px">
>> >> > <embed player.swf ....>.....</embed>
>> >> > </video>
>> >> >
>> >> >
>> >> >
>> >> > <!-- ---------------------------------------usage
>> >> > --------------------------------------------------- -->
>> >> > <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>
>> >> >
>> >> > <hx:mediaSource src="http://someaddress/someFile.ogg";
>> >> > contentType="video/ogg" codecs="avc1.42E01E" media="screen and
>> >> > (device-width: 800px)">
>> >> > <hx:mediaSource src="http://someaddress/some3DFile.ogg";
>> >> > media="3d-glasses">
>> >> >
>> >> > <!-- <hx:mediaSources> component, not <hx:mediaSource> -->
>> >> > <hx:mediaSources items="#{someBean.mediaInfoList}">
>> >> > </hx:video>
>> >> >
>> >> > <!-- expected HTML5 code for usage -->
>> >> > <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 <hx: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>
>> >> >
>> >> > ===============================
>> >> > =======<hx:mediaSource>=========
>> >> > ===============================
>> >> > REFS:
>> >> > [0]
>> >> >
>> >> >
>> >> > http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#the-source-element
>> >> > [1] https://developer.mozilla.org/En/HTML/Element/Source
>> >> > EXTENDS:
>> >> > --
>> >> > specific ATTRIBUTES:
>> >> > src:
>> >> > URL of the source.
>> >> > contentType:
>> >> > MIME content type of the source (ie:video/ogg).
>> >> > codecs:
>> >> > Codecs of the source (ie:'avc1.64001E, mp4a.40.2').
>> >> > media:
>> >> > media attribute: just like the @media in CSS.
>> >> >
>> >> >
>> >> > NOTES:
>> >> > see <hx:mediaSources>, <hx:audio> and <hx:video>
>> >> >
>> >> > <!-- -----------------------usage ---------------------------- -->
>> >> > <hx:mediaSource src="http://someaddress/someFile.ogg";
>> >> > contentType="video/ogg" codecs="avc1.42E01E" media="screen and
>> >> > (device-width: 800px)"/>
>> >> >
>> >> > <!-- expected HTML5 code for usage-->
>> >> > <source src='http://someaddress/someFile.ogg'
>> >> > contentType="video/ogg"
>> >> > codecs="avc1.42E01E" media="screen and (device-width: 800px)" />
>> >> >
>> >> >
>> >> > <!-- -----------------------usage ---------------------------- -->
>> >> > <hx:mediaSource src="http://someaddress/some3DFile.ogg";
>> >> > media="3d-glasses" />
>> >> >
>> >> > <!-- expected HTML5 code for usage-->
>> >> > <source src='someAddress/some3Dfile.ogg' media="3d-glasses"/>
>> >> >
>> >> > ===============================
>> >> > =======<hx:mediaSources>========
>> >> > ===============================
>> >> > REFS:
>> >> > [0]
>> >> >
>> >> >
>> >> > http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#the-source-element
>> >> > [1] https://developer.mozilla.org/En/HTML/Element/Source
>> >> > EXTENDS:
>> >> > --
>> >> > specific ATTRIBUTES:
>> >> > items:
>> >> > 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
>> >> > mediaSource.xhtml (w/o 's' at the end)
>> >> >
>> >> > NOTES:
>> >> > see mediaSource.xhtml, audio.xhtml and video.xhtml
>> >> > <!-- usage -->
>> >> > <hx:mediaSources items="#{audioBean.someAudioFileInfos}"/>
>> >> >
>> >> > <!-- expected HTML5 code-->
>> >> > <source src='someAddress/somefile.ogg' type='video/ogg;
>> >> > codecs="flac"' />
>> >> > <source src='http://someaddress/someFile.ogg' media="screen and
>> >> > (device-width: 800px)" />
>> >> > <source src='http://someaddress/someFile.ogg' media="3d-glasses"/>
>> >> >
>> >> > Regards,
>> >> > Ali
>> >> > --
>> >> > My Blog: http://blog.aliok.com.tr
>> >> > Twitter: http://twitter.com/aliok_tr
>> >> >
>> >> >
>> >>
>> >>
>> >>
>> >> --
>> >> Matthias Wessendorf
>> >>
>> >> blog: http://matthiaswessendorf.wordpress.com/
>> >> sessions: http://www.slideshare.net/mwessendorf
>> >> twitter: http://twitter.com/mwessendorf
>> >
>> >
>> >
>> > --
>> > My Blog: http://blog.aliok.com.tr
>> > Twitter: http://twitter.com/aliok_tr
>> >
>> >
>>
>>
>>
>> --
>> Matthias Wessendorf
>>
>> blog: http://matthiaswessendorf.wordpress.com/
>> sessions: http://www.slideshare.net/mwessendorf
>> twitter: http://twitter.com/mwessendorf
>
>
>
> --
> My Blog: http://blog.aliok.com.tr
> Twitter: http://twitter.com/aliok_tr
>
>
--
Matthias Wessendorf
blog: http://matthiaswessendorf.wordpress.com/
sessions: http://www.slideshare.net/mwessendorf
twitter: http://twitter.com/mwessendorf
