Penultimate link?

44 Posts

creativejay Reply #1, 14 years, 10 months ago

I'm trying to create navigation for a web comic within Revo.

In the top level there is a resource parent for displaying the latest comic. It calls the actual comic image with getResource. Beneath that is another parent called Archive, which houses all the actual comic resources.

I'm using siblingNav between the comic resources, which works as it should. But to simulate that navigation on the Comic resource, I am having trouble getting the "previous" link working. The "first" link is always going to be Page 1 so I just linked that to ID15. The "next" and "last" links don't need to function since that resource will always show the latest comic.

Does anyone have a method for linking to a penultimate child resource of a container resource?

Here's the navigation, working properly, on the children resources of Archive...
http://www.nativecomic.com/portiaFlack/page-2-bedtime-stories.html

Here it is, with the "previous" link non-functioning, on the top level Comic page...
http://www.nativecomic.com/portiaFlack/comic/

The comic page resources have publishedon settings, if there's a way to use that.

☆ A M B ☆
318 Posts

freejung Reply #2, 14 years, 10 months ago

One way to do this would be to use getResources, sorted by publishedon date, with a limit of one.

44 Posts

creativejay Reply #3, 14 years, 10 months ago

Thanks for your response. It wasn't quite what I meant but it did trigger me to figure it out!

I used getResources, sorted by publishedon date, limit of one, excluding the 'current' resource, which was nested properly so that it saw the excluded resource as the latest comic rather than the parent resource.

I can post the chunks and snippet calls if anyone is interested, but I want to wait for a couple more pages to go up to make sure it actually works the way I intended!

44 Posts

creativejay Reply #4, 14 years, 9 months ago

Okay, here is the working code. We're on page 6 now, so I know for certain it works as intended!

My "Comic" resource contains this getResources call:

[[getResources? &parents=`14` &includeTVs=`1` &includeTVList=`comicIMG` &includeContent=`1` &processTVs =`1` &tpl=`latestComic` &limit=`1` &depth=`1` &hiddenFields=`publishedon`]]

The comicIMG tv is just that, the image I upload for the comic in each resource.

The latestComic template contains the following:

<section>
     <article id="comic">
     <img src="[[+tv.comicIMG?]]" alt="[[+longtitle]]">
     </article>
     <article id="authorComments">
          <p>[[+introtext]]</p>
     </article>
     <nav id="comicNav">
     <ul>
     <li><a href="[[~15]]">|<</a></li>
     <li>[[getResources? &tpl=`penultimate` &parents=`14` &depth=`1` &limit=`1` &resources=`-[[+id]]`]]</li>
     <li class="datetime"> <time datetime="[[+publishedon:strtotime:date=`%Y-%m-%d`]]" pubdate>[[+publishedon:strtotime:date=`%A<br>%m-%d-%Y`]]</time> </li>
     <li>></li>
     <li>>|</li>
     </ul>
     </nav>
</section>

Because three of the navigation items never change ("first" links to resource 15, "next" and "last" are non-functioning), there wasn't any point in using a snippet for that. You can see that I basically called for the newest resource in under the "Archive (14)" container, excluding the resource currently being viewed, which I knew would be the last. By elimination, this call retrieves the penultimate link.

Additionally I set up a mobile version of the site, at http://www.nativecomic.com/mobile.html. I wanted the "mobile.html" URL to deliver the latest page always, which after bookmarking on my iPhone and checking in around the time I posted page 4, I realized it was not.

"Mobile" resource content:

[[getResources? &parents=`14` &limit=`1` &depth=`1` &includeTVs=`1` &includeTVList=`comicIMG` &includeContent=`1` &processTVs =`1` &tpl=`mobileComic`]]

"mobileComic" chunk template content:

<section>


<nav id="mobileNav"><ul>
  [[!+page.nav]]
</ul></nav>
	
[[!getPage@latestNav?
   &elementClass=`modSnippet`
   &element=`getResources`
 
   &parents=`14`
   &depth=`1`
   &limit=`1`
   &pageVarKey=`page`
   &sortdir=`DESC` 
   &includeTVs=`1`
   &includeContent=`1`
 
   &tpl=`mobileNav`
]]

<nav id="mobileNav"><ul>
  [[!+page.nav]]
</ul></nav>
</section>

<div style="clear:both;"></div>

This was a bit harrowing, because it took me a while to figure out that if I sorted DESC instead of ASC, it was going to consider the latest page to be the 'First' page.

So in the getPage snippet, I created a property called latestNav, which contains this order for the nav items:

[[+last]][[+next]][[+prev]][[+first]]

Then I switched the text for each so:

pageLastTpl = "First"
pageNextTpl = "Previous"
pagePrevTpl = "Next"
pageFirstTpl = "Last"

This ensures that the viewer sees the links above and below the comic image in the right order, and that they go to the right place.

There's also the archive view, which uses "list-docs-thumb" to display a thumbnail for each comic page. That's pretty standard, though, not really any customization other than which fields are displayed, so I won't go into it.