<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
                xmlns:tei="http://www.tei-c.org/ns/1.0" 
                xmlns:ct="http://www.comhartaighde.com/ns/1.0" 
                exclude-result-prefixes="tei ct"
                version="1.0">


<xsl:template match="alt/téacs/corp/corpAilt/figiúr">
    <style>
        .multimedia picture { display: block; text-align: center; margin-left: 1.4rem; }
        .multimedia img { max-width: 400px; }
        
        @media screen and (max-width: 585px) {
            .multimedia picture { margin-left: 0; }
            .multimedia img { max-width: 100%; }
        }
    </style>
    <xsl:element name="div">
        <xsl:attribute name="id">
            <xsl:text>f</xsl:text>
            <xsl:number/>
        </xsl:attribute>
        <xsl:attribute name="data-id">
            <xsl:text>f</xsl:text>
            <xsl:number/>
        </xsl:attribute>
        <xsl:attribute name="class">
            <xsl:text>multimedia</xsl:text>
        </xsl:attribute>
            <xsl:element name="a">
                <xsl:attribute name="class">
                    <xsl:text>fancybox</xsl:text>
                </xsl:attribute>
                <xsl:attribute name="href">
                    <xsl:value-of select="grafaic[@cuspóir='high-res']/@url" />
                </xsl:attribute>
                    <picture>
                        <xsl:comment>[if IE 9]&gt;&lt;video style="display: none;"&gt;&lt;![endif]</xsl:comment>
                        <xsl:element name="source">
                            <xsl:attribute name="srcset">
                                <xsl:value-of select="grafaic[@cuspóir='mobile-1x']/@url" />
                                <xsl:text>, </xsl:text>
                                <xsl:value-of select="grafaic[@cuspóir='mobile-2x']/@url" />
                                <xsl:text> 2x</xsl:text>
                            </xsl:attribute>
                            <xsl:attribute name="media">
                                <xsl:text>(max-width: 770px)</xsl:text>
                            </xsl:attribute>
                        </xsl:element>
                        <xsl:comment>[if IE 9]&gt;&lt;/video&gt;&lt;![endif]</xsl:comment>
                        <xsl:element name="img">
                            <xsl:attribute name="srcset">
                                <xsl:value-of select="grafaic[@cuspóir='large-1x']/@url" />
                                <xsl:text>, </xsl:text>
                                <xsl:value-of select="grafaic[@cuspóir='large-2x']/@url" />
                                <xsl:text> 2x</xsl:text>
                            </xsl:attribute>
                            <xsl:attribute name="alt">
                                <xsl:text>Figiúr</xsl:text>
                            </xsl:attribute>
                        </xsl:element>
                    </picture>
            </xsl:element>
            <xsl:if test="ceann|curSíos">
                <xsl:element name="div">
                    <xsl:attribute name="class">
                        <xsl:text>caption</xsl:text>
                    </xsl:attribute>
                        <xsl:for-each select="ceann">
                            <h4><xsl:apply-templates /></h4>
                        </xsl:for-each>
                        <xsl:for-each select="curSíos">
                            <p><xsl:apply-templates /></p>
                        </xsl:for-each>
                </xsl:element>
            </xsl:if>
    </xsl:element>
</xsl:template>    
    
    
<xsl:template match="alt/téacs/corp/corpAilt/fuaim"> 
    <xsl:element name="div">
        <xsl:attribute name="id">
            <xsl:text>m</xsl:text>
            <xsl:number/>
        </xsl:attribute>
        <xsl:attribute name="data-id">
            <xsl:text>m</xsl:text>
            <xsl:number/>
        </xsl:attribute>
        <xsl:attribute name="class">multimedia</xsl:attribute>
            <xsl:element name="div">
                <xsl:attribute name="id">
                    <xsl:text>jquery_jplayer_</xsl:text>
                    <xsl:number/>
                </xsl:attribute>
                <xsl:attribute name="class">jp-jplayer</xsl:attribute>
                <xsl:comment> </xsl:comment>
            </xsl:element>
            <xsl:element name="div">
                <xsl:attribute name="id">
                    <xsl:text>jp_container_</xsl:text>
                    <xsl:number/>
                </xsl:attribute>
                <xsl:attribute name="class">jp-audio</xsl:attribute>
                <xsl:attribute name="role">application</xsl:attribute>
                <xsl:attribute name="aria-label">media player</xsl:attribute>
                    <div class="jp-type-single">
                        <div class="jp-gui jp-interface">
                          <div class="jp-controls-holder">
                            <div class="jp-controls">
                              <button class="jp-play" role="button" tabindex="0">seinn</button>
                            </div>
                            <div class="jp-progress">
                              <div class="jp-seek-bar">
                                <div class="jp-play-bar"><xsl:comment> </xsl:comment></div>
                              </div>
                            </div>
                            <div class="jp-current-time" role="timer" aria-label="time">&#160;</div>
                            <div class="jp-duration" role="timer" aria-label="duration">&#160;</div>
                          </div>
                        </div>
                        <div class="jp-no-solution">
                          <span>Ár leithscéal</span>
                          Ar an drochuair, teastaíonn brabhsálaí níos nua-aimseartha chun an comhad seo a sheinnt. Moltar duit leagan níos déanaí de <a target="_blank" href="http://www.mozilla.org/en-US/firefox/new/">Firefox</a>, <a target="_blank" href="http://www.microsoft.com/en-us/download/internet-explorer.aspx">Internet Explorer</a>, <a target="_blank" href="http://www.google.com/chrome">Chrome</a>, <a target="_blank" href="http://www.opera.com">Opera</a>, nó brabhsálaí eile a shuiteáil ar do ríomhaire.
                        </div>
                    </div>
            </xsl:element>
            <xsl:if test="ceann|curSíos">
                <xsl:element name="div">
                    <xsl:attribute name="class">
                        <xsl:text>caption</xsl:text>
                    </xsl:attribute>
                        <xsl:for-each select="ceann">
                            <h4><xsl:apply-templates /></h4>
                        </xsl:for-each>
                        <xsl:for-each select="curSíos">
                            <p><xsl:apply-templates /></p>
                        </xsl:for-each>
                </xsl:element>
            </xsl:if>
    </xsl:element>
</xsl:template>

<xsl:template match="alt/téacs/corp/corpAilt/físeán">
    <style>
        .multimedia--video, .multimedia--video video { width: 100%; }
        .multimedia--video video { margin-bottom: 1rem }
    </style>
    <xsl:element name="div">
        <xsl:attribute name="id">
            <xsl:text>mv</xsl:text>
            <xsl:number/>
        </xsl:attribute>
        <xsl:attribute name="data-id">
            <xsl:text>mv</xsl:text>
            <xsl:number/>
        </xsl:attribute>
        <xsl:attribute name="class">multimedia multimedia--video</xsl:attribute>
        <xsl:element name="video">
            <xsl:if test="./@clúdach">
                <xsl:attribute name="poster">
                    <xsl:value-of select="./@clúdach" />
                </xsl:attribute>
            </xsl:if>
            <xsl:attribute name="playsinline">true</xsl:attribute>
            <xsl:attribute name="controls">true</xsl:attribute>
            <xsl:apply-templates select="comhad" />
        </xsl:element>
        <xsl:if test="ceann|curSíos">
            <xsl:element name="div">
                <xsl:attribute name="class">
                    <xsl:text>caption</xsl:text>
                </xsl:attribute>
                <xsl:for-each select="ceann">
                    <h4><xsl:apply-templates /></h4>
                </xsl:for-each>
                <xsl:for-each select="curSíos">
                    <p><xsl:apply-templates /></p>
                </xsl:for-each>
            </xsl:element>
        </xsl:if>
    </xsl:element>
</xsl:template>

<xsl:template match="alt/téacs/corp/corpAilt/físeán/comhad">
    <xsl:element name="source">
        <xsl:attribute name="src">
            <xsl:value-of select="./@url" />
        </xsl:attribute>
        <xsl:attribute name="type">
            <xsl:value-of select="./@mimeType" />
        </xsl:attribute>
    </xsl:element>
</xsl:template>


</xsl:stylesheet>