<?xml version="1.0" encoding="iso-8859-1"?>

<!--
        #
        #  Copyright (C) 2005 Vanbelle Edouard
        #
        #  This program is free software; you can redistribute it and/or
        #  modify it under the terms of the GNU General Public License
        #  as published by the Free Software Foundation; either version 2
        #  of the License, or (at your option) any later version.
        #
        #  This program is distributed in the hope that it will be useful,
        #  but WITHOUT ANY WARRANTY; without even the implied warranty of
        #  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
        #  GNU General Public License for more details.
        #
        #  You should have received a copy of the GNU General Public License
        #  along with this program; if not, write to the Free Software
        #  Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
        #
  -->

<xsl:stylesheet version="1.0" 
	xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
> 
	<!--
	xmlns:unused="http://www.vanbelle.fr/xml/unused"
	unused:xmlns="http://www.w3.org/1999/xhtml"
		unused:doctype-public  = "-//W3C//DTD XHTML 4.01//EN"
	-->
	<xsl:output 
		encoding	= "utf-8" 
		method		= "html" 
		media-type      = "text/html"
		indent		= "yes" 
		doctype-public	= "-//W3C//DTD HTML 4.01 Transitional//EN" 
		standalone	= "yes"
	/>

	<!-- loading translation system -->
	<xsl:variable name="lang" select="document('lang/default.xml.fr')/messages/message" />

	<xsl:strip-space elements="*" />

	<xsl:variable name="base">/.libs/themes/<xsl:value-of select='//autoIndex/display/@theme'/></xsl:variable>

	<xsl:variable name="selected-file" select="//autoIndex/files/file[ @selected='true' ]" />
	<xsl:variable name="format"        select="//autoIndex/display/@format" />
	<xsl:variable name="title">
		<xsl:choose>
		<xsl:when test="count( $selected-file)">
			<xsl:apply-templates select="$selected-file" mode="title"/>
		</xsl:when>
		<xsl:otherwise>
			<xsl:value-of select="//autoIndex/title"/>
		</xsl:otherwise>
		</xsl:choose>
	</xsl:variable>

	<xsl:template match="file" mode="title">
		<xsl:param name="nb-before" select="count( preceding-sibling::*[@slideshow = 'true'])"/>
		<xsl:param name="nb-after"  select="count( following-sibling::*[@slideshow = 'true'])"/>
		<xsl:value-of select="$nb-before + 1" /> / <xsl:value-of select="$nb-before + 1 + $nb-after" /> : <xsl:value-of select="@name"/>
	</xsl:template>
	
	<!-- ###################################################################################################################### -->
	<xsl:template match="/autoIndex">
	<html>
		<head>
			<xsl:if test="display/@timeout != ''">
				<xsl:apply-templates select="$selected-file" mode="refresh-next">
					<xsl:with-param name="timeout" select="display/@timeout"/>
				</xsl:apply-templates>
			</xsl:if>

			<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
			<link rel="icon" href="/favicon.ico" />
			<link rel="stylesheet" href="{$base}/default.css" alternate="no" />
			
			<xsl:comment>compliance patch for microsoft browsers</xsl:comment>
			<xsl:comment><![CDATA[[if lt IE 7]><script src="/.libs/ie7/ie7-standard-p.js" type="text/javascript"></script><![endif]]]></xsl:comment>
			
			<script src="{$base}/default.js" type="text/javascript"></script>
			<script src="{$base}/swfobject.js" type="text/javascript"></script>
			<title><xsl:value-of select="$title" /></title>
		</head>
		<body>
			<div id="popup">

				<!-- XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX -->

				<div id="pref" class="window" style="display: none;">
				  <div>
				      Preferences &#160;
				      <a href="#" onclick="document.getElementById('pref').style.display='none'; document.getElementById('popup').style.display='none'; return false;">close</a>
				  </div>
				  <div style="text-align:left; margin-left: 5em;">
					<h3>Choose your theme:</h3>
					<ul>
					  <li><a href="javascript:setTheme('lazy');">Lazy</a></li>(used for compatibility with old browsers)
					  <li><a href="javascript:setTheme('explode');">Explode</a></li>
					  <li><a href="javascript:setTheme('svdjez');">Svdjez</a>(in SVG, only with firefox)</li>
					  <li><a href="javascript:setTheme('smoothgallery');">Smoothgallery</a>(in dev...)</li>
					  <li><a href="javascript:setTheme('blogfeed');">Blogfeed</a>(in dev...)</li>
					</ul>
				  </div>
				</div>

				
				<!-- XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX -->

				<div id="meta-data" class="window" style="display: none;">
				  <div>
				      Info &#160;
				      <a href="#" onclick="document.getElementById('pref').style.display='none'; document.getElementById('popup').style.display='none'; return false;">close</a>
				  </div>
				  <div style="text-align: justify; margin-left: 1em; margin-right: 1em; overflow: auto; height: 98%">
				    <p id="info-container"></p>
				  </div>
				</div>

				<!-- XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX -->

				<div id="help" class="window" style="display: none;">
				  <div>
			  	      <xsl:value-of select="$lang[@id='help']" /> &#160;
				      <a href="#" onclick="document.getElementById('help').style.display='none'; document.getElementById('popup').style.display='none'; return false;">close</a>
				  </div>
				  <div style="text-align: justify; margin-left: 1em; margin-right: 1em; overflow: auto; height: 98%">
			  	      <xsl:copy-of select="$lang[@id='helpDetails']" /> &#160;
				  </div>
  				</div>

			</div>
			<xsl:if test="count( display[@mode='folder']) > 0">
				<xsl:apply-templates select="files" mode="folder" />
			</xsl:if>
			<xsl:if test="count( display[@mode='slideshow']) > 0">
				<xsl:apply-templates select="files" mode="slideshow" />
			</xsl:if>
			<xsl:if test="count( display[@mode='preview']) > 0">
				<xsl:apply-templates select="files" mode="preview" />
			</xsl:if>
		</body>
		
	</html>
        </xsl:template>

	
	<xsl:template match="file" mode="refresh-next">
		<xsl:param name="timeout"/>
		<xsl:param name="next" select="following-sibling::*[@slideshow = 'true'][1]" />
		<xsl:if test="$next/@link !=''">
			<meta http-equiv="Refresh" >
				<xsl:attribute name="content"><xsl:value-of select="$timeout"/>;URL=<xsl:value-of select="$next/@link"/>?display=slide&amp;timeout=<xsl:value-of select="$timeout"/></xsl:attribute>
			</meta>
		</xsl:if>
	</xsl:template>



	<!-- ###################################################################################################################### -->
	<xsl:template match="files" mode="folder">
		<!-- div id="main" -->
		<table width="100%" height="100%" cellspacing="0" cellpadding="0">
		<tr>
		  <td id="navigation" valign="top">
		   <div id="info">
		    <div id="folderInfo">
		    	<h1 title="{$title}">
				<xsl:call-template name="display-directoryname">
					<xsl:with-param name="name"> <xsl:value-of select="$title"/> </xsl:with-param>
				</xsl:call-template>
			</h1>
			<div class="actions">
			  <xsl:value-of select="count( file)"/> &#160; 
			  	<xsl:value-of select="$lang[@id='file(s)']" /><br/>
			  <a href="./.."><img style="vertical-align: middle;" src="{$base}/nav/crystal/up.png"  title="{$lang[@id='parent']}"/> &#160;
			  	<xsl:value-of select="$lang[@id='parent']" />
			  </a>
			  <a href="#" onclick="document.getElementById('popup').style.display='block'; document.getElementById('help').style.display='block'; return false;">
				<img style="vertical-align: middle;" src="{$base}/nav/crystal/help.png" title="{$lang[@id='help']}" /> &#160;
			  	<xsl:value-of select="$lang[@id='help']" />
			  </a>
			  <a href="#" onclick="document.getElementById('popup').style.display='block'; document.getElementById('pref').style.display='block'; return false;">
				<img style="vertical-align: middle;" src="{$base}/nav/crystal/configure.png" title="{$lang[@id='preference']}" /> &#160;
			  	<xsl:value-of select="$lang[@id='preferences']" />
			  </a>
			  <!--p style="font-weight: bold; color: red;">
			    <br/>
			    EN DEVELOPPEMENT, NOUVELLES PHOTOS NON GENEREES ACTUELLEMENT
			  </p-->
			</div>
		    </div>
		    <div id="fileInfo" style="display: none;">
		    	<h1 id="fileInfo.name" />
			<b><xsl:value-of select="$lang[@id='type']"/>:</b>&#160;<span id="fileInfo.type"/><br/>
			<b><xsl:value-of select="$lang[@id='size']"/>:</b>&#160;<span id="fileInfo.size"/><br/>
			<b><xsl:value-of select="$lang[@id='created']"/>:</b>&#160;<span id="fileInfo.created"/><br/>
			<b><xsl:value-of select="$lang[@id='modified']"/>:</b>&#160;<span id="fileInfo.modified"/><br/>
			<div class='actions'>
			  <a id="fileInfo.open"><img style="vertical-align: middle;" src='{$base}/nav/crystal/viewmag.png' /> &#160;<xsl:value-of select="$lang[@id='open']"/></a>
			  <a id="fileInfo.original"><img style="vertical-align: middle;" src='{$base}/nav/crystal/player_play.png' /> &#160;<xsl:value-of select="$lang[@id='open']"/></a>
			  <a id="fileInfo.meta"><img style="vertical-align: middle;" src='{$base}/nav/crystal/info.png' /> &#160;<xsl:value-of select="$lang[@id='info']"/></a>
			  <a id="fileInfo.slideshow3"><img style="vertical-align: middle;" src='{$base}/nav/crystal/player_time.png' /> &#160;<xsl:value-of select="$lang[@id='slideshow at 3sec']"/></a>
			  <a id="fileInfo.slideshow6"><img style="vertical-align: middle;" src='{$base}/nav/crystal/player_time.png' /> &#160;<xsl:value-of select="$lang[@id='slideshow at 6sec']"/></a>
			  <a id="fileInfo.download"><img style="vertical-align: middle;" src='{$base}/nav/save.png' /> &#160;download<!-- TODO translate it --></a>
			</div>
		    </div>
		    <div id="about" style="text-align: justify;">
		      <div class="actions">
		        <img style="vertical-align: middle;" src='{$base}/nav/crystal/attach.png' />&#160;powered by :
			  <a href="http://www.xmlautoindex.org/">XmlAutoIndex.</a>
		      </div>
		    </div>
		    
		   </div>
		  </td>
		  <td valign="top">
			<div id="folder">
				<xsl:apply-templates select="file" mode="folder"/>
			</div>
		  </td>
		</tr>
		</table>
		<!-- /div -->
	</xsl:template>


	<xsl:template match="file" mode="folder">
		<div 
		        class      = "file" 
			title      = "{(@name)}"
			onmouseover= "highLight( this);"
			onmouseout = "unhighLight( this);"
		>
		  <xsl:attribute name="onmouseup">
			mouseUp( 
				this,
				'<xsl:call-template name="escape-javascript">
				  <xsl:with-param name="string"><xsl:value-of select="@name"/></xsl:with-param>
				</xsl:call-template>',
				'<xsl:call-template name="escape-javascript">
				  <xsl:with-param name="string"><xsl:value-of select="@link"/></xsl:with-param>
				</xsl:call-template>',
				'<xsl:value-of select="stat/@size"/>', 
				'<xsl:value-of select="stat/@ctime"/>', 
				'<xsl:value-of select="stat/@mtime"/>', 
				'<xsl:value-of select="mime-type/@name"/>', 
				'<xsl:value-of select="@slideshow"/>', 
				'<xsl:value-of select="@meta"/>'
			); 
		  </xsl:attribute>
		  <div class="filecontent">
		  	<!--div style="height: 77; width:102; border: 1px solid red; align: center"-->
			<a href="{@link}" onclick="return bootTest();">
			<!-- this link is here only for compatibility with old browser (links, ... and for bots) -->
			  <img  alt="{mime-type/@name}">
				<xsl:attribute name="src"><xsl:value-of select="previews/preview[@format='thumb']/@href"/></xsl:attribute>
			  </img>
			<!--/div-->
			<br/>
			<xsl:call-template name="display-name">
				<xsl:with-param name="name"><xsl:value-of select="@name" /></xsl:with-param>
			</xsl:call-template>
			</a>
			<div class="fileoption">
					<br/>
			</div>
		  </div>
		</div>
	</xsl:template>




	<!-- ###################################################################################################################### -->
	<xsl:template match="files" mode="slideshow">
		<table border="0" cellspacing="0" cellpadding="0" height="100%" width="100%"> 
		<xsl:apply-templates select="$selected-file" mode="main-navigation">
			<xsl:with-param name="slide">
				<a title="{$lang[@id='view original']}">
					<xsl:attribute name="href"><xsl:value-of select="$selected-file/@link"/></xsl:attribute>
					<img>
						<xsl:attribute name="src">   <xsl:value-of select="$selected-file/previews/preview[@format=$format]/@href"/></xsl:attribute>
					</img><br/>
				</a>
			</xsl:with-param>
			<xsl:with-param name="slide-format" select="$format" />
		</xsl:apply-templates>
		</table>
	</xsl:template>

	<xsl:template match="file" mode="main-navigation">
		<!-- calc 1 time (optimization) -->
		<xsl:param name="slide"  />
		<xsl:param name="slide-format"  />
		<xsl:param name="first"  select="preceding-sibling::*[@slideshow = 'true'][position()=last()]" />
		<xsl:param name="prev"   select="preceding-sibling::*[@slideshow = 'true'][1]" />
		<xsl:param name="next"   select="following-sibling::*[@slideshow = 'true'][1]" />
		<xsl:param name="next2"  select="following-sibling::*[@slideshow = 'true'][2]" />
		<xsl:param name="last"   select="following-sibling::*[@slideshow = 'true'][position()=last()]" />

		<!--
		<xsl:param name="preloadNext"   select="following-sibling::*[@slideshow = 'true'][1]" />
		
		<script language="javascript"
			var nextImg = new Image();
			nextImg.src = '<xsl:value-of select="$preloadNext/thumb/@image" />';
		</script>
		-->
		<tr>
			<td colspan="2" valign="top" class="toolbar">
			<!--div class="toolbar"-->
				<a href="."><img src="{$base}/nav/crystal/gohome.png"  title="{$lang[@id='back']}"/> </a>
				<a><xsl:attribute name="href">?display=preview</xsl:attribute>
					<img src="{$base}/nav/crystal/info.png"    title="{$lang[@id='preview']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$first/@link" />?display=slide</xsl:attribute>
					<img src="{$base}/nav/crystal/player_start.png"   title="{$lang[@id='start']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$prev/@link" />?display=slide</xsl:attribute>
					<img src="{$base}/nav/crystal/previous.png"  title="{$lang[@id='previous']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$next/@link" />?display=slide</xsl:attribute>
					<img src="{$base}/nav/crystal/next.png"  title="{$lang[@id='next']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$last/@link" />?display=slide</xsl:attribute>
					<img src="{$base}/nav/crystal/player_end.png"   title="{$lang[@id='end']}"/> </a>
				<a href="?display=slide&amp;timeout=3"><img src="{$base}/nav/crystal/player_time.png" title="{$lang[@id='slideshow at 3sec']}"/> </a>
				<a href="?display=slide&amp;timeout=6"><img src="{$base}/nav/crystal/player_time.png" title="{$lang[@id='slideshow at 6sec']}"/> </a>
				<a href="?display=slide"><img src="{$base}/nav/crystal/player_stop.png" title="{$lang[@id='stop slideshow']}"/> </a>
			
				<span style="margin-bottom: 4px;">
					&#160; &#160; &#160; &#160;
					
					<xsl:value-of select="$title"/>

					&#160; &#160; &#160; &#160;
					<xsl:value-of select="$lang[@id='size']"/> :

					<xsl:choose>
					  <xsl:when test="$slide-format = 'size1'">
					    <xsl:value-of select="$lang[@id='size1']"/> | 
					    <a href="?display=slide&amp;xaiSetSize=size2"><xsl:value-of select="$lang[@id='size2']"/></a> | 
					    <a href="?display=slide&amp;xaiSetSize=size3"><xsl:value-of select="$lang[@id='size3']"/></a> 
					  </xsl:when>
					  <xsl:when test="$slide-format = 'size2'">
					    <a href="?display=slide&amp;xaiSetSize=size1"><xsl:value-of select="$lang[@id='size1']"/></a> | 
					    <xsl:value-of select="$lang[@id='size2']"/>  | 
					    <a href="?display=slide&amp;xaiSetSize=size3"><xsl:value-of select="$lang[@id='size3']"/></a> 
					  </xsl:when>
					  <xsl:when test="$slide-format = 'size3'">
					    <a href="?display=slide&amp;xaiSetSize=size1"><xsl:value-of select="$lang[@id='size1']"/></a> | 
					    <a href="?display=slide&amp;xaiSetSize=size2"><xsl:value-of select="$lang[@id='size2']"/></a> | 
					    <xsl:value-of select="$lang[@id='size3']"/>   
					  </xsl:when>
					</xsl:choose>
				</span>
			<!--/div-->
			</td>
	        </tr>
		<tr>
			<td id="navigation" valign="top">
				<div class="file">
				  <div class="filecontent">
					<xsl:apply-templates select="$prev" mode="navigation" >
						<xsl:with-param name="mode">slide</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
				<div class="file-selected">
				  <div class="filecontent">
					<xsl:apply-templates select="."     mode="navigation" >
						<xsl:with-param name="mode">slide</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
				<div class="file">
				  <div class="filecontent">
					<xsl:apply-templates select="$next" mode="navigation" >
						<xsl:with-param name="mode">slide</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
				<div class="file">
				  <div class="filecontent">
					<xsl:apply-templates select="$next2" mode="navigation" >
						<xsl:with-param name="mode">slide</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
			</td>
			<td align="center">
				<xsl:copy-of select="$slide"/>
			
				<!-- pre-load next image -->
				<xsl:if test="$next/previews/preview[@format=$format]/@href != ''">
					<script language="javascript">
						var preloadImage = new Image();
						preloadImage.src="<xsl:value-of select="$next/previews/preview[@format=$format]/@href" />";
				 	</script>
				</xsl:if>
			</td>
		</tr>
	</xsl:template>


	<!-- ###################################################################################################################### -->
	<xsl:template match="files" mode="preview">
		<table border="0" cellspacing="0" cellpadding="0" height="100%" width="100%"> 
		<xsl:apply-templates select="$selected-file" mode="main-preview">
			<xsl:with-param name="preview">

			<xsl:choose>
			  <xsl:when test="count( $selected-file/previews/preview[@format='flv'] ) > 0">

			  	  <!-- 
				  classid  = "clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" 
				  codebase = "http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" 
    				<param name="type" value="application/x-shockwave-flash" />
				<param name="codebase" value="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" />
				  -->
				  <!--
			    <object 
			  	  type     = "application/x-shockwave-flash"
				  width    = "352"
				  height   = "280"
				  wmode    = "transparent" 
				  data     = "{$base}/video-player.swf?file={$selected-file/previews/preview[@format='flv']/@href}">

				<param name="movie" value="{$base}/video-player.swf?file={$selected-file/previews/preview[@format='flv']/@href}" />
				
				<xsl:if test="count( $selected-file/previews/preview[@format='size0']) > 0">
					<img 
					  alt = "preview" 
					  src = "{$selected-file/previews/preview[@format='size0']/@href}" />
				</xsl:if>
			    </object> -->
			    
			    <p id="flv-player">download flash player to watch movie</p>
			    <script type="text/javascript">
			          var player = new SWFObject("<xsl:value-of select="$base"/>/flv-player.swf", "single", "352", "280", "7");
				  player.addVariable("file","<xsl:value-of select="$selected-file/previews/preview[@format='flv']/@href" />");
				  player.addParam("allowfullscreen","true");
				  //player.addVariable("backcolor","0x00000");
				  //player.addVariable("frontcolor","0xEECCDD");
				  //player.addVariable("lightcolor","0xCC0066");
				  //player.addVariable("image","<xsl:value-of select="$selected-file/previews/preview[@format='size0']/@href" />"); <!-- TODO: make available size0 -->
				  player.addVariable("image","<xsl:value-of select="$selected-file/previews/preview[@format='thumb']/@href" />"); 
				  player.write("flv-player");
			    </script>


			  </xsl:when>
			  
			  <xsl:when test="count( $selected-file/previews/preview[@format='fmxml'] ) > 0">

			    <p id="mp3-player">download flash player to listen music</p>
			    <script type="text/javascript">
			          var player = new SWFObject("<xsl:value-of select="$base"/>/mp3-player.swf", "playlist", "340", "270", "7");
				  player.addVariable("file","<xsl:value-of select="$selected-file/previews/preview[@format='audioPlaylist']/@href" />");
				  //player.addVariable("backcolor","0x00000");
				  //player.addVariable("frontcolor","0xEECCDD");
				  //player.addVariable("lightcolor","0xCC0066");
				  player.addVariable("displayheight","0");
				  player.addVariable("repeat","list");
				  player.addVariable("shuffle","false");
				  //player.addVariable("audio","Track02.mp3");
				  //player.addVariable("enablejs","true");
				  //player.addVariable("javascriptid","mpl");
				  player.write("mp3-player");
			    </script>
			    
			    <!-- object 
			  	  type     = "application/x-shockwave-flash"
				  data     = "{$base}/audio-player.swf"
				  width    = "150" 
				  height   = "50" 
				  style    = "vertical-align: bottom;" >

    				<param name="type" value="application/x-shockwave-flash" />
				<param name="movie" value="{$base}/audio-player.swf" />
				<param name="FlashVars" value="file={$selected-file/previews/preview[@format='fmxml']/@href}&amp;autolaunch=wait" />

				<xsl:value-of select="$lang[@id='flashRequired']" />
			    </object -->

			  </xsl:when>
		  
			  <xsl:when test="count( $selected-file/previews/preview[@format='size0']) > 0">
			  	<a href="{$selected-file/@link}?display=slide" title="{$lang[@id='view in slide show']}">
			  	<img 
				  style = "border: 0;" 
				  alt   = "preview" 
				  src   = "{$selected-file/previews/preview[@format='size0']/@href}" />
				</a>
			  </xsl:when>
			  
			  <xsl:otherwise>
			      <xsl:value-of select="$lang[@id='noPreviewAvailable']" />
			  </xsl:otherwise>
			</xsl:choose>
<!--
			<object type   = "application/x-shockwave-flash"
				width  = "352" 
				height = "280" 
				id     = "FlowPlayer"
				data   = "{$base}/FlowPlayer.swf"
				>
				<param 	name  = "movie" 
					value = "{$base}/FlowPlayer.swf" /> 
				<param 	name  = "flashvars"
				   	value = "videofile=/{video/@href}" />
				<embed 	src       = "{$base}/FlowPlayer.swf"
				   	quality   = "high" 
					bgcolor   = "#ffffff" 
					width     = "352" 
					height    = "280"
				   	name      = "FlowPlayer" 
					type      = "application/x-shockwave-flash"
				   	flashvars = "videofile={video/@href}"/>
			</object>
-->


			</xsl:with-param>
			<!-- xsl:with-param name="slide-format" select="slide/@format" / -->
		</xsl:apply-templates>
		</table>
	</xsl:template>
	
	<xsl:template match="file" mode="main-preview">
		<!-- calc 1 time (optimization) -->
		<xsl:param name="preview"  />
		<xsl:param name="first"  select="preceding-sibling::*[@meta = 'true'][position()=last()]" />
		<xsl:param name="prev"   select="preceding-sibling::*[@meta = 'true'][1]" />
		<xsl:param name="next"   select="following-sibling::*[@meta = 'true'][1]" />
		<xsl:param name="next2"  select="following-sibling::*[@meta = 'true'][2]" />
		<xsl:param name="last"   select="following-sibling::*[@meta = 'true'][position()=last()]" />

		<tr>
			<td colspan="2" valign="top" class="toolbar">
			<!--div class="toolbar"-->
				<a href="."><img src="{$base}/nav/crystal/gohome.png"  title="{$lang[@id='back']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$first/@link" />?display=preview</xsl:attribute>
					<img src="{$base}/nav/crystal/player_start.png"   title="{$lang[@id='start']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$prev/@link" />?display=preview</xsl:attribute>
					<img src="{$base}/nav/crystal/previous.png"  title="{$lang[@id='previous']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$next/@link" />?display=preview</xsl:attribute>
					<img src="{$base}/nav/crystal/next.png"  title="{$lang[@id='next']}"/> </a>
				<a><xsl:attribute name="href"><xsl:value-of select="$last/@link" />?display=preview</xsl:attribute>
					<img src="{$base}/nav/crystal/player_end.png"   title="{$lang[@id='end']}"/> </a>
			
				<span style="margin-bottom: 4px;">
					&#160; &#160; &#160; &#160;
					
					<xsl:value-of select="$title"/>

				</span>
			<!--/div-->
			</td>
	        </tr>
		<tr>
			<td id="navigation" valign="top">
				<div class="file">
				  <div class="filecontent">
					<xsl:apply-templates select="$prev" mode="navigation" >
						<xsl:with-param name="mode">preview</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
				<div class="file-selected">
				  <div class="filecontent">
					<xsl:apply-templates select="."     mode="navigation" >
						<xsl:with-param name="mode">preview</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
				<div class="file">
				  <div class="filecontent">
					<xsl:apply-templates select="$next" mode="navigation" >
						<xsl:with-param name="mode">preview</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
				<div class="file">
				  <div class="filecontent">
					<xsl:apply-templates select="$next2" mode="navigation" >
						<xsl:with-param name="mode">preview</xsl:with-param>
					</xsl:apply-templates>
				  </div>
				</div>
			</td>
			<td align="center" valign="top">
		  		<div class="preview-thumb">
					<xsl:copy-of select="$preview"/>
				</div>

				<div class="preview-info">
					<b><xsl:value-of select="$selected-file/@name"/></b>
					<div class="row">
						<span class="label"><xsl:value-of select="$lang[@id='preview.type-mime']" /></span>
						<span class="formw"><xsl:value-of select="$selected-file/mime-type/@name"/></span>
					</div>
					<div class="row">
						<span class="label"><xsl:value-of select="$lang[@id='preview.size']" /></span>
						<span class="formw"><xsl:value-of select="$selected-file/stat/@size"/></span>
					</div>
					<div class="row">
						<span class="label"><xsl:value-of select="$lang[@id='preview.length']" /></span>
						<span class="formw">--</span>
					</div>
					<div class="row">
						<span class="label"><xsl:value-of select="$lang[@id='preview.geometry']" /></span>
						<span class="formw">--</span>
					</div>
					<p><br/><br/></p>
					
					<div style="clear: both; text-align: left;">
					  <a href="{$selected-file/@link}">
					    <img style="vertical-align: middle;" border="0" src='{$base}/nav/crystal/viewmag.png'     />&#160; <xsl:value-of select="$lang[@id='view original']" /></a> <br/>
					  <a href="{$selected-file/@link}?display=slide">
					    <img style="vertical-align: middle;" border="0" src='{$base}/nav/crystal/player_play.png' />&#160; <xsl:value-of select="$lang[@id='view in slide show']" /></a> <br/>
			  		  <a href="{$selected-file/@link}?display=slide&amp;timeout=3">
					    <img style="vertical-align: middle;" border="0" src='{$base}/nav/crystal/player_time.png' />&#160; <xsl:value-of select="$lang[@id='slideshow at 3sec']" /></a> <br/>
			 		  <a href="{$selected-file/@link}?display=slide&amp;timeout=6">
					    <img style="vertical-align: middle;" border="0" src='{$base}/nav/crystal/player_time.png' />&#160; <xsl:value-of select="$lang[@id='slideshow at 6sec']" /></a> <br/>
			  		  <a hraf="{$selected-file/@link}?display=download">
					    <img style="vertical-align: middle;" order="0" src='{$base}/nav/save.png'                 />&#160; download<!-- TODO translate it --></a> <br/>
					</div>
				</div>

				<div class="preview-comment">
			             <div id="showComment">
					     <div class="comment-toolbar">
						<a href="#" onclick="replace( document.getElementById( 'showComment'), document.getElementById( 'addNewComment') ); return false;">
						<img src="{$base}/nav/crystal/pencil.png"  title="{$lang[@id='Add a comment']}" /></a>
						<a href="#" onclick="getMetaData('{$selected-file/@link}?display=meta',document.getElementById( 'target')); return false; ">
						<img src="{$base}/nav/crystal/reload_page.png"  title="{$lang[@id='Reload']}" /></a>
					     </div>
					     <div class="comment-target">
					       <div id="target" />
					     </div>
				     </div>
				     <div id="addNewComment" style="display: none;">
					     <div class="comment-toolbar">
						<a href="#" onclick="replace( document.getElementById( 'addNewComment'), document.getElementById( 'showComment') ); return false;">
						<img src="{$base}/nav/crystal/no.png"  title="{$lang[@id='Cancel']}" /></a>
					     </div>
					     <div class="comment-target">
						<form onsubmit="addComment( '{$selected-file/@link}?display=meta', this ); return false;">
						  <div class="row">
						    <span id="author" class="label"><xsl:value-of select="$lang[@id='Author']"/>: </span>
						    <span class="formw"><input name="author"/></span>
						  </div>
						  <div class="row">
						    <span class="label"><xsl:value-of select="$lang[@id='Comment']"/>: </span>
						    <span class="formw"><textarea cols="43" rows="8" name="comment"></textarea></span>
						  </div>
						  <div class="row">
						    <span class="label">&#160;</span>
						    <span class="formw"><input type="submit" value="{$lang[@id='add']}"/></span>
						  </div>
						</form>
					     </div>
				     </div>
				     <script language="javascript">
				       getMetaData( 
				           "<xsl:value-of select="$selected-file/@link"/>?display=meta", 
					   document.getElementById( "target") 
				       );
				     </script>
				</div>

			</td>
		</tr>
	</xsl:template>

	<xsl:template match="file" mode="navigation">
		<xsl:param name="mode" />
		<xsl:choose>
			<xsl:when test="@selected = 'true'">
				<img>
					<xsl:attribute name="alt"><xsl:value-of select="mime-type/@name"/></xsl:attribute>
					<xsl:attribute name="src"><xsl:value-of select="previews/preview[@format='thumb']/@href"/></xsl:attribute>
					
				</img><br/>
				<xsl:call-template name="display-name">
					<xsl:with-param name="name"><xsl:value-of select="@name" /></xsl:with-param>
				</xsl:call-template>
				<br/>
				<div class="fileoption"><br/></div>
			</xsl:when>
			<xsl:otherwise>
				<a>
					<xsl:attribute name="href"><xsl:value-of select="@link"/>?display=<xsl:value-of select="$mode" /></xsl:attribute>
					<xsl:attribute name="title"><xsl:value-of select="@name"/></xsl:attribute>
					<img>
						<xsl:attribute name="alt"><xsl:value-of select="mime-type/@name"/></xsl:attribute>
						<xsl:attribute name="src"><xsl:value-of select="previews/preview[@format='thumb']/@href"/></xsl:attribute>
						
					</img><br/>
					<xsl:call-template name="display-name">
						<xsl:with-param name="name"><xsl:value-of select="@name" /></xsl:with-param>
					</xsl:call-template>
				</a><br/>
				<div class="fileoption"><br/></div>
			</xsl:otherwise>
		</xsl:choose>

	</xsl:template>
	

	<!-- ###################################################################################################################### -->
	<xsl:template name="display-name">
		<xsl:param name="name"/>
		<xsl:choose>
			<xsl:when test="string-length( $name) &gt; 20">
				<xsl:value-of select="substring( $name, 1, 16)" />...
			</xsl:when>
			<xsl:otherwise>
				<xsl:value-of select="$name" /> 
			</xsl:otherwise>
		</xsl:choose>
	</xsl:template>
	<xsl:template name="display-directoryname">
		<xsl:param name="name"/>
		<xsl:choose>
			<xsl:when test="string-length( $name) &gt; 18">
				...<xsl:value-of select="substring( $name, string-length( $name) - 16, 17)" />
			</xsl:when>
			<xsl:otherwise>
				<xsl:value-of select="$name" /> 
			</xsl:otherwise>
		</xsl:choose>
	</xsl:template>

<!-- http://mail-archives.apache.org/mod_mbox/xml-xalan-j-users/200206.mbox/%3C200206141326.21205.peter@pdavis.cx%3E -->

<xsl:template name="replace-string">
  <!-- search for this: -->
  <xsl:param name="search" select="string(.)"/>

  <!-- and replace it with this: -->
  <xsl:param name="replace" select="string(.)"/>

  <!-- here is the original string: -->
  <xsl:param name="string" select="string(.)"/>
  
  <xsl:choose>
    <xsl:when test="not(contains($string, $search))">
      <!-- if there are no more appearances of $search in the
        $string, output the rest of the string and stop. -->
      <xsl:value-of select="$string"/>
    </xsl:when>
    <xsl:otherwise>
      <!-- output the part of the $string that is before the
        first appearance of $search. -->
      <xsl:value-of select="substring-before($string, $search)"/>
      
      <!-- output the replacement $replace.  -->
      <xsl:value-of select="$replace"/>

      <!-- repeat the process, using the part of $string that
        comes after the first appearance of $search. -->
      <xsl:call-template name="replace-string">
        <xsl:with-param name="search" select="$search"/>
        <xsl:with-param name="replace" select="$replace"/>
        <xsl:with-param name="string" select="substring-after($string, $search)"/>
      </xsl:call-template>
    </xsl:otherwise>
  </xsl:choose>
</xsl:template>

  <xsl:template name="escape-javascript">
    <xsl:param name="string" select="string(.)"/>

    <xsl:choose>
      <xsl:when test="function-available('escape')">
        <xsl:value-of select="escape($string)"/>
      </xsl:when>

      <xsl:otherwise>
        <!-- replace all characters not matching SingleStringCharacter
        or DoubleStringCharacter according to ECMA262.  Note: not all
        characters that should be escaped are legal XML characters:
        "\a", "\b", "\v", and "\f" are not escaped. -->
        <xsl:call-template name="replace-string">
          <xsl:with-param name="search">'</xsl:with-param>
          <xsl:with-param name="replace">\'</xsl:with-param>
          <xsl:with-param name="string">
            <xsl:call-template name="replace-string">
              <xsl:with-param name="search">"</xsl:with-param>
              <xsl:with-param name="replace">\"</xsl:with-param>
              <xsl:with-param name="string">
                <xsl:call-template name="replace-string">
                  <xsl:with-param name="search">
                    <xsl:text>&#9;</xsl:text>
                  </xsl:with-param>
                  <xsl:with-param name="replace">\t</xsl:with-param>
                  <xsl:with-param name="string">
                    <xsl:call-template name="replace-string">
                      <xsl:with-param name="search">
                        <xsl:text>&#10;</xsl:text>
                      </xsl:with-param>
                      <xsl:with-param name="replace">\n</xsl:with-param>
                      <xsl:with-param name="string">
                        <xsl:call-template name="replace-string">
                          <xsl:with-param name="search">
                            <xsl:text>&#13;</xsl:text>
                          </xsl:with-param>
                          <xsl:with-param name="replace">\r</xsl:with-param>
                          <xsl:with-param name="string">
                            <xsl:call-template name="replace-string">
                              <!-- remember to do backslash first -->
                              <xsl:with-param name="search">\</xsl:with-param>
                              <xsl:with-param name="replace">\\</xsl:with-param>
                              <xsl:with-param name="string" select="$string" />
                            </xsl:call-template>
                          </xsl:with-param>
                        </xsl:call-template>
                      </xsl:with-param>
                    </xsl:call-template>
                  </xsl:with-param>
                </xsl:call-template>
              </xsl:with-param>
            </xsl:call-template>
          </xsl:with-param>
        </xsl:call-template>
      </xsl:otherwise>
    </xsl:choose>
  </xsl:template>

</xsl:stylesheet>


