Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Gaurav 12 posts 32 karma points
    Jul 08, 2011 @ 14:17
    Gaurav
    0

    List all images in a media folder using XSLT in Umbraco 4.7.0?

    Hi

     

    I have an umbraco page on which the user can pick a media folder. Now I want to write an XSLT-script that takes the picked folder and lists all images that are in it using some sort of for-each loop.

     

    Regards,

    Gaurav.

  • Bas Schouten 135 posts 233 karma points
    Jul 08, 2011 @ 14:24
    Bas Schouten
    0

    Hi Gaurav,

    Try something like this:

    It includes:

    - Paging
    - Thumbs with imagegen
    - Link to original file

    'fotos' is in this case the property in your documenttype.

     

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp "&#x00A0;"> ]>
    <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"
      exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">
     <xsl:output method="xml" omit-xml-declaration="yes" />
     <xsl:param name="currentPage"/>
     <!-- Input the documenttype you want here -->
     <xsl:template match="/">
      <xsl:if test="$currentPage/fotos !=''">
       <xsl:variable name="recordsPerPage" select="10"/>
       <xsl:variable name="pageNumber" >
        <xsl:choose>
         <xsl:when test="umbraco.library:RequestQueryString('page') &lt;= 0 or string(umbraco.library:RequestQueryString('page')) = '' or string(umbraco.library:RequestQueryString('page')) = 'NaN'">0</xsl:when>
         <xsl:otherwise>
          <xsl:value-of select="umbraco.library:RequestQueryString('page')"/>
         </xsl:otherwise>
        </xsl:choose>
       </xsl:variable>
       <xsl:variable name="images" select="$currentPage/fotos"/>
       <xsl:variable name="mediaItems" select="umbraco.library:GetMedia($images, true())/Image"/>
       <xsl:variable name="numberOfRecords" select="count($mediaItems)" />
       <!-- The fun starts here -->
       <xsl:for-each select="$mediaItems">
        <xsl:if test="position() &gt; $recordsPerPage * number($pageNumber) and position() &lt;= number($recordsPerPage * number($pageNumber) + $recordsPerPage )">
         <xsl:variable name="picFile" select="umbracoFile"/>
         <div class="thumb">
          <!-- this can be used to link to the image -->
          <xsl:element name="a">
           <xsl:attribute name="href">
            <xsl:value-of select="./umbracoFile" />
           </xsl:attribute>
           <!-- the rel and id attribute can be used to fire fancybox -->
           <xsl:attribute name="id">
            <xsl:text>gallery</xsl:text>
           </xsl:attribute>
           <xsl:attribute name="rel">
            <xsl:text>gallery</xsl:text>
           </xsl:attribute>
           <img>
            <xsl:attribute name="src">
             <xsl:text>/ImageGen.ashx?image=</xsl:text>
             <xsl:value-of select="$picFile"/>
             <xsl:text>&amp;width=100&amp;height=100&amp;constrain=true&amp;pad=true&amp;bgcolor=white</xsl:text>
            </xsl:attribute>
           </img>
          </xsl:element>
         </div>
        </xsl:if>
       </xsl:for-each>
       <p>
        <br />
        <xsl:if test="$pageNumber &gt; 0">
         <a href="?page={$pageNumber -1}&amp;id={umbraco.library:RequestQueryString('id')}">previous</a>
         &nbsp;</xsl:if>
        <xsl:call-template name="for.loop">
         <xsl:with-param name="i">1</xsl:with-param>
         <xsl:with-param name="page" select="$pageNumber +1"></xsl:with-param>
         <xsl:with-param name="count" select="ceiling(count($currentPage/* [@isDoc])div $recordsPerPage)"></xsl:with-param>
        </xsl:call-template>
        <xsl:if test="(($pageNumber +1 ) * $recordsPerPage) &lt; ($numberOfRecords)">
         <a href="?page={$pageNumber +1}&amp;id={umbraco.library:RequestQueryString('id')}">next</a>
        </xsl:if>
       </p>
      </xsl:if>
     </xsl:template>
     <xsl:template name="for.loop">
      <xsl:param name="i"/>
      <xsl:param name="count"/>
      <xsl:param name="page"/>
      <xsl:if test="$i &lt;= $count">
       <xsl:if test="$page != $i">
        <a href="{umbraco.library:NiceUrl($currentPage/@id)}?page={$i - 1}&amp;id={umbraco.library:RequestQueryString('id')}" >
         <xsl:value-of select="$i" />
        </a>
       </xsl:if>
       <xsl:if test="$page = $i">
        <xsl:value-of select="$i" />
       </xsl:if>
       /</xsl:if>
      <xsl:if test="$i &lt;= $count">
       <xsl:call-template name="for.loop">
        <xsl:with-param name="i">
         <xsl:value-of select="$i + 1"/>
        </xsl:with-param>
        <xsl:with-param name="count">
         <xsl:value-of select="$count"/>
        </xsl:with-param>
        <xsl:with-param name="page">
         <xsl:value-of select="$page"/>
        </xsl:with-param>
       </xsl:call-template>
      </xsl:if>
     </xsl:template>
    </xsl:stylesheet>
  • Gaurav 12 posts 32 karma points
    Jul 08, 2011 @ 14:48
    Gaurav
    0

    Hi Bas Schouten ,

                                              thanks for your relpy.

                                    image are comes in anchor tag and img tag , but image can not show on page .

  • Bas Schouten 135 posts 233 karma points
    Jul 08, 2011 @ 15:01
    Bas Schouten
    0

    Is ImageGen installed? (http://our.umbraco.org/projects/website-utilities/imagegen)

    If not the images wont show. Test again after replacing

            <xsl:attributename="src">
    <xsl:text>/ImageGen.ashx?image=</xsl:text>
    <xsl:value-ofselect="$picFile"/>
    <xsl:text>&amp;width=100&amp;height=100&amp;constrain=true&amp;pad=true&amp;bgcolor=white</xsl:text>
    </xsl:attribute>

    With

            <xsl:attributename="src">
            
    <xsl:value-ofselect="$picFile"/>
            
    </xsl:attribute>

  • Gaurav 12 posts 32 karma points
    Jul 08, 2011 @ 15:15
    Gaurav
    0

    Hi Bas Schouten,

                              you are right i am not install the ImageGen.

                             Now i am installing the imageGen.

                            thanks for your reply.

     

     

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies