Hi Chris,

I have a couple of randomized slideshows running. In this post I will recommend that you make an xslt with a for-each and include a bit of inline code to get the random function when sorting the list items. Doing so you will be able to reuse the xslt on different pages and making it possible to pick a new media folder on each page.

This example is made with the new xml schema.

First of all you need to include some inline code for the random feature. Add the following line 'xmlns:random="urn:random" ' and 'random' as shown below:

<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" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets" 
  xmlns:random="urn:random"
  exclude-result-prefixes="msxml
 umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes 
Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings 
Exslt.ExsltSets random ">

Then paste the following just beneath the currentPage-param:

    <msxml:script implements-prefix="random" language="C#">
    <msxml:assembly name="umbraco"/>
    <msxml:using namespace="umbraco"/>
    
    public int GetRandom(int minValue, int maxValue)
    {
    return umbraco.library.GetRandom().Next(minValue, maxValue);
    }
    ]]>
    msxml:script>

Next you could make a new property on the page with the alias 'getImages' and 'Media picker' as type. This will make it possible for you (and the end-User) to pick a different media folder for a given page. Then you make a couple of variables to get the images in the chosen media folder:

    <xsl:variable name="mediaId" select="number($currentPage/getImages)" />
    <xsl:variable name="images" select="umbraco.library:GetMedia($mediaId, 1)/descendant::* [name()='Image']" />

If you prefer to pick the media folder while inserting the macro you'll have to make a parameter called 'getImages' and type 'Media picker'. Instead of $currentPage you will have to write /macro in the first variable.

<ul>
  <xsl:for-each select="$images">
  <xsl:sort order="ascending" select="random:GetRandom(1, count($images))"/>
  
    <li>
      <img alt="{@nodeName}" title="{@nodeName}" src="{concat(substring-before(umbracoFile,'.'), '.jpg')}"/>
    </li>
  
  </xsl:for-each>
</ul>

The sort-statement picks a random number FROM 1 TO the total number of images in the folder!

If you would like to make a slideshow you would just take away the if-statement and then use any of the multiple jQuery packages (ie innerfade).

If you encounter any problems please get back to me.

All the best,

Søren

This works just as I wanted - thank-you very much.

One feature I'd like to add;
   When an image is displayed I'd like it to have a link to the underlying story page against the image.
   I'd like a link 'property' to be stored against a media item and have it output in the HTML

Any ideas ?

Aaah..., I didn't realise / had forgotten we can add properties against Media Types.

Thank-you, that'll do nicely.

Hi Chris.

I'm glad that I could help you. Would you mind marking my response as a solution.

Thanks,

Søren

This is very helpful, i found myself wanting to randomise a list of xslt nodes but no idea how to!

This solution for randomisation of nodes has been a life-saver for me too - thanks.

is working on a reply...