Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > XML > XSLT
Password Reminder
Register
| FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
XSLT General questions and answers about XSLT. For issues strictly specific to the book XSLT 1.1 Programmers Reference, please post to that forum instead.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the XSLT section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old February 11th, 2007, 09:13 AM
Registered User
 
Join Date: Feb 2007
Location: , , .
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
Default xslt slide show

Hi all,
I am at the beginning level of learning xslt and I am building a slideshow using xslt and I AM STACK.... any help

I tried to generate the image index position for each photo (like 1/10, 2/10, .... 10/10 to each slideshow image)

Here is the xml


<?xml version="1.0" encoding="iso-8859-1"?>
<system-index-block name="slide-show-pic" current-time="1170453829775">
<system-file id="4a482a098da6186301db9b75e575659d">
<name>this is the first image name - _MG_0750.jpg</name>
<is-published>true</is-published>
<display-name>this is image 1</display-name>
    <path>_MG_0750.jpg</path>
<created-by>aareki</created-by>
<created-on>1169477347901</created-on>
<last-modified-by>aareki</last-modified-by>
<last-modified>1169619738558</last-modified>
<file-size>24927</file-size>
</system-file>

    <system-file id="4a482a728da6186301db9b75f99bf012">
<name>this is the second image name - _MG_0770.jpg</name>
<is-published>true</is-published>
<display-name>this is image 2</display-name>
    <path>_MG_0770.jpg</path>
<created-by>aareki</created-by>
<created-on>1169477347984</created-on>
<last-modified-by>aareki</last-modified-by>
<last-modified>1169619789955</last-modified>
<file-size>29228</file-size>
</system-file>

    <system-file id="4a482aa28da6186301db9b753cebc21d">
<name>this is the third image name -_MG_0777.jpg</name>
<is-published>true</is-published>
    <path>_MG_0777.jpg</path>
<created-by>aareki</created-by>
<created-on>1169477348035</created-on>
<last-modified-by>aareki</last-modified-by>
<last-modified>1169477348035</last-modified>
<file-size>23158</file-size>
</system-file>
</system-index-block>


here is the xslt

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
   <xsl:output indent="yes" method="xml"/>
 <xsl:variable name="separator"> | </xsl:variable>


   <xsl:template match="/">

<h2 align="center">Photo Gallery </h2>
<xsl:apply-templates/>
</xsl:template>


<xsl:template match="system-index-block">
<div>

  <script language="Javascript" type="text/javascript">
<xsl:comment>
<![CDATA[
      var images = new Array();
      var photos = new Array();
      var i = 0;
      ]]>
      <xsl:apply-templates select="system-file"/>

      <![CDATA[

      // now loop over our index of images
      for(var i=0; i <]]><xsl:value-of select="count(system-file)"/><![CDATA[; i++) {
        images[i] = new Image();
        images[i].src = photos[i];
      }

      function forward()
      {
      // this sends the user away if they go past the end
      if(frame >= images.length-1) {
          window.alert('Thank you for viewing the pictures');
          //location.href = "#";
        }
        else
          document.picture.src = images[++frame].src;
      }
      function backwards()
      {
          if(frame == 0) {
            // this sends the user away if they go negative
            window.alert('Thank you for viewing the pictures');
            //location.href = "#";
          }
          else
            document.picture.src = images[frame-1].src;
      }
      function first() { document.picture.src=images[1].src;}
      function last() { document.picture.src=images[images.length-1].src;}

      var frame = 0;

]]>
</xsl:comment>
</script>

    <table align="left" border="0" summary="Photo Gallery - Watts Lecture 2006" width="99%">
        <tr>
          <td/><td>
            <div align="center">
            <a alt="first" href="#" onClick="first()">first</a>
            <xsl:value-of select="$separator"/>
            <a alt="previous" href="#" onClick="backwards()">Previous</a>
            <xsl:value-of select="$separator"/>
            <a alt="next" href="#" onClick="forward()">next</a>
            <xsl:value-of select="$separator"/>
            <a alt="last" href="#" onClick="last()">last</a>
            <xsl:value-of select="$separator"/>
            <a alt="home" href="/external/sites/training_site/Business-School/thumbnail">home</a>
            </div>


<p align="center">
(<xsl:variable name="index">
         <xsl:value-of select="position()"/>
       </xsl:variable>
        <xsl:value-of select="$index"/>
of <xsl:value-of select="count(system-file)"/>)
</p>
          </td><td/>
        </tr>

      <tr>
        <td><img alt="Spacer" height="100" src="/internet/files/images/general/spacer.gif" width="1"/></td>
        <td width="99%">
        <div align="center"><img alt="Picture" name="picture" src="/internet/files/images/general/spacer.gif"/></div>


<p align="center">
(<xsl:variable name="index2"><xsl:value-of select="position()"/> </xsl:variable>
         <xsl:value-of select="$index2"/>
of <xsl:value-of select="count(system-file)"/>)
</p>

        </td><td/>
      </tr>
    </table>



</div>
   </xsl:template>
  <xsl:template match="system-file">

        photos[i] = "[system-asset:file]<xsl:value-of select="path"/>[/system-asset:file]"; i++;
        <xsl:attribute name="id"><xsl:value-of select="position()"/></xsl:attribute>
       <xsl:variable name="index">
         <xsl:value-of select="position()"/>
       </xsl:variable>
        <xsl:value-of select="$index"/>


   </xsl:template>

</xsl:stylesheet>



Note: when you click next I want to see the image position (for example if it is image 4 - 4/10) instead of displaying every position

Reply With Quote
  #2 (permalink)  
Old February 11th, 2007, 09:41 AM
joefawcett's Avatar
Wrox Author
Points: 9,763, Level: 42
Points: 9,763, Level: 42 Points: 9,763, Level: 42 Points: 9,763, Level: 42
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: Exeter, , United Kingdom.
Posts: 3,074
Thanks: 1
Thanked 38 Times in 37 Posts
Default

Well you can do this via JavaScript rather than XSLT. Where exactly is the problem, you just show the current index and the length of the images array.

Your code would also be easier to read if you put all the script inside a CDATA section, not just those bits that need it.

--

Joe (Microsoft MVP - XML)
Reply With Quote
  #3 (permalink)  
Old February 11th, 2007, 11:26 AM
mhkay's Avatar
Wrox Author
Points: 18,481, Level: 59
Points: 18,481, Level: 59 Points: 18,481, Level: 59 Points: 18,481, Level: 59
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Apr 2004
Location: Reading, Berks, United Kingdom.
Posts: 4,960
Thanks: 0
Thanked 292 Times in 287 Posts
Default

Don't try to debug your XSLT at the same time as you debug your HTML and Javascript. First make sure you know exactly what HTML you want to generate (create a mockup by hand and make sure it works). Then write an XSLT stylesheet designed to generate this HTML from your XML. Test it outside the browser to make sure it generates the right HTML. Then (finally) check that the HTML still does the right thing when you load it into the browser.

If you need to report further problems on this list, be sure to distinguish whether the XSLT isn't producing the HTML that you want, or whether the HTML isn't behaving the way that you want when loaded into the browser (the latter isn't an XSLT problem and therefore isn't really in scope for this forum.)

Michael Kay
http://www.saxonica.com/
Author, XSLT Programmer's Reference and XPath 2.0 Programmer's Reference
Reply With Quote
  #4 (permalink)  
Old February 12th, 2007, 12:03 AM
Registered User
 
Join Date: Feb 2007
Location: , , .
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
Default

The XSLT is not producing the html I want. The problem is I couldn't get the numbering when it displays the image. Below on the xml list I have three images. When image three displays I want to see 3/3 somehere let say top-right side of the image. (the same of the first image 1/3, and second image 2/3)

To generate the above I wrote the following but it generate only index one (1/3)

<p align="center">
(<xsl:variable name="index">
         <xsl:value-of select="position()"/>
       </xsl:variable>
        <xsl:value-of select="$index"/>
of <xsl:value-of select="count(system-file)"/>)
</p>

I think my problem is attaching the index numbering with the image ----- any clue or some similar example I can see

Thanks
Reply With Quote
  #5 (permalink)  
Old February 12th, 2007, 04:08 AM
mhkay's Avatar
Wrox Author
Points: 18,481, Level: 59
Points: 18,481, Level: 59 Points: 18,481, Level: 59 Points: 18,481, Level: 59
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Apr 2004
Location: Reading, Berks, United Kingdom.
Posts: 4,960
Thanks: 0
Thanked 292 Times in 287 Posts
Default

Firstly, this code:

<xsl:variable name="index">
         <xsl:value-of select="position()"/>
       </xsl:variable>
        <xsl:value-of select="$index"/>

is equivalent to

<xsl:variable name="index" select="position()"/>
<xsl:value-of select="$index"/>

which is equivalent to

<xsl:value-of select="position()"/>

Code gets easier to debug if you simplify it first...

Secondly, this code appears twice in your stylesheet. It appears in the <xsl:template match="system-index-block">, where it is only executed once and will output "1 of 3". It also appears in the <xsl:template match="system-file">, but that's only called within an <xsl:comment>, so the output won't be displayed.

Michael Kay
http://www.saxonica.com/
Author, XSLT Programmer's Reference and XPath 2.0 Programmer's Reference
Reply With Quote
  #6 (permalink)  
Old February 12th, 2007, 08:58 AM
Registered User
 
Join Date: Feb 2007
Location: , , .
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
Default

That makes sense but even I put the following for-each on
<xsl:template match="system-index-block">; which is outside <xsl:comment> -that didn't give me what I want. I can see the output 123 of 3. But I want it numbering per image display.


<xsl:for-each select="system-file">
<xsl:value-of select="position()"/>
</xsl:for-each>
Reply With Quote
  #7 (permalink)  
Old February 13th, 2007, 10:41 AM
Registered User
 
Join Date: Feb 2007
Location: , , .
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Quote:
quote:Originally posted by mhkay
 Firstly, this code:

<xsl:variable name="index">
         <xsl:value-of select="position()"/>
     </xsl:variable>
        <xsl:value-of select="$index"/>

is equivalent to

<xsl:variable name="index" select="position()"/>
<xsl:value-of select="$index"/>

which is equivalent to

<xsl:value-of select="position()"/>

Code gets easier to debug if you simplify it first...

Secondly, this code appears twice in your stylesheet. It appears in the <xsl:template match="system-index-block">, where it is only executed once and will output "1 of 3". It also appears in the <xsl:template match="system-file">, but that's only called within an <xsl:comment>, so the output won't be displayed.

Michael Kay
http://www.saxonica.com/
Author, XSLT Programmer's Reference and XPath 2.0 Programmer's Reference
how can I displayed the output outside the comment section?


Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Unable to show XML using XSLT deean XSLT 3 June 12th, 2008 07:24 AM
Show CURRENT DATE when transforming XML using XSLT richieWolf XSLT 0 October 20th, 2007 07:47 PM
Image slide-show Rajarshi HTML Code Clinic 1 February 27th, 2006 06:03 AM
Slide Show #1 (New User) WebDevel Javascript How-To 1 March 15th, 2005 09:58 AM



All times are GMT -4. The time now is 07:49 AM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.