<xsl:template match="/">
<!-- ============================== -->
<!-- HTML Document -->
<!-- ============================== -->
<html>
<head>
<script src="https://kit.fontawesome.com/7414123f18.js" crossorigin="anonymous"/>
<meta charset="UTF-8"/>
<meta property="og:image" content="https://bartneck.github.io/swiML/swiMLLogoGradientFacebook.png"/>
<meta property="og:image:type" content="image/png"/>
<meta property="og:image:width" content="1200"/>
<meta property="og:image:height" content="630"/>
<!-- Main CSS -->
<link href="https://bartneck.github.io/swiML/swiML.css" rel="stylesheet" type="text/css"/>
<!-- Google fonts used to load from google.-->
<!-- The fonts are currently loaded directly from local font files -->
<!-- This can be reomved as soon as we are comofrtable with this approach -->
<!--
<link rel="preconnect" href="https://fonts.googleapis.com"/>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/>
<link
href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800"
rel="stylesheet"/>
-->
<xsl:apply-templates select="sw:program/sw:layoutWidth"/>
<!-- Favicon icons -->
<link rel="shortcut icon" href="/swiML/favicon/favicon.ico"/>
<link rel="icon" sizes="16x16 32x32 64x64" href="/swiML/favicon/favicon.ico"/>
<link rel="icon" type="image/png" sizes="196x196" href="/swiML/favicon/favicon-192.png"/>
<link rel="icon" type="image/png" sizes="160x160" href="/swiML/favicon/favicon-160.png"/>
<link rel="icon" type="image/png" sizes="96x96" href="/swiML/favicon/favicon-96.png"/>
<link rel="icon" type="image/png" sizes="64x64" href="/swiML/favicon/favicon-64.png"/>
<link rel="icon" type="image/png" sizes="32x32" href="/swiML/favicon/favicon-32.png"/>
<link rel="icon" type="image/png" sizes="16x16" href="/swiML/favicon/favicon-16.png"/>
<link rel="apple-touch-icon" href="/swiML/favicon/favicon-57.png"/>
<link rel="apple-touch-icon" sizes="114x114" href="/swiML/favicon/favicon-114.png"/>
<link rel="apple-touch-icon" sizes="72x72" href="/swiML/favicon/favicon-72.png"/>
<link rel="apple-touch-icon" sizes="144x144" href="/swiML/favicon/favicon-144.png"/>
<link rel="apple-touch-icon" sizes="60x60" href="/swiML/favicon/favicon-60.png"/>
<link rel="apple-touch-icon" sizes="120x120" href="/swiML/favicon/favicon-120.png"/>
<link rel="apple-touch-icon" sizes="76x76" href="/swiML/favicon/favicon-76.png"/>
<link rel="apple-touch-icon" sizes="152x152" href="/swiML/favicon/favicon-152.png"/>
<link rel="apple-touch-icon" sizes="180x180" href="/swiML/favicon/favicon-180.png"/>
<meta name="msapplication-TileColor" content="#FFFFFF"/>
<meta name="msapplication-TileImage" content="/swiML/favicon/favicon-144.png"/>
<meta name="msapplication-config" content="/swiML/favicon/browserconfig.xml"/>
<title>
<xsl:value-of select="sw:program/sw:title"/>
</title>
</head>
<body>
<xsl:choose>
<xsl:when test="sw:program/sw:hideIntro = 'true'"/>
<xsl:otherwise>
<div class="intro">
<h1>
<xsl:value-of select="sw:program/sw:title"/>
</h1>
<xsl:apply-templates select="sw:program/sw:author"/>
<p class="description">
<xsl:value-of select="sw:program/sw:programDescription"/>
</p>
<ul>
<li>
<span class="semiBoldTypeFace">Date:</span>
<xsl:value-of select="format-date(sw:program/sw:creationDate, '[D01] [MNn] [Y0001]')"/>
</li>
<li>
<span class="semiBoldTypeFace">Pool Size:</span>
<xsl:value-of select="myData:number(sw:program/sw:poolLength)"/>
</li>
<li>
<span class="semiBoldTypeFace">Units:</span>
<xsl:value-of select="sw:program/sw:lengthUnit"/>
</li>
<li>
<span class="semiBoldTypeFace">Length:</span>
<xsl:value-of select="myData:number(myData:showLength(sw:program))"/>
<xsl:text> </xsl:text>
<xsl:value-of select="sw:program/sw:lengthUnit"/>
<xsl:text> / </xsl:text>
<xsl:value-of select="myData:number(myData:showLength(sw:program) div (sw:program/sw:poolLength))"/>
<xsl:text> Laps</xsl:text>
</li>
</ul>
</div>
</xsl:otherwise>
</xsl:choose>
<!-- The recursive instructions -->
<div class="program">
<xsl:apply-templates select="sw:program/sw:instruction"/>
<!--<xsl:value-of select="$repLengths"/>
c
<xsl:value-of select="$maxRepLengths"/>
c
<xsl:value-of select="$simpLengths"/>
c
<xsl:value-of select="$maxSimpLengths"/>
<xsl:value-of select="$contLengths"/>
c
<xsl:value-of select="$maxContLengths"/>-->
</div>
<!-- footer -->
<xsl:choose>
<xsl:when test="sw:program/sw:hideIntro = 'true'"/>
<xsl:otherwise>
<div class="bottom">
<div class="footnote">made with: </div>
<div class="logo">
<a href="https://github.com/bartneck/swiML">
<svg class="logoSvg" id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1219.33 460.35">
<defs>
<style>
.cls-1 {
fill: #231f20;
}</style>
</defs>
<path class="cls-1" d="M209,360.8c0,58.3-51.7,99.55-104.5,99.55C39.6,460.35,0,419.65,0,362.45c0-14.3,12.1-26.4,26.4-26.4h39.6c18.7,0,26.4,11.55,26.4,25.85,0,6.6,5.5,12.1,12.1,12.1s12.1-5.5,12.1-12.1v-9.35c0-17.6-6.05-25.85-24.75-33.55l-22.55-9.9C41.25,297,0,279.95,0,225.5v-20.35c0-58.3,44.55-101.75,104.5-101.75,66.55,0,104.5,45.65,104.5,97.35,0,14.3-12.1,26.4-26.4,26.4h-39.6c-15.95,0-26.4-7.7-26.4-25.3,0-6.6-5.5-12.1-12.1-12.1s-12.1,5.5-12.1,12.1v7.7c0,17.05,7.7,27.5,24.2,34.65l23.1,9.9c29.15,12.65,69.3,29.15,69.3,83.6v23.1Z"/>
<path class="cls-1" d="M556.59,354.2c0,72.05-51.7,106.15-96.25,106.15-19.25,0-35.75-3.3-49.5-12.65l-7.15-4.4c-3.85-2.75-5.5-4.4-9.9-4.4-3.3,0-5.5,1.1-9.9,4.4l-6.6,4.4c-13.75,9.35-30.8,12.65-49.5,12.65-52.25,0-96.8-40.7-96.8-106.15V133.65c0-14.3,12.1-26.4,26.4-26.4h39.6c14.3,0,26.4,13.75,26.4,26.4v233.75c0,6.6,5.5,12.1,12.1,12.1s12.1-5.5,12.1-12.1V133.65c0-14.3,12.1-26.4,26.4-26.4h39.6c14.3,0,26.4,13.75,26.4,26.4v233.75c0,6.6,5.5,12.1,12.1,12.1s12.1-5.5,12.1-12.1V133.65c0-14.3,12.1-26.4,26.4-26.4h40.15c14.3,0,25.85,12.1,25.85,26.4v220.55Z"/>
<path class="cls-1" d="M672.64,58.85c0,14.3-12.1,26.4-26.4,26.4h-39.6c-14.3,0-26.4-12.1-26.4-26.4V29.15c0-14.3,12.1-26.4,26.4-26.4h39.6c14.3,0,26.4,13.75,26.4,26.4v29.7Zm0,371.25c0,14.3-12.1,26.4-26.4,26.4h-39.6c-14.3,0-26.4-12.1-26.4-26.4V133.65c0-14.3,12.1-26.4,26.4-26.4h39.6c14.3,0,26.4,13.75,26.4,26.4V430.1Z"/>
<path class="cls-1" d="M1033.99,116.05V430.1c0,14.3-12.1,26.4-26.4,26.4h-43.45c-14.3,0-26.4-13.75-26.4-26.4V105.05c0-6.6-5.5-12.1-12.1-12.1s-12.1,5.5-12.1,12.1V430.1c0,14.3-12.1,26.4-26.4,26.4h-43.45c-14.3,0-26.4-13.75-26.4-26.4V105.05c0-6.6-5.5-12.1-12.1-12.1s-12.1,5.5-12.1,12.1V430.1c0,14.3-12.1,26.4-26.4,26.4h-43.45c-14.3,0-26.4-12.1-26.4-26.4V31.35c0-17.05,13.2-31.35,32.45-31.35,6.6,0,14.3,2.75,19.25,4.95l2.75,1.1c6.05,2.2,8.8,3.85,15.95,3.85,6.05,0,14.85-2.75,22-4.95,7.15-2.2,19.25-4.95,32.45-4.95s23.1,2.75,31.9,5.5c7.15,2.2,15.4,4.4,20.35,4.4s13.2-2.2,20.35-4.4c8.8-2.75,21.45-5.5,34.65-5.5,73.7,0,105.05,43.45,105.05,116.05Z"/>
<path class="cls-1" d="M1154.43,347.6c0,7.15,4.95,12.65,12.1,12.65h26.4c14.3,0,26.4,12.1,26.4,26.4v43.45c0,14.3-12.1,26.4-26.4,26.4h-108.35c-14.3,0-26.4-12.1-26.4-26.4V29.15c0-14.3,12.1-26.4,26.4-26.4h43.45c14.3,0,26.4,12.1,26.4,26.4V347.6Z"/>
</svg>
</a>
</div>
</div>
</xsl:otherwise>
</xsl:choose>
</body>
</html>
</xsl:template>
|