<!--
  ~ Licensed to the Apache Software Foundation (ASF) under one
  ~ or more contributor license agreements.  See the NOTICE file
  ~ distributed with this work for additional information
  ~ regarding copyright ownership.  The ASF licenses this file
  ~ to you under the Apache License, Version 2.0 (the
  ~ "License"); you may not use this file except in compliance
  ~ with the License.  You may obtain a copy of the License at
  ~
  ~    http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing,
  ~ software distributed under the License is distributed on an
  ~ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  ~ KIND, either express or implied.  See the License for the
  ~ specific language governing permissions and limitations
  ~ under the License.
  -->

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:composite="http://java.sun.com/jsf/composite"
      xmlns:hx="http://myfaces.apache.org/html5/html"
      xmlns:fx="http://myfaces.apache.org/html5/core">

<composite:interface>
    <composite:facet name="content" required="false"/>
    <composite:attribute name="facetName" required="true" />
    <composite:attribute name="iconName" required="true" />
    <composite:attribute name="supportedMessage" required="false" default="This feature is supported by this browser." />
    <composite:attribute name="unsupportedMessage" required="false" default="This feature is not supported by this browser." />
    <composite:attribute name="style" required="false" />
    <composite:attribute name="support" required="true" type="java.lang.Boolean" />
</composite:interface>


<composite:implementation>
    <h:outputStylesheet target="head" library="style" name="browserSupport.css" id="browserSupportStyle" />

    <hx:div styleClass="browserSupportInfo" style="#{cc.attrs.style}">
        <fx:effects additionalStyleClassToActivate="expandedBrowserSupportInfo"
                    event="mouseover" deactivationEvents="mouseout" duration="1s"/>

        <h:graphicImage library="image/browser" name="#{cc.attrs.iconName}" alt="#{cc.attrs.iconName}" 
                        styleClass="#{(cc.attrs.support) ? ( (not empty cc.facets[cc.attrs.facetName]) ? 'emphasizedBrowserIcon supportedBrowserIcon' : 'supportedBrowserIcon') : ( (not empty cc.facets[cc.attrs.facetName]) ? 'emphasizedBrowserIcon' : 'unSupportedBrowserIcon')}" />
        <br/>
        <hx:div styleClass="browserInfoContent">
            <h:panelGroup rendered="#{not empty cc.facets[cc.attrs.facetName]}">
                <composite:renderFacet name="#{cc.attrs.facetName}" />
            </h:panelGroup>
            <h:outputText value="#{cc.attrs.supportedMessage}" rendered="#{empty cc.facets[cc.attrs.facetName] and cc.attrs.support}" />
            <h:outputText value="#{cc.attrs.unsupportedMessage}" rendered="#{empty cc.facets[cc.attrs.facetName] and not cc.attrs.support}" />

            <fx:effects delay="0.9s"/>
        </hx:div>
    </hx:div>

</composite:implementation>
</html>