lexonomy_formatting/view.xsl

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:output method="html"/>
    
    <!-- ********************************
         Javascript logic goes here
         Please dont polute xslt with it
         ******************************** -->
         
    <xsl:variable name="global_script">
    <script type='text/javascript'>
        var more_txt = "▼ more";
        var less_txt = "▲ less";
        $(document).ready(function() {
            $(".morelessbutton").click(function() {
                var examples_div = $(this).parent().parent().find('.hideable').first();
                console.log(examples_div.is(":visible"));
                if(examples_div.is(":hidden")) {
                    $(this).text(less_txt);
                } else {
                    $(this).text(more_txt);
                }
                examples_div.slideToggle();
            });
        });
    </script>
    </xsl:variable>
    
    <!-- ********************************
         Here go css styles
         Please dont polute xslt with it
         ******************************** -->
         
    <xsl:variable name="global_style">
    <style type="text/css">
        :root {
            --light-gray: #999999;
            --dark-gray: #666666
        }

        .xslt-clanek {
            font-family: Verdana, sans-serif; 
            font-size: 1rem; 
            line-height: 1.5em;
        }
        .xslt-iztocnica {
            font-size: 1.15em; 
            color: #cc3366; 
            font-weight: bold;
        }
        .xslt-besedna-vrsta {
            color: var(--dark-gray); 
            font-style: italic;
        }
        .xslt-pomen-top {
            border-top: 1px dotted var(--light-gray); 
            padding-top: 0.5em; 
            margin-top: 0.5em;
        }
        .xslt-pomen-number {
            float: left; 
            margin-left: 0.5em; 
            color: var(--light-gray); 
            font-weight: bold;
        }
        
    </style>
    </xsl:variable>    
    
    <!-- ********************************
        Here are all of xslt rules
        Please dont polute xslt with it
        ******************************** -->
    
    <!-- root tag, includes global script and tag -->
    
    <xsl:template match="clanek">
        <xsl:copy-of select="$global_script" />
        <xsl:copy-of select="$global_style" />
        
        <div class="xslt-clanek">
            <xsl:apply-templates/>
        </div>
    </xsl:template>

    <xsl:template match="glava">
        <div>
            <xsl:apply-templates/>
        </div>
    </xsl:template>

    <xsl:template match="iztocnica">
        <xsl:text xml:space="preserve"> </xsl:text>
        <span class="xslt-iztocnica">
            <xsl:apply-templates/>
        </span>
        <xsl:text xml:space="preserve"> </xsl:text>
    </xsl:template>

    <xsl:template match="besedna_vrsta">
        <xsl:text xml:space="preserve"> </xsl:text>
        <span class="xslt-besedna-vrsta">
            <xsl:apply-templates/>
        </span>
        <xsl:text xml:space="preserve"> </xsl:text>
    </xsl:template>
    
    <xsl:template match="oblika"><xsl:apply-templates/></xsl:template>
    <xsl:template match="zaglavje"><xsl:apply-templates/></xsl:template>
    <xsl:template match="zapis"/>
    <xsl:template match="korpusi"/>
    <xsl:template match="korpus"/>
    <xsl:template match="frek_lema"/>
    <xsl:template match="opombe"/>
    
    <!-- END of HEAD (glava), go to BODY (geslo) -->
    
    <xsl:template match="geslo"><xsl:apply-templates/></xsl:template>

    <xsl:template match="pomen">
        <div class="xslt-pomen-top">
            <div class="xslt-pomen-number">
                <xsl:number />
            </div>
            <div style="margin-left: 2em;">
                <xsl:apply-templates select="podpomen | indikator | oznaka | pomenska_shema"/>
                <xsl:choose>
                    <xsl:when test="count(../pomen)&gt;1 and skladenjske_skupine//text()">
                        <div style="padding: 0.5em 0;">
                            <a class="morelessbutton"  href="javascript:void(null)">▼ more</a>
                        </div>
                        <div class="hideable" style="display: none">
                            <xsl:apply-templates select="skladenjske_skupine"/>
                        </div>
                    </xsl:when>
                    <xsl:otherwise>
                        <xsl:apply-templates select="skladenjske_skupine"/>
                    </xsl:otherwise>
                </xsl:choose>
            </div>
            <div style="clear: left;"></div>
        </div>
    </xsl:template>

    <xsl:template match="podpomen">
        <xsl:variable name="pomenNum">
            <xsl:number count="pomen" level="any"/>
        </xsl:variable>
    
        <div style="margin-bottom: 0.5em;">
            <xsl:value-of select="$pomenNum"/>.<xsl:number/>
            <xsl:apply-templates/>
        </div>
    </xsl:template>

    <xsl:template match="skladenjska_struktura">
        <div style="margin: 0.5em 0; border-left: 8px solid #eeeeee; padding: 0 0 0 0.75em;">
            <xsl:apply-templates/>
        </div>
    </xsl:template>
    
    <xsl:template match="kolokacija | r_kolokacija">
        <xsl:text xml:space="preserve"> </xsl:text>
        <span style="color: #cc3366;">
            <xsl:apply-templates/>
        </span>
        <xsl:text xml:space="preserve"> </xsl:text>
    </xsl:template>
    
    <xsl:template match="kolokacije//p | kolokacije//i">
        <xsl:text xml:space="preserve"> </xsl:text>
        <xsl:apply-templates/>
    </xsl:template>
    
    <xsl:template match="kolokacije//ks">
        <xsl:text xml:space="preserve"> (</xsl:text>
        <xsl:apply-templates/>
        <xsl:text xml:space="preserve">) </xsl:text>
    </xsl:template>
    
    <xsl:template match="k[not(position()=last())]">
        <xsl:apply-templates/>
        <xsl:text xml:space="preserve">, </xsl:text>
    </xsl:template>
    
    <xsl:template match="indikator | oznaka">
        <xsl:text xml:space="preserve"> </xsl:text>
        <span style="color: #999999; font-style: italic; text-transform: uppercase">
            <xsl:apply-templates/>
        </span>
        <xsl:text xml:space="preserve"> </xsl:text>
    </xsl:template>
    
    <xsl:template match="pomenska_shema"/>
    <xsl:template match="definicija1"/>
    <xsl:template match="definicija2"/>
    
    <xsl:template match="struktura"/>
    
   <xsl:template match="zgledi">
        <div style="margin: 0.5em 0;">
            <xsl:apply-templates/>
        </div>
    </xsl:template>
    <xsl:template match="zgled[not(parent::vecjez)]">
        <div>
            <div style="float: left; margin-left: 0.5em; color: #999999; font-weight: bold;">
                »
            </div>
            <div style="margin-left: 2em;">
                <span style="color: #666666; font-weight: bold;">
                    <xsl:apply-templates/>
                </span>
            </div>
            <div style="clear: left;"></div>
        </div>
    </xsl:template>
     <xsl:template match="zgled//*">
        <xsl:text xml:space="preserve"> </xsl:text>
        <xsl:apply-templates/>
        <xsl:text xml:space="preserve"> </xsl:text>
    </xsl:template>
     
    
    
  </xsl:stylesheet>