1633 sujets

Formats, encodage, internationalisation, XML

[ANGLAIS] *.XSL Stylesheet Add-On Question(s)...

Hello again, to all!!!

Once again, I would like to say that I don't know any more French sentence than "Je n'ai comprend pas, tu parlez Anglais?? No? Tu Zut..." (and I HOPE this isn't taken wrong when I say that to a French person If you know what I mean!). And most of the time it's enough for me as a Dutch person, altough I know my Englisch, and I will try to see if someone here knows it too who can help me. I try to see how far I come with navigating in here, cause I also have a PHPbb Forum on one of my servers... But please every respons in here in Englisch, cause I don't understand French (and you might have seen in my only full French sentece I know!)

Well, now the problem (and it's the second problem on this forum from me wich I think isn't so hard to solve...):

Well, I've got a *.xls, a few photo's wich are combined with an CSS. It's from a program called Photo On Web (www.jjude.com).

Now I am changing some bits and byte's, the CSS works fine, the photo's are no problem, but the *.xsl (the file wich fysicly creates the pages) is a bit of a problem.

This is the script for that specific file:

<?xml version="1.0" encoding = "ISO-8859-1"?>
<xsl:stylesheet
	version="1.0"
	xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
	<xsl:output
		method="html"
		version="4.0"
		encoding="iso-8859-1"
		indent="yes"/>
		<!-- This XSL produces a matrix output of HTML (rows and cols). However this xsl only outputs in single page and does not
	divide the pages into mutlitple pages (i.e. numrows are not taken into account) -->
	<xsl:template
		match="/">
		<html>
			<head>
				<meta name="generator" content="Fotos on web (www.jjude.com/apps/fow.html)"/>
				<title>
					<xsl:value-of select="Album/Title"/>
				</title>				
				<link
					rel="stylesheet"
					type="text/css"
					href="{Album/IndexCSS}"/>
			</head>
			<body>
				<h2>
					<xsl:value-of
						select="Album/Title"/>
				</h2>
				<!-- This script has to run when the page loads so it is placed in body section -->
				<script
					language="JavaScript"
					type="text/javascript">
					<xsl:comment>Begin 
					<!-- This is the array of thumbnail path -->
						<xsl:text>ThumbImgs = new Array( </xsl:text>
						<xsl:for-each
							select="Album/Images/Img">
							<xsl:text>"</xsl:text>
							<xsl:value-of
								select="translate(ThumbPath, '\','/')"/>
							<xsl:text>"</xsl:text>
							<xsl:if
								test="not (position() = last())"> ,</xsl:if>
						</xsl:for-each>
						<xsl:text>);</xsl:text>
						<!-- This is the array of thumbnail text which is displayed-->
						<xsl:text>ThumbText = new Array( </xsl:text>
						<xsl:for-each
							select="Album/Images/Img">
							<xsl:text>"</xsl:text>
							<xsl:value-of
								select="ThumbText"/>
							<xsl:text>"</xsl:text>
							<xsl:if
								test="not (position() = last())"> ,</xsl:if>
						</xsl:for-each>
						<xsl:text>);</xsl:text>
						<!-- This is the array of thumbnail text which is displayed-->
						<xsl:text>ThumbImgText = new Array( </xsl:text>
						<xsl:for-each
							select="Album/Images/Img">
							<xsl:text>"</xsl:text>
							<xsl:value-of
								select="ThumbImgText"/>
							<xsl:text>"</xsl:text>
							<xsl:if
								test="not (position() = last())"> ,</xsl:if>
						</xsl:for-each>
						<xsl:text>);</xsl:text>
						<!-- This is the array of image page urls-->
						<xsl:text>ImgPgURLs = new Array( </xsl:text>
						<xsl:for-each
							select="Album/Images/Img">
							<xsl:text>"</xsl:text>
							<xsl:value-of
								select="ImgPgURL"/>
							<xsl:text>"</xsl:text>
							<xsl:if
								test="not (position() = last())"> ,</xsl:if>
						</xsl:for-each>
						<xsl:text>);</xsl:text>
						<!-- define rows and cols -->
						<xsl:text> var cols = </xsl:text>
						<xsl:value-of
							select="Album/IndexCols"/>
						<xsl:text>;</xsl:text>
						<!-- here the javascript starts -->
						<xsl:text> 
						var TotalImgs = ThumbImgs.length - 1; 
						var ImgToDisplay = 0; 
						document.write('&lt;div align="center">&lt;center>'); 
						document.write("&lt;table cellspacing = '1' width='90%' border='0'>"); 
						for ( currow = 0; currow &lt;= Math.ceil(TotalImgs/cols); currow++){ 
							document.write("&lt;tr>"); 
							for(curcol=1; curcol &lt;=cols; curcol++){ 
								if (ImgToDisplay > TotalImgs){ 
									break; 
									} 
								document.write('&lt;td align="center"  width="25%" >'); 
								document.write('&lt;a href="' + ImgPgURLs[ImgToDisplay] + '">'); 
								document.write('&lt;img src="' + ThumbImgs[ImgToDisplay] + '"' + 'alt="' +ThumbImgText[ImgToDisplay]+ '" border="0" align="MIDDLE">'); 
								document.write('&lt;/a>'); 
								document.write("&lt;br> &lt;small&gt;"); 
								document.write(ThumbText[ImgToDisplay]); 
								document.write("&lt;/small&gt;");
								document.write("&lt;/td>"); 
							ImgToDisplay++; 
							} 
							document.write("&lt;/tr>"); 
							} 
							document.write("&lt;/table>"); 
							document.write("&lt;/center>&lt;/div>"); 
							</xsl:text>// End 
					</xsl:comment>
				</script>
				<!-- Create the link to gallery file if needed-->
				<xsl:apply-templates select="//Gallery"/>				
			</body>
		</html>
	</xsl:template>
	<!-- This block creates a link from index file  to gallery if needed -->
	<xsl:template match="//Gallery">
		<xsl:if test="LinkToGallery= 'true' and LinkFromIndex = 'true'  ">
			<p align="center">
				<a href="{File}">
					<xsl:value-of select="Name"/>
				</a>
			</p>
		</xsl:if>
	</xsl:template>	
</xsl:stylesheet>


What this basicly does: it creates a table defined in Photo's on Web (cols and rows), put's thumbnail images in it (e.g. with text and titles if desired) and places this into 1 index. When a thumbnail is clicked you see the original picture in a slide-show menu... I placed a previeuw on one one of my servers (these are old picture's(!!!) but it's about the idea!) located on http://www.djdadevil.nl/Studio

There is 1 extra thing that I want this *.XSL to do:
- Place some spacing between rows in index.

My knowlegde of XML is ok, but XSL, i'm just begining to see the fruits of that (e.g. here, as on school momentarely!).

So, I hope some-one can help me add this item to the above standing *.XSL... cause it would be very usefull for me!!!

In wait of answer(s), I remain,

Your Sincerrely,

Mark aux Pays Bas
Edited by djdadevil (15 Jan 2006 - 16:52)
Modérateur
hi,
Smiley smile

I would try that visual-effect through the css file, like adding:

td {padding-bottom:10px;}

or

br {margin:1.5em;}

... just because this are the "tags" that your "js" inside your "xls" file ,already generates.
Or do you need one extra tag generated ?

tot so ...
Thank you again, you just keep me helping on, I am glad... it worked, but now I want this second thing to add, wich I can't seem te get working:


a:link
{
	color: rgb(249,144,0); 
}
a:visited
{
	color: rgb(249,144,0); 
} 
a:active 
{
	color: rgb(249,144,0);
}
body 
{
	font-family: Comic-Sanse MS;
	background-color: rgb(0,0,0);
	color: rgb(255,255,255);
}
html {
	overflow-x: hidden;
	overflow-y: auto;
}

h1, h2, h3, h4, h5, h6
{
	font-family: Verdana, Arial, Helvetica;
}
h1
{
	color: rgb(255,204,0);
	text-align: center;	
}
h2
{
	color: rgb(255,255,255); 
	text-align: center;	
}
h3
{
	color: rgb(204,51,0); 
}
h4
{
	color: rgb(255,255,153);
}
h5
{
	color: rgb(255,255,0);
}
h6
{
	color: rgb(255,255,255);
}

p{
font-size: 9pt;
}

td {padding-bottom:50px;}


I want the scrollbars to be coloured, and usualy it's like this:


body {    scrollbar-face-color: #000000; 
          scrollbar-highlight-color: #000000; 
          scrollbar-shadow-color: #F99000; 
          scrollbar-arrow-color: #F99000; 
          scrollbar-track-color: #000000; }


But this doesn't work anywhere inside the CSS, and I don't understand, new tag doesn't work, de { -- } part added to the body also doesn't work... what the hell am I doing wrong???

Maybe you can help me with that to Smiley cligne Smiley scotch and I will be happy... again!!!
Sujet clos
Aller à