[Radiant] children:each vs. navigation

[Jim Herring]

Hi Loren,

I ended up solving this particular problem a different way, but the original
issue is still a pain.

This part in particualr is where I'm losing you:
>
> > the problem in that case are the r:link & r:content bits referring to
> > the current page rather than the page I'm creating a link.
>
> Can you clarify this part and I might be able to help. I'm currently
> implementing a site in Radiant which is requiring plent of
> <r:navigation... tags and is crying for some more automated options that
> still have some r:navigation style "selected" and "here" class tagging.
>
>
Here is (I hope) a lucid description. What I found is that inside an
r:children:each tag, one has full access to each child's data: title, url,
link, slug, content, etc. The drawback with r:children:each is that the
ability to order and filter the child is, errr, rather primative. :-)

The navigation tag on the other hand allows complete manual control over the
items looped over. The drawback is that inside a navigation tag one doesn't
actually have access to the pages being referred to. For example, here is a
simple nav component for doodads. /doodads/ is the main doodad page, and it
has perhaps 10 children, each of which is a different doodad detail page
(doodad-1, doodad-2, ... doodad-n). The component is meant to be shown on
the doodad overview and detail pages, and should highlight the doodad page
we are on, if we are on a doodad detail page.

<div id="doodad-selector">
  <r:navigation urls="Doodad 1:/doodads/doodad-1; ... Doodad
N:/doodads/doodad-N">
    <r:normal>
      <r:link><div class="item">
        <h3><r:title /></h3><r:content part="navline" /></div>
      </r:link>
    </r:normal>
    <r:selected>
      <r:link><div class="item active">
        <h3><r:title /></h3><r:content part="navline" /></div>
      </r:link>
    </r:selected>
  </r:navigation>
</div>


This works great as a snippet with one huge exception- the <r:content> tags
refer to whatever page the user is looking at, not to the urls fed in by the
navigation tag. I was wrong about the link tag not working here, it does.

I ended up solving the problem using children:each and some css to get
around the lack of normal/here/selected tags. By setting the pages body
id="<r:slug />" and the div.item ids to each doodad's r:slug it became easy
to write CSS to "activate" any div.item whose id == body's id.

<style>
<r:find url="/doodads">
  <r:children:each by="title">
    body#<r:slug /> #doodad-selector .item#<r:slug /> { background-color:
#ffc }
    body#<r:slug /> #doodad-selector .item#<r:slug /> h3 { color: #333 }
  </r:children:each>
</r:find>
</style>

<div id="doodad-selector">
  <r:find url="/doodads">
    <r:link><div class="item" id="head"><h3>Doodad Nav</h3></div></r:link>

    <r:children:each by="title">
      <r:link><div class="item" id="<r:slug />">
          <h3><r:title /></h3><r:content part="navline" /></div>
      </r:link>
    </r:children:each>
  </r:find>
</div>

That worked well for my purposes, but I would still love to have a
navigation tag that refers to actual pages rather than title/url pairs. Or
maybe better would be an <r:foreach> tag which operates on a list of pages
or the children of some page, and allows here / selected matching inside.

All in all though Radiant has offered elegant solutions for most aspects of
the site I'm building.

Jim
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.radiantcms.org/pipermail/radiant/attachments/20061023/188c7f10/attachment.html