|
|
 Rank: Enthusiast
Joined: 10/28/2007 Posts: 17 Location: Roskilde, Denmark
|
I have uploaded some pictures in several folders via the Media page in the admin module. The structure is like the one showed below: Brand 1 Type 1 (Several pictures) Type 2 (Several pictures)
I have about five different brands. So what I wan't to do is to make five pages each pointing to one of the brands. The system should then be able show first a page with the different types and after pressing a type all the pictures under the type should be showed.
But how do I do this I have no idea.
Thanks.
Martin
|
|
 Rank: Fanatic
Joined: 9/27/2007 Posts: 498 Location: Belgium
|
Hi Martin, You should definitely check out creative website package by Warren Buckley, which includes a 'simple' photo gallery. It should get you jumpstarted on this subject. For listing sub nodes of a specific node, I think you may be able to use one of the standard macro's or xslt files available from the dropdown. Shoot if you have more questions. Grtz, Dirk
level 1 certified - umbraco blog at netaddicts.be
|
|
 Rank: Enthusiast
Joined: 10/28/2007 Posts: 17 Location: Roskilde, Denmark
|
Hi again,
The package you reefer to is where you upload the picture to this particular page. I would like to choose a folder with for example the “media picker” data type. Then the system should show the picture in this folder.
|
|
 Rank: Fanatic
Joined: 10/9/2006 Posts: 355
|
martin, here is the approach i take... i use two docTypes: a gallery category [for listing sub galleries] and a gallery [that lists all the pictures] i use the drag and drop multi media picker from lefteris http://forum.umbraco.org/14886#post-14886 and imageGen... then add a little bit of xlst... here is the xslt i use to list the galleries... Code:<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE xsl:Stylesheet [ <!ENTITY nbsp " "> ]> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:msxml="urn:schemas-microsoft-com:xslt" xmlns:umbraco.library="urn:umbraco.library" exclude-result-prefixes="msxml umbraco.library">
<xsl:output method="xml" omit-xml-declaration="yes"/>
<xsl:param name="currentPage"/>
<xsl:template match="/">
<!-- start writing XSLT --> <xsl:for-each select="$currentPage/node [string(data [@alias='umbracoNaviHide']) != '1']"> <xsl:variable name="picFile" select="./data[@alias='mainGalleryIMG']"/> <xsl:variable name="galImage" select="umbraco.library:GetMedia($picFile,0)/data[@alias='umbracoFile']"/> <a href="{umbraco.library:NiceUrl(@id)}"> <img> <xsl:attribute name="src">/umbraco/imageGen.aspx?image=<xsl:value-of select="$galImage"/>&width=200&height=100&constrain=true</xsl:attribute> <xsl:attribute name="class">reflect rheight25 ropacity35</xsl:attribute> <xsl:attribute name ="style">float:left;margin:0 15px 20px 0;</xsl:attribute> </img> </a>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet> and here is the xslt i use for listing out the pictures: Code:<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE xsl:Stylesheet [ <!ENTITY nbsp " "> ]> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:msxsl="urn:schemas-microsoft-com:xslt" xmlns:umbraco.library="urn:umbraco.library" xmlns:StarRating="urn:StarRating" exclude-result-prefixes="umbraco.library StarRating">
<xsl:output method="xml" omit-xml-declaration="yes"/>
<xsl:param name="currentPage"/>
<xsl:template match="/">
<!-- start writing XSLT --> <xsl:if test="($currentPage/data[@alias='galImages']/descendant::node!='')"> <xsl:variable name="images" select="$currentPage/data[@alias='galImages']"/> <xsl:for-each select="$images/descendant::node"> <div class="picHolder"> <xsl:variable name="theNode" select="."/> <xsl:variable name="picFile" select="umbraco.library:GetMedia(.,0)/data[@alias='umbracoFile']"/> <div class="galPic"> <a href="{$picFile}" rel='lightbox' title='Rate this image: <span class='inline-rating'><ul class='star-rating small-star'> <li class='current-rating' style='width:{StarRating:getPercentage($theNode)}%;' id='{$theNode}'> </li><li><a href='javascript:updateStarRatingBar("{$theNode}",1,0,"","")' class='one-star'>1</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",2,0,"","")' class='two-stars'>2</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",3,0,"","")' class='three-stars'>3</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",4,0,"","")' class='four-stars'>4</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",5,0,"","")' class='five-stars'>5</a></li></ul> </span>'> <img> <xsl:attribute name="src"> /umbraco/imageGen.aspx?image=<xsl:value-of select="$picFile"/>&width=200&height=100&constrain=true </xsl:attribute> <xsl:attribute name ="style">float:left;margin:0 15px 3px 0;</xsl:attribute> </img> </a> </div> <div class="rateBlock"> Rate this image: <span class='inline-rating'><ul class='star-rating small-star'> <li class='current-rating' style='width:{StarRating:getPercentage($theNode)}%;' id='{$theNode}'> </li><li><a href='javascript:updateStarRatingBar("{$theNode}",1,0,"","")' class='one-star'>1</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",2,0,"","")' class='two-stars'>2</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",3,0,"","")' class='three-stars'>3</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",4,0,"","")' class='four-stars'>4</a></li><li><a href='javascript:updateStarRatingBar("{$theNode}",5,0,"","")' class='five-stars'>5</a></li></ul> </span> </div> </div> </xsl:for-each> </xsl:if>
</xsl:template>
</xsl:stylesheet> now as you can see... i have not scrubbed this xslt and i am also using a star rating package from Tim G... for my gallery, i also use jqueryLightbox... but it is not necessary... with it all put together, it looks like this.... http://www.baty-barr.com/pics.aspxi hope this sheds some light on what you can do with galleries...
bootnumlock - aka bob baty-barr [ http://www.baty-barr.com] Level 1 Certified!
|
|
 Rank: Addict
Joined: 7/19/2006 Posts: 739 Location: Århus, Denmark
|
You can also do what you want. Just select a folder and them loop through the media in that folder using getmedia in xslt. Here is an example (I'm also using imagegen, but I hope this makes sense anyways): Code:
<xsl:variable name="propimages" select="umbraco.library:GetMedia($prop/data[@alias = 'allPhotosFolder'], 1)" />
<div id="mediadata">
<h2>Photos</h2>
<!-- Check if there are images in the selected folder -->
<xsl:if test="count($propimages/node) > 0">
<ul>
<xsl:for-each select="$propimages/node">
<li>
<a href="/umbraco/ImageGen.aspx?image={./data[@alias = 'umbracoFile']}&width=400&height=300&text=Immerimmobilien.de&fontsize=15&FontStyle=bold&align=right&valign=bottom&fontcolor=BBD3E2" title="{./@nodeName}" target="_blank">
<xsl:value-of select="@nodeName"/>
</a>
</li>
</xsl:for-each>
</ul>
</xsl:if>
</div>
<div id="mediastage">
<img src="/umbraco/ImageGen.aspx?image={$propimages/node[1]/data[@alias = 'umbracoFile']}&width=400&height=300&text=Immerimmobilien.de&fontsize=15&FontStyle=bold&align=right&valign=bottom&fontcolor=BBD3E2" alt="{$propTitle}" />
</div>
|
|
 Rank: Devotee
Joined: 7/20/2006 Posts: 75
|
hey I was wondering if you can also list out the media items using a python script. And how you could do that.
Does anyone know what would be faster? using xslt or python (given you can do that)
Gísli
"We come from the land of the ice and snow, From the midnight sun where the hot springs blow"
|
|
 Rank: Enthusiast
Joined: 10/28/2007 Posts: 17 Location: Roskilde, Denmark
|
Hi Morten,
How is this variable $prop defined?
<xsl:variable name="propimages" select="umbraco.library:GetMedia($prop/data[@alias = 'PictureFolder'], 1)" />
I'm getting an error on this.
Thanks
Martin
|
|
 Rank: Addict
Joined: 7/19/2006 Posts: 739 Location: Århus, Denmark
|
Ahh.. this is part of a large xslt file that gets info from a property (like a house), so therefore the $prop variable... But you can just substitute this $prop/data[@alias = 'PictureFolder'] with the ID of the folder that contains the images/files that you want to loop through... $prop just contains a regular node, so you could go with $currentPage/data[@alias = 'YourOwnPropertyAlias'] if that fits your needs...
|
|
 Rank: Enthusiast
Joined: 10/28/2007 Posts: 17 Location: Roskilde, Denmark
|
I'm really not good at xslt. I might have to buy a book about this because I'm having diffulties understanding how to program this. When I use the code below I get the following error. System.Xml.XPath.XPathException: Function 'umbraco.library:GetMedia()' has failed. ---> System.OverflowException: Value was either too large or too small for an Int32.
[code=xslt] <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> ]> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:msxml="urn:schemas-microsoft-com:xslt" xmlns:umbraco.library="urn:umbraco.library" exclude-result-prefixes="msxml umbraco.library"> <xsl:output method="xml" omit-xml-declaration="yes" indent="yes"/>
<xsl:param name="currentPage"/>
<xsl:variable name="propimages" select="umbraco.library:GetMedia($currentPage/data[@alias = 'allPhotosFolder'], 1)" />
<xsl:template match="/"> <h2>Photos</h2> <!-- Check if there are images in the selected folder --> <xsl:if test="count($propimages/node) > 0"> <ul> <xsl:for-each select="$propimages/node"> <li> <a href="/umbraco/ImageGen.aspx?image={./data[@alias = 'umbracoFile']}&width=400&height=300&text=Billede&fontsize=15&FontStyle=bold&align=right&valign=bottom&fontcolor=BBD3E2" title="{./@nodeName}" target="_blank"> <xsl:value-of select="@nodeName"/> </a> </li> </xsl:for-each> </ul> </xsl:if> <br/> <img src="/umbraco/ImageGen.aspx?image={$propimages/node[1]/data[@alias = 'umbracoFile']}&width=400&height=300&text=Billede&fontsize=15&FontStyle=bold&align=right&valign=bottom&fontcolor=BBD3E2" alt="{$propTitle}" />
</xsl:template> </xsl:stylesheet>
[/code=xslt]
Thanks
|
|
 Rank: Fanatic
Joined: 7/20/2006 Posts: 453 Location: NL
|
I've seen this behaviour on v3 of umbraco. I think it fails somewhere in the pre-compilation of the xslt. Try this instead: Code: <xsl:variable name="propimages"> <xsl:choose> <xsl:when test="$currentPage/data[@alias = 'allPhotosFolder'] != ''"> <xsl:value-of select="umbraco.library:GetMedia($currentPage/data[@alias = 'allPhotosFolder'], 1)" /> </xsl:when> <xsl:otherwise> <xsl:value-of select="umbraco.library:GetMedia(SOME_OTHER_DEFAULT_NUMERIC_VALUE_OF_ALBUM_THAT_EXISTS, 1)" /> </xsl:otherwise> </xsl:choose> </xsl:variable>
HTH, PeterD Working on an events-calendar with recursion. Post requests on my blog!
|
|
 Rank: Enthusiast
Joined: 10/28/2007 Posts: 17 Location: Roskilde, Denmark
|
I'm still not able to save this I get the following error message: Error occured System.Xml.XPath.XPathException: Expression must evaluate to a node-set. at MS.Internal.Xml.XPath.ExtensionQuery.Advance() at MS.Internal.Xml.XPath.ChildrenQuery.Advance() at MS.Internal.Xml.XPath.NodeFunctions.Evaluate(XPathNodeIterator context) at MS.Internal.Xml.XPath.LogicalExpr.Evaluate(XPathNodeIterator nodeIterator) at MS.Internal.Xml.XPath.BooleanFunctions.toBoolean(XPathNodeIterator nodeIterator) at MS.Internal.Xml.XPath.BooleanFunctions.Evaluate(XPathNodeIterator nodeIterator) at System.Xml.Xsl.XsltOld.Processor.EvaluateBoolean(ActionFrame context, Int32 key) at System.Xml.Xsl.XsltOld.IfAction.Execute(Processor processor, ActionFrame frame) at System.Xml.Xsl.XsltOld.ActionFrame.Execute(Processor processor) at System.Xml.Xsl.XsltOld.Processor.Execute() at System.Xml.Xsl.XsltOld.Processor.Execute(TextWriter writer) at System.Xml.Xsl.XslTransform.Transform(XPathNavigator input, XsltArgumentList args, TextWriter output, XmlResolver resolver) at System.Xml.Xsl.XslTransform.Transform(IXPathNavigable input, XsltArgumentList args, TextWriter output, XmlResolver resolver) at umbraco.presentation.webservices.codeEditorSave.SaveXslt(String fileName, String fileContents, Boolean ignoreDebugging)
I don't know about this node-set on how this works. What is wrong in the code? Thanks Code:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:stylesheet [
<!ENTITY nbsp " ">
]>
<xsl:stylesheet
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxml="urn:schemas-microsoft-com:xslt"
xmlns:umbraco.library="urn:umbraco.library"
exclude-result-prefixes="msxml umbraco.library">
<xsl:output method="xml" omit-xml-declaration="yes" indent="yes"/>
<xsl:param name="currentPage"/>
<xsl:variable name="propimages">
<xsl:choose>
<xsl:when test="$currentPage/data[@alias = 'BilledeMappe'] != ''">
<xsl:value-of select="umbraco.library:GetMedia($currentPage/data[@alias = 'BilledeMappe'], 1)" />
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="umbraco.library:GetMedia(1097, 1)" />
</xsl:otherwise>
</xsl:choose>
</xsl:variable>
<xsl:template match="/">
<center>
<h3>
Billeder
</h3>
</center>
<!-- Check if there are images in the selected folder -->
<xsl:if test="count($propimages/node) > 0">
<ul>
<xsl:for-each select="$propimages/node">
<li>
<a href="/umbraco/ImageGen.aspx?image={./data[@alias = 'umbracoFile']}&width=400&height=300&text=Immerimmobilien.de&fontsize=15&FontStyle=bold&align=right&valign=bottom&fontcolor=BBD3E2" title="{./@nodeName}" target="_blank">
<xsl:value-of select="@nodeName"/>
</a>
</li>
</xsl:for-each>
</ul>
</xsl:if>
<img src="/umbraco/ImageGen.aspx?image={$propimages/node[1]/data[@alias = 'umbracoFile']}&width=400&height=300&text=Immerimmobilien.de&fontsize=15&FontStyle=bold&align=right&valign=bottom&fontcolor=BBD3E2" />
</xsl:template>
</xsl:stylesheet>
|
|
 Rank: Enthusiast
Joined: 10/28/2007 Posts: 17 Location: Roskilde, Denmark
|
It's been a while since I have been working on this. The problem seems to be the combination of "$propimages/node" I'm not allowed to put /node like this.
So this line is making some problems for me: <xsl:for-each select="$propimages/node">
How do I get it to run through the nodes. I can for instances get the following information from $propimages /media/1216/billede 252.jpg1000750544534jpg/media/1221/billede 254.jpg1000750761608jpg/media/1226/billede 255.jpg1000750730651jpg/media/1231/billede 256.jpg1000750612077jpg/media/1236/billede 258.jpg1000750576276jpg/media/1241/billede 259.jpg1000750587591jpg/media/1246/billede 261.jpg1000750691745jpg/media/1251/billede 262.jpg1000750728697jpg/media/1256/billede 264.jpg1000750283585jpg/media/1261/billede 267.jpg1000750746842jpg/media/1266/billede 268.jpg1000750612567jpg/media/1271/billede 269.jpg1000750745063jpg
|
|
 Rank: Addict
Joined: 7/19/2006 Posts: 599 Location: Preston, UK
|
Sornsen, The issue is here Code:
<xsl:variable name="propimages"> <xsl:choose> <xsl:when test="$currentPage/data[@alias = 'BilledeMappe'] != ''"> <xsl:value-of select="umbraco.library:GetMedia($currentPage/data[@alias = 'BilledeMappe'], 1)" /> </xsl:when> <xsl:otherwise> <xsl:value-of select="umbraco.library:GetMedia(1097, 1)" /> </xsl:otherwise> </xsl:choose> </xsl:variable>
you need to make the propimages into a node set using msxml-nodeset. There is a post i did about it forums somewhere. Another way round this is where you have your code in loop move it into its own template Code: <xsl:template match="node">
<li> <a href="/umbraco/ImageGen.aspx?image={./data[@alias = 'umbracoFile']}&width=400&height=300&text=Immerimmobilien.de&fontsize=15&FontStyle=bold&align=right&valign=bottom&fontcolor=BBD3E2" title="{./@nodeName}" target="_blank"> <xsl:value-of select="@nodeName"/> </a> </li>
</xsl:template>
then call it in this way Code:
<xsl:choose> <xsl:when test="$currentPage/data[@alias = 'BilledeMappe'] != ''"> <xsl:apply-templates select="umbraco.library:GetMedia($currentPage/data[@alias = 'BilledeMappe'], 1)" /> </xsl:when> <xsl:otherwise> <xsl:apply-templates select="umbraco.library:GetMedia(1097, 1)" /> </xsl:otherwise> </xsl:choose>
this way you are conditionally passing a node set.
Level 2 certified. If it aint broke dont fix.
|
|
|
Guest |