aside

[bryanlarsen]

hobo_clean defines content like this:

    <section param="content"/>

hobo_bootstrap defines it like this:

    <div param="container">
      <div class="row" param="main-row">
        <div param="main-column">
          <section param="content"/>
        </div>
        <div param="aside-column">
          <div class="well">
            <section param="aside"/>
          </div>
        </div>
      </div>
    </div>

the hobo generators use the above like this:

<content: param>
  <section-group>
    <section param="main-content">
      <header param="content-header"> ... </header>
      <section param="content-body">  ... </section>
    </section>
    <aside param>  ... </aside>
  </section-group>
</content:>

Notice that the generated code does not use the aside param from hobo_bootstrap. So the aside ends up being a section at the bottom of the page.

[bryanlarsen]

Solution #1: Hack up hobo_bootstrap and the aside definition

<def tag="aside" attrs="empty">
  <% @_aside_content = parameters.default %>
</def>

    <%
      # the aside tag sets @_aside_content, may be used in parameters.content
      # so evaluate content now, which may populate @_aside_content
      content=parameters.content[1][:default].call(nil)
      if !@_aside_content && !parameters.aside.blank?
        @_aside_content=parameters.aside[1][:default].call(nil)
      end
      if @_aside_content
        attributes[:content_size] ||= "9"
        attributes[:aside_size] ||= (12 - attributes[:content_size].to_i).to_s
        aside_span = "span" + attributes[:aside_size]
        aside_location ||= 'right'
      else
        attributes[:content_size] = "12" unless attributes[:content_size]
      end
    %>
    <div class="container bootstrap-content" param="container">
      <div class="row" param="main-row">
        <div class="#{aside_span}" if="&@_aside_content && aside_location=='left'" param="aside-column">
          <div class="well">
            <section class="aside"><%= @_aside_content %></section>
          </div>
        </div>
        <div class="span#{attributes[:content_size]}" param="main-column">
          <section with-flash-messages class="content"><%= content %></section>
        </div>
        <div class="#{aside_span}" if="&@_aside_content && aside_location=='right'" param="aside-column">
          <div class="well">
            <section class="aside"><%= @_aside_content %></section>
          </div>
        </div>
      </div>
    </div>

This works, but it's damn ugly, and breaks pseudo-parameters like after-content. (which is used in one of our integration tests).

[bryanlarsen]

Solution #2: modify the hobo generators to use the content-body & aside parameters instead, and require all themes to define them.

I'm leaning towards this solution ATM. Thoughts?

[owendall]

+1 from me.

[iox]

I like solution 2 too :).

[iox]

The code looks good, but I'm unsure whether you have finished your work. Should I test and merge this pull request?

[bryanlarsen]

Please test it. I'm going to add a version bump to both pull requests so because old hobo_bootstrap won't work with new hobo and vice versa. Then we just have to make sure that we merge the pull requests into both hobo & hobo_bootstrap simultaneously.

[iox]

I tested both branches (hobo_bootstrap#aside and hobo#issue_11) and they work very nicely :). Please merge when you want and I'll push the gem.

By the way, I took a screenshot of the aside and found a bug in the process: #30

[bryanlarsen]

Merged. Don't push the gem yet. People using hobo from github should be
using hobo_bootstrap from github, too.

Bryan

On Mon, Nov 12, 2012 at 2:07 PM, Ignacio Huerta [email protected]:

I tested both branches (hobo_bootstrap#aside and hobo#issue_11) and they
work very nicely :). Please merge when you want and I'll push the gem.

By the way, I took a screenshot of the aside and found a bug in the
process: #30 #30

—
Reply to this email directly or view it on GitHubhttps://github.com//pull/27#issuecomment-10299929.

[iox]

Ok :)