= Tabulous

== Description

Tabulous provides an easy way to add tabs to your Rails application.

== Requirements

Tabulous works with Rails 3.0, 3.1, 3.2 and 4.0.  It has been tested on Ruby 1.8.7, 1.9.3 and 2.0.0.

== Usage

Traditionally, implementing tabs in Rails involves adding logic to your views and sprinkling
tab-related code all over your controllers.  Tabulous takes a different approach and
consolidates all of the tab-related code into one configuration file.  Apart from this
configuration file, you just have to call <%= tabs %> and <%= subtabs %> in your view layout(s)
and then create your own CSS styles for the tabs.

To get started, add the gem to your Rails application's Gemfile and install it using:

  bundle install

Then generate the tab file:

  rails generate tabs

This will generate app/tabs/tabulous.rb.  Open the file and configure it to your liking.
You'll notice the code is formatted into a grid.  After you edit the file, run the following rake
task to prettify the code back into a nice grid:

  rake tabs:format

Make sure you call the following view helpers in your layout(s):

  <%= tabs %>
  <%= subtabs %>

The tabs helper will generate markup that looks like this:

  <div id="tabs">
    <ul>
      <li class="active enabled"><span class="tab">Explanation</span></li>
      <li class="inactive enabled"><a href="/galaxies/elliptical_galaxies" class="tab">Galaxies</a></li>
      <li class="inactive enabled"><a href="/exoplanets" class="tab">Planets</a></li>
      <li class="inactive enabled"><a href="/stars" class="tab">Stars</a></li>
      <li class="inactive disabled"><span class="tab">Asteroids</span></li>
    </ul>
  </div>

And the subtabs helper will generate markup that looks like this:

  <div id="subtabs">
    <ul>
      <li class="active enabled"><span class="tab">Exoplanets</span></li>
      <li class="inactive enabled"><a href="/rogue_planets" class="tab">Rogue Planets</a></li>
    </ul>
  </div>

Tabulous will start you off with some CSS scaffolding but you'll eventually want to create your own
CSS.

== Examples

There is a tutorial at http://techiferous.com/2011/03/tutorial-for-adding-tabs-to-rails-using-tabulous/

== Twitter Bootstrap

To get tabulous to work with Twitter Bootstrap version 2, make sure the
following values are set in app/tabs/tabulous.rb:

* config.css.scaffolding = false
* config.tabs_ul_class = "nav nav-pills" # or whatever Bootstrap class you want
* config.bootstrap_style_subtabs = true
* config.active_tab_clickable = true

When config.bootstrap_style_subtabs is set to true, the subtabs are rendered
inside the tab markup, so you only need to call the tabs helper in your
layout, not the subtabs helper.

Also note that if you use Twitter Bootstrap, you lose the ability to disable
individual subtabs.