<?xml version="1.0" encoding="utf-8"?>
<!--
OU GALLERIES

Transforms gallery asset XML into a dynamic gallery on the web page. 
Type of gallery is determined by page property.

Dependencies: 
- ou:pcfparams (See kitchensink functions.xsl)
- $domain  	<xsl:param name="domain" select="substring($ou:httproot,1,string-length($ou:httproot)-1)" /> 				

Contributors: Your Name Here
Last Updated: Enter Date Here
-->
<!DOCTYPE xsl:stylesheet SYSTEM "http://commons.omniupdate.com/dtd/standard.dtd">
<xsl:stylesheet version="3.0" 
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:xs="http://www.w3.org/2001/XMLSchema"
    xmlns:ou="http://omniupdate.com/XSL/Variables"
    xmlns:fn="http://omniupdate.com/XSL/Functions"
    xmlns:ouc="http://omniupdate.com/XSL/Variables"
    exclude-result-prefixes="ou xsl xs fn ouc">

<!--	
	The following template matches the LDP gallery nodes and outputs the proper HTML Code based on a specified parameter. 
	This will work with existing apply-templates. 
-->
<xsl:template match="gallery">	
	<xsl:param name="gallery-type" select="ou:pcf-param('gallery-type')" />
	
	<xsl:variable name="gallery-id" select="@asset_id"/>
	<xsl:variable name="speed" select="ou:get-adv(advanced,'speed')"/>
	<xsl:variable name="auto" select="ou:get-adv(advanced,'auto')"/>
	<xsl:choose>
		<xsl:when test="$gallery-type = 'con-home' or $gallery-type = 'omak-home' or $gallery-type = 'foun-home'">
			<div class="slider-hold">
				<ul>
					<xsl:attribute name="class">
						<xsl:choose>
							<xsl:when test="$gallery-type = 'con-home'">
								<xsl:value-of select="'bxslider-home custom-animation'"/>
							</xsl:when>
							<xsl:when test="$gallery-type = 'foun-home'">
								<xsl:value-of select="'bxslider-home'"/>
							</xsl:when>
							<xsl:when test="$gallery-type = 'omak-home'">
								<xsl:value-of select="'bxslider-home3'"/>
							</xsl:when>
							<xsl:otherwise></xsl:otherwise>
						</xsl:choose>
					</xsl:attribute>
					<xsl:attribute name="speed">
						<xsl:if test="$speed != 'false'">
							<xsl:value-of select="$speed"/>
						</xsl:if>
					</xsl:attribute>
					<xsl:attribute name="auto">
						<xsl:value-of select="$auto"/>
					</xsl:attribute>
					<xsl:for-each select="images/image">
						<xsl:variable name="pos" select="position()"/>
						<li class="{if ($pos = 1) then	'pt-page-current' else ''}" style="background-image: url({@url});">
							<div class="pre-info">
								<xsl:attribute name="class">
									<xsl:choose>
										<xsl:when test="$gallery-type = 'con-home' or $gallery-type = 'foun-home'">
											<xsl:value-of select="'pre-info'"/>
										</xsl:when>
										<xsl:when test="$gallery-type = 'omak-home'">
											<xsl:value-of select="'container'"/>
										</xsl:when>
										<xsl:otherwise></xsl:otherwise>
									</xsl:choose>
								</xsl:attribute>
								<div class="info">
									<h3><xsl:value-of select="title"/></h3>
									<p><xsl:value-of select="description"/></p>
									<xsl:if test="link != ''">
										<a class="btn btn-white" href="{link}"><xsl:value-of select="caption"/></a>
									</xsl:if>
								</div>
							</div>
						</li>
					</xsl:for-each>
				</ul>
			</div>
		</xsl:when>
		<xsl:when test="$gallery-type = 'athletics-home'">
			<div class="slider-hold">
				<ul class="bxslider-home4">
					<xsl:attribute name="speed">
						<xsl:if test="$speed != 'false'">
							<xsl:value-of select="$speed"/>
						</xsl:if>
					</xsl:attribute>
					<xsl:attribute name="auto">
						<xsl:value-of select="$auto"/>
					</xsl:attribute>
					<xsl:for-each select="images/image">
						<xsl:variable name="pos" select="position()"/>
						<li style="background-image: url({@url});">
						</li>
					</xsl:for-each>
				</ul>
				<div class="ah-holder">
					<ul class="bxslider-home4 aa">
						<xsl:attribute name="speed">
							<xsl:if test="$speed != 'false'">
								<xsl:value-of select="$speed"/>
							</xsl:if>
						</xsl:attribute>
						<xsl:attribute name="auto">
							<xsl:value-of select="$auto"/>
						</xsl:attribute>
						<xsl:for-each select="images/image">
							<li>
							<div class="container">
								<div class="info">
									<div class="inset">
										<h2><xsl:value-of select="title"/></h2>
										<p><xsl:value-of select="description"/></p>
										<xsl:if test="link != ''">
											<a class="btn btn-white" href="{link}"><xsl:value-of select="caption"/></a>
										</xsl:if>
									</div>
								</div>
							</div>
							</li>
						</xsl:for-each>
					</ul>
				</div>
			</div>
		</xsl:when>
		<xsl:when test="$gallery-type = 'con-slider'">
			<div class="con-slider">
				<ul class="bxslider">
					<xsl:attribute name="speed">
						<xsl:if test="$speed != 'false'">
							<xsl:value-of select="$speed"/>
						</xsl:if>
					</xsl:attribute>
					<xsl:attribute name="auto">
						<xsl:value-of select="$auto"/>
					</xsl:attribute>
					<xsl:for-each select="images/image">
						<li style="background-image: url({@url});">
							<div class="text-caption">
								<h3><xsl:value-of select="title"/></h3>
								<p><xsl:value-of select="description"/></p>
							</div>
						</li>
					</xsl:for-each>
				</ul>
			</div>
		</xsl:when>
		
		<xsl:when test="$gallery-type = 'fancy-box'">	
			<div class="gallery">
				<div class="row">
					<xsl:for-each select="images/image">
						<div class="col-md-4 col-sm-6">
							<a data-fancybox-group="group{$gallery-id}" title="{./description}" href="{@url}">
								<img src="{./thumbnail/@url}" alt="{./title}" />
							</a>
						</div>
					</xsl:for-each>
				</div>
			</div>
		</xsl:when>
	
	
	
	<!-- optionally, set a fallback output -->
	<xsl:otherwise>
		<xsl:comment>Undefined parameter for gallery match.</xsl:comment>
	</xsl:otherwise>
	
	</xsl:choose>
	
</xsl:template>

<!--

	Gallery Headcode
	
	To use, include in the appropriate area of the page (after jQuery is loaded).
	You can conditionally call this function as such: 
	
	<xsl:if test="content/descendant::gallery"> 
		<xsl:copy-of select="ou:gallery-headcode($gallery-type)"/>
	</xsl:if>	

-->
<!-- optionally, remove {$domain} -->
<xsl:function name="ou:gallery-headcode">
	<xsl:param name="gallery-type" />
	
	<xsl:choose>		
		<xsl:when test="$gallery-type = 'bx-slider'">
			
			<script src="{$domain}/_resources/galleries/bx-slider/jquery.bxslider.min.js"></script>
			<link href="{$domain}/_resources/galleries/bx-slider/jquery.bxslider.css" rel="stylesheet" />
			
			<script type="text/javascript">
				var speedval = ($('.bxslider').attr("speed")) ? parseInt($('.bxslider').attr("speed"),10) : 1000;
				var autoplay = ($('.bxslider').attr("auto")) ? $('.bxslider').attr("auto") === "true" : false;
				$(document).ready(function(){
					$('.bx-slider').bx-slider({
						mode: 'fade',
						captions: true,
						speed: speedval,
						auto:autoplay
					});
				});	
			</script>
			
		</xsl:when>
		
		<xsl:when test="$gallery-type = 'fancy-box'">
			<link rel="stylesheet" href="{$domain}/_resources/galleries/bootstrap-thumbnails.css" media="screen" /> 
			<link rel="stylesheet" type="text/css" href="{$domain}/_resources/galleries/fancy-box/jquery.fancybox.css" media="screen" />
			<script type="text/javascript" src="{$domain}/_resources/galleries/fancy-box/jquery.fancybox.pack.js"></script>
			<script type="text/javascript">
				$(document).ready(function() {
					$(".fancybox-button").fancybox({
						prevEffect		: 'none',
						nextEffect		: 'none',
						closeBtn		: false,
						helpers		: {
							title	: { type : 'inside' },
							buttons	: {}
						}
					});
				});
			</script>
		</xsl:when>
		
	</xsl:choose>

	
</xsl:function>
	<!-- *** FUNCTIONS *** -->
	<!-- Function that parses advanced field for an attribute, and returns the value.  If no value is found, returns 'false'. -->
	<xsl:function name="ou:get-adv">
		<xsl:param name="adv"/>
		<xsl:param name="key"/>
		<xsl:choose>
			<xsl:when test="contains($adv,$key)">
				<xsl:value-of select="substring-before(substring-after($adv,concat($key,'=')),';')"/>
			</xsl:when>
			<xsl:otherwise>false</xsl:otherwise>
		</xsl:choose>
	</xsl:function>

</xsl:stylesheet>	
