HTML and CSS Reference
In-Depth Information
<c:if test="#{cc.attrs.controls}">
<f:passThroughAttribute name="controls" value="true" />
</c:if>
</video>
</div>
</cc:implementation>
The benefit of this method is that you do not need a UIComponent class behind the component and you can
quickly make changes to how the
<video />
tag is outputted. The disadvantage of using this method is that the
Facelets view may end up getting polluted with logic that is better managed somewhere else.
Method two: Implementing a composite component root
The second method implements a composite component root that is a UIComponent class that sits behind the
component. In this class you can implement any kind of logic that you can think of. In Listing 8-7 you can see how to
specify the UIComponent that sits behind the composite component. The actual UIComponent behind the composite
component can be seen in Listing 8-8.
Listing 8-7.
The Component Component Root Is Specified as the componentType in the Interface of the
Composite Component
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="
http://www.w3.org/1999/xhtml
"
xmlns:cc="
http://xmlns.jcp.org/jsf/composite
"
xmlns:jsf="
http://xmlns.jcp.org/jsf
"
xmlns:c="
http://xmlns.jcp.org/jsp/jstl/core
"
>
<cc:interface
componentType="UIMediaComponent"
>
<!-- OMITTED FOR READABILITY //-->
</cc:interface>
<cc:implementation >
<div id="#{cc.clientId}">
<video jsf:id="#{cc.elementId} "
jsf:value="#{cc.attrs.value}"
crossorigin="#{cc.attrs.crossorigin}"
preload="#{cc.attrs.preload}"
mediagroup="#{cc.attrs.mediagroup}"
src="#{cc.attrs.value}">
</video>
</div>
</cc:implementation>
</html>
