Jump to content

XSLT/XML/PHP4 = Image Gallery

kvnmck18

By kvnmck18
in XSLT/XSL-FO

 Share

Recommended Posts

kvnmck18 Member

kvnmck18

Posted
Posted

This just might be a typo...but I think it's a path problem, which I can't seem to figure out (possibly because I'm so tired)...I've used these codes before but my XML was in a different format...It's an image gallery...when thumbnail is clicked it opens as the big image...it has navigation controls (previous and next) and selects between different categories.the xsl:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"><xsl:output method="html" omit-xml-declaration="yes"/>	<xsl:param name="category"/>	<xsl:param name="pageNumber" select="1" />	<xsl:param name="recordsPerPage" select="1" />	<xsl:param name="pagedElement" select="'image'" />	<xsl:param name="totalRecords" select="count(/*/*[name()=$pagedElement])"/>	<xsl:param name="totalPages" select="round($totalRecords div $recordsPerPage)"/>	<xsl:param name="disablePaginationNavigationControls" />	<xsl:param name="disablePaginationNavigationPrevious" />	<xsl:param name="disablePaginationNavigationControl" />	<xsl:param name="disablePaginationNavigationNext" />		<xsl:param name="localLinkBefore" select="'?n='"/>	<xsl:param name="localLinkAfter" />	<xsl:template match="channel/item">		<html>			<head>				<style type="text/css">				.paginationNavigation, .paginationNavigation ul {text-align: center; margin: 0 auto; padding: 0;}				.paginationNavigation ul,  .paginationNavigation ul li {display: inline;}				.paginationNavigation span, .paginationNavigation a {padding: 10px;}				</style>			</head>			<body>				<xsl:apply-templates />			</body>		</html>	</xsl:template>	<xsl:template match="/*">		<xsl:choose>						<xsl:when test="*[name()=$pagedElement]">				<dl>					<xsl:variable name="startPoint" select="($pageNumber - 1) * $recordsPerPage" />					<xsl:for-each select="*[name()=$pagedElement and position()>=1+ $startPoint and position()<=$startPoint + $recordsPerPage]">						<xsl:call-template name="pagedElement" />					</xsl:for-each>				</dl>				<xsl:if test="$disablePaginationNavigationControls = false()">					<xsl:call-template name="paginationNavigation"/>				</xsl:if>			</xsl:when>						<xsl:otherwise>			<h1>Error. No items paged.</h1>			</xsl:otherwise>		</xsl:choose>	</xsl:template><xsl:template name="pagedElement">		<img src="{large}" title="{description}"/>	</xsl:template>		<xsl:template name="paginationNavigation">		<div class="paginationNavigation">			<xsl:call-template name="previous" />			<xsl:call-template name="paginationNavigationControl" />			<xsl:call-template name="next" />		</div>	</xsl:template>		<xsl:template name="previous">		<xsl:if test="$disablePaginationNavigationPrevious = false()">			<xsl:if test="$pageNumber > 1">				<a href="{$localLinkBefore}{$pageNumber - 1}{$localLinkAfter}">Previous</a>			</xsl:if>		</xsl:if>	</xsl:template>		<xsl:template name="paginationNavigationControl">		<xsl:if test="$disablePaginationNavigationControl = false()">			<ul>				<xsl:for-each select="*[name()=$pagedElement and position() <= $totalPages and boolean(@type = $category or not($category))]">					<xsl:variable name="pageNumberControl" select="count(preceding-sibling::*)+1" />					<li>						<xsl:choose><xsl:when test="not($pageNumberControl = $pageNumber)"><a href="{$localLinkBefore}{$pageNumberControl}{$localLinkAfter}"><img src="{url}" title="{title}"/></a></xsl:when>							<xsl:otherwise>								<span>									X								</span>							</xsl:otherwise>						</xsl:choose>					</li>				</xsl:for-each>			</ul>		</xsl:if>	</xsl:template>	<xsl:template name="next">	<xsl:if test="$disablePaginationNavigationNext = false()">		<xsl:if test="$pageNumber < $totalPages">			 <a href="{$localLinkBefore}{$pageNumber + 1}{$localLinkAfter}">Next</a>		</xsl:if>	</xsl:if>	</xsl:template></xsl:stylesheet>

the php:

<?php$pageNumber =  $_GET['n'];$xmlFile = "xml.xml";$xsltFile = "xsl.xsl";if (ereg("^[1-9]*[0-9]*$", $pageNumber)) {$args = array("pageNumber" => $pageNumber,  "category" => $_GET['category'], "localLinkAfter" => "&category=". $_GET['category']);}$engine = xslt_create();$output = xslt_process($engine, $xmlFile, $xsltFile, NULL, NULL, $args);print $output;xslt_free($engine);?>

(how I have the xml set up)xml.xml:

<channel><item><title>This is A Category</title><image type="Type A"><url>images/shows/tn_image.JPG</url><large>images/image.JPG</large><title>The Title</title><description>Description</description></image><image type="Type B"><url>images/shows/tn_image2.JPG</url><large>images/image2.JPG</large><title>The Title2</title><description>Description2</description></image></item><item><title>Another Category</title><image type="Type A"><url>images/shows/tn_imagex.JPG</url><large>images/imagex.JPG</large><title>The Title X</title><description>Description of X</description></image><image type="Type B"><url>images/shows/tn_image2y.JPG</url><large>images/image2y.JPG</large><title>The Title YY</title><description>Description of Y</description></image></item></channel>

Link to comment
Share on other sites
boen_robot w3schools Guru

boen_robot

Posted
Posted

The thing is, the pagedElement template is targeting the element that is just below the root element that has a certain name. In your case, this has to be "item". Also, the template itself should contain a <xsl:for-each> or something to target both <image> elements or something like image[1] to target only the first.

Link to comment
Share on other sites
kvnmck18 Member

kvnmck18

Posted
  • Author
Posted

You (boen_robot) helped me make this... along time ago and it worked but it was in use with a differently formatted XML(<images> <image src="image.jpg" description="Whatever blah" /></images>)I changed a little:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"><xsl:output method="html" omit-xml-declaration="yes"/>	<xsl:param name="category"/>	<xsl:param name="pageNumber" select="1" />	<xsl:param name="recordsPerPage" select="1" />	<xsl:param name="pagedElement" select="'item'" />	<xsl:param name="totalRecords" select="count(/*/*[name()=$pagedElement])"/>	<xsl:param name="totalPages" select="round($totalRecords div $recordsPerPage)"/>	<xsl:param name="disablePaginationNavigationControls" />	<xsl:param name="disablePaginationNavigationPrevious" />	<xsl:param name="disablePaginationNavigationControl" />	<xsl:param name="disablePaginationNavigationNext" />		<xsl:param name="localLinkBefore" select="'?n='"/>	<xsl:param name="localLinkAfter" />	<xsl:template match="channel">		<html>			<head>				<style type="text/css">				.paginationNavigation, .paginationNavigation ul {text-align: center; margin: 0 auto; padding: 0;}				.paginationNavigation ul,  .paginationNavigation ul li {display: inline;}				.paginationNavigation span, .paginationNavigation a {padding: 10px;}				</style>			</head>			<body>				<xsl:apply-templates />			</body>		</html>	</xsl:template>	<xsl:template match="/*">		<xsl:choose>						<xsl:when test="*[name()=$pagedElement]">				<dl>					<xsl:variable name="startPoint" select="($pageNumber - 1) * $recordsPerPage" />					<xsl:for-each select="*[name()=$pagedElement and position()>=1+ $startPoint and position()<=$startPoint + $recordsPerPage]">						<xsl:call-template name="pagedElement" />					</xsl:for-each>				</dl>				<xsl:if test="$disablePaginationNavigationControls = false()">					<xsl:call-template name="paginationNavigation"/>				</xsl:if>			</xsl:when>						<xsl:otherwise>			<h1>Error. No items paged.</h1>			</xsl:otherwise>		</xsl:choose>	</xsl:template><xsl:template name="pagedElement">		<img src="{large}" title="{description}"/>	</xsl:template>		<xsl:template name="paginationNavigation">		<div class="paginationNavigation">			<xsl:call-template name="previous" />			<xsl:call-template name="paginationNavigationControl" />			<xsl:call-template name="next" />		</div>	</xsl:template>		<xsl:template name="previous">		<xsl:if test="$disablePaginationNavigationPrevious = false()">			<xsl:if test="$pageNumber > 1">				<a href="{$localLinkBefore}{$pageNumber - 1}{$localLinkAfter}">Previous</a>			</xsl:if>		</xsl:if>	</xsl:template>		<xsl:template name="paginationNavigationControl">		<xsl:if test="$disablePaginationNavigationControl = false()">			<ul>				<xsl:for-each select="*[name()=$pagedElement and position() <= $totalPages and boolean(@type = $category or not($category))]">					<xsl:variable name="pageNumberControl" select="count(preceding-sibling::*)+1" />					<li>						<xsl:choose><xsl:when test="not($pageNumberControl = $pageNumber)"><a href="{$localLinkBefore}{$pageNumberControl}{$localLinkAfter}"><img src="{url}" title="{title}"/></a></xsl:when>							<xsl:otherwise>								<span>									X								</span>							</xsl:otherwise>						</xsl:choose>					</li>				</xsl:for-each>			</ul>		</xsl:if>	</xsl:template>	<xsl:template name="next">	<xsl:if test="$disablePaginationNavigationNext = false()">		<xsl:if test="$pageNumber < $totalPages">			 <a href="{$localLinkBefore}{$pageNumber + 1}{$localLinkAfter}">Next</a>		</xsl:if>	</xsl:if>	</xsl:template></xsl:stylesheet>

That makes the output with an <img src="" title="Description from the first Item's Description"/> and also the "X"...but nothing else.All it need to be is to follow the path of channel/item[title]/image and list the "url"s in the img attribute and then the "large" in the main opened image.As for the for-each there is one...it's the * path.I know you know this, boen_robot...You are the god of it, don't forget.

Link to comment
Share on other sites
boen_robot w3schools Guru

boen_robot

Posted
Posted 
	<xsl:template name="pagedElement">		<img src="{image[1]/large}" title="{image[1]/description}"/>	</xsl:template>

That is if you want to page all first <image> elements inside each <item>.Or is it each <image> in all <item> regardless of item belonging you want to page? In that case, you need to change the paths of the "/*" template. Like this:

	<xsl:template match="/*">		<xsl:choose>						<xsl:when test="//*[name()=$pagedElement]">				<dl>					<xsl:variable name="startPoint" select="($pageNumber - 1) * $recordsPerPage" />					<xsl:for-each select="//*[name()=$pagedElement and position()>=1+ $startPoint and position()<=$startPoint + $recordsPerPage]">						<xsl:call-template name="pagedElement" />					</xsl:for-each>				</dl>				<xsl:if test="$disablePaginationNavigationControls = false()">					<xsl:call-template name="paginationNavigation"/>				</xsl:if>			</xsl:when>						<xsl:otherwise>			<h1>Error. No items paged.</h1>			</xsl:otherwise>		</xsl:choose>	</xsl:template>

And turn $pagedElement back to "image".

Link to comment
Share on other sites
kvnmck18 Member

kvnmck18

Posted
  • Author
Posted

Cool cool. You forgot one thing (and so did I but I caught it):This needed a minor adjustment:

<xsl:param name="totalRecords" select="count(//*[name()=$pagedElement])"/>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"><xsl:output method="html" omit-xml-declaration="yes"/>	<xsl:param name="category"/>	<xsl:param name="pageNumber" select="1" />	<xsl:param name="recordsPerPage" select="1" />	<xsl:param name="pagedElement" select="'image'" />	<xsl:param name="totalRecords" select="count(//*[name()=$pagedElement])"/>	<xsl:param name="totalPages" select="round($totalRecords div $recordsPerPage)"/>	<xsl:param name="disablePaginationNavigationControls" />	<xsl:param name="disablePaginationNavigationPrevious" />	<xsl:param name="disablePaginationNavigationControl" />	<xsl:param name="disablePaginationNavigationNext" />		<xsl:param name="localLinkBefore" select="'?n='"/>	<xsl:param name="localLinkAfter" />	<xsl:template match="/">		<html>			<head>				<style type="text/css">				.paginationNavigation, .paginationNavigation ul {text-align: center; margin: 0 auto; padding: 0;}				.paginationNavigation ul,  .paginationNavigation ul li {display: inline;}				.paginationNavigation span, .paginationNavigation a {padding: 10px;}				</style>			</head>			<body>				<xsl:apply-templates />			</body>		</html>	</xsl:template>	<xsl:template match="/*">		<xsl:choose>						<xsl:when test="//*[name()=$pagedElement]">				<dl>					<xsl:variable name="startPoint" select="($pageNumber - 1) * $recordsPerPage" />					<xsl:for-each select="//*[name()=$pagedElement and position()>=1+ $startPoint and position()<=$startPoint + $recordsPerPage]">						<xsl:call-template name="pagedElement" />					</xsl:for-each>				</dl>				<xsl:if test="$disablePaginationNavigationControls = false()">					<xsl:call-template name="paginationNavigation"/>				</xsl:if>			</xsl:when>						<xsl:otherwise>			<h1>Error. No items paged.</h1>			</xsl:otherwise>		</xsl:choose>	</xsl:template>	<xsl:template name="pagedElement">		<img src="{large}" title="{description}"/>	</xsl:template>		<xsl:template name="paginationNavigation">		<div class="paginationNavigation">			<xsl:call-template name="previous" />			<xsl:call-template name="paginationNavigationControl" />			<xsl:call-template name="next" />		</div>	</xsl:template>		<xsl:template name="previous">		<xsl:if test="$disablePaginationNavigationPrevious = false()">			<xsl:if test="$pageNumber > 1">				<a href="{$localLinkBefore}{$pageNumber - 1}{$localLinkAfter}">Previous</a>			</xsl:if>		</xsl:if>	</xsl:template>		<xsl:template name="paginationNavigationControl">		<xsl:if test="$disablePaginationNavigationControl = false()">			<ul>				<xsl:for-each select="//*[name()=$pagedElement and position() <= $totalPages and boolean(@type = $category or not($category))]">					<xsl:variable name="pageNumberControl" select="count(preceding-sibling::*)+1" />					<li>						<xsl:choose><xsl:when test="not($pageNumberControl = $pageNumber)"><a href="{$localLinkBefore}{$pageNumberControl}{$localLinkAfter}"><img src="{url}" title="{title}"/></a></xsl:when>							<xsl:otherwise>								<span>									X								</span>							</xsl:otherwise>						</xsl:choose>					</li>				</xsl:for-each>			</ul>		</xsl:if>	</xsl:template>	<xsl:template name="next">	<xsl:if test="$disablePaginationNavigationNext = false()">		<xsl:if test="$pageNumber < $totalPages">			 <a href="{$localLinkBefore}{$pageNumber + 1}{$localLinkAfter}">Next</a>		</xsl:if>	</xsl:if>	</xsl:template></xsl:stylesheet>

Oh, and that image[1] does not work here... I'm not really sure how to make that work. Unless it was another choose with a when "n" is null make it be *[image[1]] (or something like that). The image[1]/ brings up no value

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...