in myfaces-html5-core/src/main/java/org/apache/myfaces/html5/renderkit/output/SlideViewRenderer.java [54:129]
public void encodeBegin(FacesContext facesContext, UIComponent uiComponent) throws IOException {
super.encodeBegin(facesContext, uiComponent);
RendererUtils.checkParamValidity(facesContext, uiComponent, AbstractSlideView.class);
ResponseWriter writer = facesContext.getResponseWriter();
AbstractSlideView component = (AbstractSlideView) uiComponent;
String clientId = component.getClientId(facesContext);
String escapedClientId = Html5RendererUtils.escapeCssSelector(clientId);
writer.startElement(HTML5.STYLE_ELEM, component);
double left = component.getSlideLeft();
double width = component.getSlideWidth();
double height = component.getSlideHeight();
final double inactiveSlideScale = component.getInactiveSlideScale();
final String timingFunction = component.getTimingFunction();
final String duration = Html5RendererUtils.getTimeValue(component.getDuration());
final String delay = Html5RendererUtils.getTimeValue(component.getDelay());
StringBuilder builder = new StringBuilder();
new CssBuilder().selector(selector(HTML5.DIV_ELEM).id(escapedClientId).child(selector(HTML5.DIV_ELEM).clazz(Skin.SLIDE)).build())
.percentRule(CSS.WIDTH_PROP, width)
.percentRule(CSS.HEIGHT_PROP, height)
.rule("-webkit-transform", "scale(" + inactiveSlideScale +")")
.rule("-o-transform", "scale(" + inactiveSlideScale +")")
.rule("-moz-transform", "scale(" + inactiveSlideScale +")")
.append(builder);
new CssBuilder().selector(selector(HTML5.DIV_ELEM).id(escapedClientId).child(selector(HTML5.DIV_ELEM).clazz(Skin.SLIDE_TRANSITIONED)).build())
//once for webkit
.rule("-webkit-" + CSS.TRANSITION_PROPERTY_PROP ,"all")
.rule("-webkit-" + CSS.TRANSITION_DURATION_PROP , duration)
.rule("-webkit-" + CSS.TRANSITION_TIMING_FUNCTION_PROP, timingFunction)
.rule("-webkit-" + CSS.TRANSITION_DELAY_PROP, delay)
//and once for opera
.rule("-o-" + CSS.TRANSITION_PROPERTY_PROP ,"all")
.rule("-o-" + CSS.TRANSITION_DURATION_PROP, duration)
.rule("-o-" + CSS.TRANSITION_TIMING_FUNCTION_PROP, timingFunction)
.rule("-o-" + CSS.TRANSITION_DELAY_PROP, delay)
.append(builder);
new CssBuilder().selector(selector(HTML5.DIV_ELEM).id(escapedClientId).child(selector(HTML5.DIV_ELEM).clazz(Skin.SLIDE_PREVIOUS)).build())
.percentRule(CSS.LEFT_PROP, left - width)
.append(builder);
new CssBuilder().selector(selector(HTML5.DIV_ELEM).id(escapedClientId).child(selector(HTML5.DIV_ELEM).clazz(Skin.SLIDE_ACTIVE)).build())
.percentRule(CSS.LEFT_PROP, left)
.append(builder);
new CssBuilder().selector(selector(HTML5.DIV_ELEM).id(escapedClientId).child(selector(HTML5.DIV_ELEM).clazz(Skin.SLIDE_NEXT)).build())
.percentRule(CSS.LEFT_PROP, left + width)
.append(builder);
new CssBuilder().selector(selector(HTML5.DIV_ELEM).id(escapedClientId).child(selector(HTML5.DIV_ELEM).clazz(Skin.SLIDE_HIDDEN_LEFT)).build())
.percentRule(CSS.LEFT_PROP, left - width*2)
.append(builder);
new CssBuilder().selector(selector(HTML5.DIV_ELEM).id(escapedClientId).child(selector(HTML5.DIV_ELEM).clazz(Skin.SLIDE_HIDDEN_RIGHT)).build())
.percentRule(CSS.LEFT_PROP, left + width*2)
.append(builder);
writer.write(builder.toString());
writer.endElement(HTML5.STYLE_ELEM);
//write component html side
writer.startElement(HTML5.DIV_ELEM, uiComponent);
// write id
writer.writeAttribute(HTML5.ID_ATTR, component.getClientId(facesContext), null);
renderPassThruAttrsAndEvents(facesContext, uiComponent);
}