Pull variable information from sub-tags?

21 views
Skip to first unread message

kevinpfromnm

unread,
Aug 19, 2011, 2:33:07 PM8/19/11
to hobo...@googlegroups.com
Not exactly the most descriptive but maybe an example will help.

<div id="wrapper">
  <ul>
    <li><a href="#item1">Item 1 label</li>
    ...
  </ul>
  <div id="item1">Item 1 text</div>
  <div id="item2">Item 2 text</div>
  ...
</div>

Ideally, I'd like to be able to define a tag such that use becomes:

<tabs>
  <tab label="Item 1 label">Item 1 text</tab>
  <tab label="Item 2 label">Item 2 text</tab>
  ...
</tabs>

With the label attributes being used up in the <li> to create the labels.  Unfortunately I can't see a way to do that, unless it's possible to store the value of a parameter, remove it from it's current placement and reuse it later.  Then it might be doable with scoped variables.

Any suggestions?  I know I could manually add the separate headers but I'd like to be able have a clean (re)usable end product.

Bryan Larsen

unread,
Aug 19, 2011, 2:45:25 PM8/19/11
to hobo...@googlegroups.com
It certainly seems possible.

pseudo code alert.

<def tag="tabs">
<set-scoped tabs="&[]">
<ul param="default"/>
<repeat with="&scope.tabs">
<div .../>
</repeat>
</set-scoped>
</def>

<def tag="tab" attrs="label">
<% die if scoped.tabs.nil?
scope.tabs << [label, parameters.default] %>
<div>
<%= parameters.default %>
</div>
</def>

I think you've figured out all of this except for the
"parameters.default" part which is what I think you were asking for.

cheers,
Bryan

> --
> You received this message because you are subscribed to the Google Groups
> "Hobo Users" group.
> To view this discussion on the web visit
> https://groups.google.com/d/msg/hobousers/-/tr9nm0otPPkJ.
> To post to this group, send email to hobo...@googlegroups.com.
> To unsubscribe from this group, send email to
> hobousers+...@googlegroups.com.
> For more options, visit this group at
> http://groups.google.com/group/hobousers?hl=en.
>

kevinpfromnm

unread,
Aug 19, 2011, 3:42:41 PM8/19/11
to hobo...@googlegroups.com
yeah, that might do it.  trying to make a semantic wrapper tags for the jquery tabs widget.

kevinpfromnm

unread,
Aug 22, 2011, 4:09:05 PM8/22/11
to hobo...@googlegroups.com
End code:

<def tag="hjq-tabs" attrs="id">
    <% id ||= "tabs" -%>
    <script>
        jQuery(function() {
          jQuery( "#<%= id %>" ).tabs();
        });
    </script>
    <div id="#{id}" param="wrapper">

        <set-scoped tabs="&[]">
            <ul param="default" />
            <repeat with="&scope.tabs">
                <div id="#{this[0]}"><%= this[1] %></div>
            </repeat>
        </set-scoped>
    </div>
</def>

<def tag="hjq-tab" attrs="label,id"><%
    raise "Tab tag must be used inside tabs tag." if scope.tabs.nil?
    id ||= "tab#{scope.tabs.length}"
    scope.tabs << [id, parameters.default] -%>
    <li><a href="##{id}"><%= label %></a></li>
</def>

Working as desired:

<hjq-tabs>
  <hjq-tab label="Step 1">...</hjq-tab>
  <hjq-tab label="Step 2">...</hjq-tab>
  ...
</hjq-tabs>

I'd wrap it up like the rest of the hobo-jquery plugin but honestly I'm not sure what a good chunk of that code is for :D.  Feel free to modify and include in whatever.
Reply all
Reply to author
Forward
0 new messages