Simone Carletti's Blog » tabs on rails

TabsOnRails 2.0.0

Simone Carletti — Tue, 08 Feb 2011 10:56:46 +0000

TabsOnRails is a simple Rails plugin for creating tabs and navigation menus. It provides helpers for generating navigation menus with a flexible interface.

Release 2.0.0 is now available. It targets Rails 3.0 and is no longer compatible con Rails 2.3.x.

You can download/install the Gem via RubyGems.

1	$ gem install tabs_on_rails

For more details please read the documentation or API.

TabsOnRails graduated from beta

Simone Carletti — Thu, 29 Oct 2009 20:00:22 +0000

TabsOnRails 1.0.0 is now available. TabsOnRails is a simple Rails plugin for creating and managing tabs menu and navigation menu with Ruby on Rails. It provides helpers for creating tabs, an navigation menu in general, with a flexible interface.

The first stable release is now available and I’m also really proud to say that TabsOnRails has 100% coverage of the source code. This doesn’t mean the plugin is perfect, nor I can assume this is bug-free. However, the plugin definitely deserves the stable flag.

I have been using TabsOnRails for creating tabs and navigation menu in the last year and I’m really satisfied with how the plugin evolved. I hope you’ll enjoy it.

Getting Started

In your template use the tabs_tag helper to create your tab.

1
2
3
4
5

<% tabs_tag do |tab| %>
<%= tab.home 'Homepage', root_path %>
<%= tab.dashboard 'Dashboard', dashboard_path %>
<%= tab.account 'Account', account_path %>
<% end %>

The example above produces the following HTML output.

1
2
3
4
5

Homepage

Dashboard

Account

The usage is similar to the Rails route file. You create named tabs with the syntax tab.name_of_tab.

The name you use creating a tab is the same you’re going to refer to in your controller when you want to mark a tab as the current tab.

1
2
3

class DashboardController < ApplicationController
set_tab :dashboard
end

Now, for every action defined in DashboardController, the template will automatically render the following HTML code.

1
2
3
4
5

Homepage

Dashboard

Account

Use the current_tab helper method if you need to access the value of current tab in your controller or template.

1
2
3
4
5
6

class DashboardController < ApplicationController
set_tab :dashboard
end

# In your view
The name of current tab is <%= current_tab %>.

The open_tag can be customized with the :open_tabs option.

1
2
3
4
5
6
7
8
9
10
11

<% tabs_tag :open_tabs => { :id => "tabs", :class => "cool" } do |tab| %>
<%= tab.home 'Homepage', root_path %>
<%= tab.dashboard 'Dashboard', dashboard_path %>
<%= tab.account 'Account', account_path %>
<% end %>

Homepage

Dashboard

Account

Further customizations require a custom Builder (see below).

Installation

You can upgrade/install the library via RubyGems.

1	$ gem install tabs_on_rails --source http://gemcutter.org

Please note the GEM is now hosted on Gemcutter. If you installed it from GitHub you need to uninstall weppos-tabs_on_rails and install tabs_on_rails.

As usual, patches and feedback are welcomed.

TabsOnRails and Helperful migrated to Gemcutter

Simone Carletti — Mon, 12 Oct 2009 19:07:03 +0000

Just in case you haven’t heard the news, Github discontinued support for building gems. Gem building has been disabled since the move to Rackspace and existing Gem will be available at gems.github.com for at least one year.

In the meanwhile, there’s an other Gem hosting solution silently gaining popularity: Gemcutter. Gemcutter aims to be a Gem hosting alternative to RubyForge. I never really liked the GitHub Gem system: altering the original Gem name with my login was a quick workaround for name clashes but causes a lot of confusion when trying to install the original version of a Gem or upgrading a Gem from multiple sources. But GitHub was effectively the most simple (and the unique) alternative to distribute a Ruby library as a Gem without creating a full RubyForge project and, most of all, it worked.

Now that GitHub Gem system is gone, I gave a look at Gemcutter and I eventually decided to move there my Helperful and TabsOnRails Gems.

Helperful 0.5.2 and TabsOnRails 0.8.2 are now available. The source code for both libraries is still hosted on GitHub here and here. The documentation has been updated accordingly.

The main benefit of using GemCutter is that you no longer need to pass the :lib option when declaring a Gem dependency in your Rails project.

1
2
3
4
5
6
7
8

Rails::Initializer.run do |config|

# other configurations
# ...

config.gem "weppos-tabs_on_rails", :lib => "tabs_on_rails", :source => "http://gemcutter.org/"

end

is now simply

1
2
3
4
5
6
7
8

Rails::Initializer.run do |config|

# other configurations
# ...

config.gem "tabs_on_rails", :source => "http://gemcutter.org/"

end

Thank you GitHub for taking care of my Gems and welcome Gemcutter.

TabsOnRails 0.8.0

Simone Carletti — Tue, 23 Jun 2009 21:37:32 +0000

TabsOnRails is a simple Rails plugin for creating and managing Tabs in Rails projects. It provides helpers for creating tabs, and virtually any type of navigation menu, with a flexible interface.

The release 0.8.0 is now available. This is the first beta release, even though this plugin has been publically available for quite a while. It is now part of the standard set for the most part of my Rails projects and it turned up to be really helpful.

TabsOnRails 0.8.0 doesn’t provide additional features but mainly bugfix. The current_tab method is now available as instance method so you can call it in your actions (#229). Also, all instance methods are now declared as protected so that they no longer appears to be confused by Rails as standard actions (#228).

To install/update:

1	$ sudo gem install weppos-tabs_on_rails

TabsOnRails 0.3.0 with concurrent tabs support aka namespaces

Simone Carletti — Sat, 02 May 2009 12:35:31 +0000

TabsOnRails is a simple Rails plugin for creating and managing Tabs in Rails projects. It provides helpers for creating tabs with a flexible interface.

The release 0.3.0 is now available as a GEM. The most important feature is the concurrent tabs support, also known as multi-tabs or namespaces. Namespaces enable you to create and manage tabs in parallels. Let me show you an example.

Let’s assume your application provides a first level navigation menu with 3 elements: :home, :dashboard, :projects. The relationship between your tabs and your controllers is 1:1 so you should end up with the following source code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

class HomeController
set_tab :home
end

class DashboardController
set_tab :dashboard
end

class ProjectsController
set_tab :projects

def first; end
def second; end
def third; end
end

The project controller contains 3 actions and you might want to create a second-level navigation menu. This menu should reflect the navigation status of the user in the project page.

Without namespaces, you wouldn’t be able to accomplish this task because you already set the current tab value to :projects. You need to create a concurrent navigation menu and uniquely identify it with a custom namespace.
Let’s call it :navigation.

1
2
3
4
5
6
7
8
9
10
11
12

class ProjectsController
set_tab :projects

# Create an other tab navigation level
set_tab :first, :navigation, :only => %w(first)
set_tab :second, :navigation, :only => %w(second)
set_tab :third, :navigation, :only => %w(third)

def first; end
def second; end
def third; end
end

Voilà! That’s all you need to do. And you can create an unlimited number of namespace as long as you use an unique name to identify them.

The default namespace is called :default. Passing :default as name is the same as don’t using any namespace at all. The following lines are equivalent.

1 2	set_tab :projects set_tab :projects, :default

Namespaces supports all the other features already available in TabsOnRails including custom Builders for your Rails tabs. See the documentation page for further information.

You can install/upgrade TabsOnRails by running

1	$ sudo gem install weppos-tabs_on_rails --source http://gems.github.com

TabsOnRails: creating and managing Tabs with Ruby on Rails

Simone Carletti — Sat, 25 Apr 2009 14:42:48 +0000

TabsOnRails is a simple Rails plugin for creating and managing Tabs. It provides helpers for creating tabs with a flexible interface.

If you ever had to create a tab-based navigation menu at least once, you perfectly know how much it can annoying. You have to create the menu, set active status in your controllers and reflect selection status in your view. TabsOnRails does all the boring stuff for you and let you focus on the customization.

Let me show you how it works.

Quick Start

In your template use the tabs_tag helper to create your tab.

1
2
3
4
5

<%= tabs_tag do |tab| %>
<%= tab.home 'Homepage', root_path %>
<%= tab.dashboard 'Dashboard', dashboard_path %>
<%= tab.account 'Account', account_path %>
<% end %>

The example above produces the following HTML output.

1
2
3
4
5

<ul>
<li><a href="/">Homepage</a></li>
<li><a href="/dashboard">Dashboard</a></li>
<li><a href="/account">Account</a></li>
</ul>

The usage is similar to the Rails route.rb file. You create named tabs with the syntax tab.name_of_tab. The name you use creating a tab is the same you’re going to refer to in your controller when you want to flag the tab as active with current_tab.

1
2
3

class DashboardController < ApplicationController
current_tab :dashboard
end

Now, for any action defined in the DashboardController, the template will automatically render the following HTML code.

1
2
3
4
5

<ul>
<li><a href="/">Homepage</a></li>
<li><span>Dashboard</span></li>
<li><a href="/account">Account</a></li>
</ul>

Restricting current_tab scope

Off course, there are specific situations where you need to change current_tag only for some specific action in your controller.

The current_tab method understands all options you are used to pass to a Rails controller filter. In fact, behind the scenes this method uses a before_filter to set a special @current_tab variable. Taking advantage of Rails filter options, you can restrict a tab to a selected group of actions in the same controller.

1
2
3
4
5
6
7
8
9
10
11
12

class PostsController < ApplicationController
current_tab :admin
current_tab :posts, :only => [ :index, :show ]
end

class ApplicationController < ActionController::Base
current_tab :admin, :if => :admin_controller?

def admin_controller?
self.class.name =~ /^Admin(::|Controller)/
end
end

Customizations

All your tabs belongs to you! Easily to understand, your tab structure might be slightly different that the default one. For example, you might want to flag the active tab with a current CSS class and preserve the link with a nice hover effect. Or perhaps your tab is an ordered list (

No problem! The library is completely customizable using custom builders. See the documentation for further details on how to create and use a custom Tab Builder.

Here’s just a couple of examples created using custom builders.

Cool! How do I get the plugin?

Source code and issue management is powered by GitHub, the project homepage and documentation are hosted on this site. The plugin is available both as a GEM and as a Rails plugin. See the documentation page to learn how to install it.