Last updated

Textmate+Rails: Easy partials for better code

As you may know, I use TextMate for editing Rails code.

I’ve just been browsing the Rails bundle today and I came across some very interesting things. Today I’ll tell you about partials.

Partials are ERb templates. They are mostly HTML (or RJS or XML or whatever output format you use) and include some embedded Ruby to show actual content. Partials are not linked to a method in a controller, but instead they can be easily rendered through-out your application.

TextMate allows you to refactor your application to use partials with almost no effort!

First something about partials for those who don’t know about it.

Partials are stored in files that start with an _ (underscore) and end in .rthml (or .rjs or .rxml) and you may include them in your ERb like this:

1< %= render :partial => 'userinfo' %>

This will include the partial _userinfo.rhtml for you. This way you can avoid duplication by including the same ERb template (partial) over and over again.

Partials are also useful to keep your views (templates) clean and easy to understand. In large projects this will allow you later to easily change a view without having to spit through 500 lines of ERb.

Let’s say you have a profile page where you want to show a users’s profile and some options for when the user is viewing his own profile. Also, you want to show a simple message when the users has not yet created a profile, which is a possibility in my application. The show.rhtml template for the profile may look like this

 1<h2>Profile for < %=h @profile.user.login %></h2>
 2
 3< % if @profile.exists? -%>
 4
 5	<div id="membersince">< %= @profile.firstname %> has been a member for < %= distance_of_time_in_words_to_now @profile.user.created_at %></div>
 6
 7	<h3>General information</h3>
 8	<div id="name">Name: < %= @profile.fullname %></div>
 9	<div id="country">Country: < %= @profile.country %></div>
10	<div id="birthday">Birthday: < %= fmt_date @profile.birthday %></div>
11
12	<h3>About < %= @profile.firstname %></h3>
13	<div id="about">< %= markdown @profile.about %></div>
14
15< % else -%>
16
17	<div id="membersince">< %= @profile.user.login %> has been a member for < %= distance_of_time_in_words_to_now @profile.user.created_at %></div>
18
19	<h3>Oh my!</h3>
20	<p>This user has not yet created a profile.</p>
21
22< % end  -%>
23
24< % if @profile.user.id == current_user.id -%>
25<h3>Options</h3>
26<p>This is your profile, so you have some options:</p>
27<ul>
28	<li>< %= link_to "Change password", :controller => 'account', :action => "change_password" %></li>
29	<li>< %= link_to "Edit your profile", profile_edit_url(:login => current_user.login)  %>
30</li></ul>
31< % end -%>

As you may see, this is chaos. It’s not easy to read and you can’t easily change something when you need to. Wouldn’t it be great to store all three seperate blocks (profile, no profile message and options) in partials?

This is where TextMate does it’s magic. Here’s a before snaphot:

before.png

Now, select the part between the if and else statements. This is where a normal profile is shown. Next, use TextMate: SHIFT-CTRL-H. You’ll get a pop-up asking you how you’d like to name the partial. In this case I choose ‘profile’.

during.png

After you click OK, the partial will be created containing the code you selected and an appropriate render method is placed instead. This is what the code looks like after:

after.png

After all this the same ERb template looks like this:

 1<h2>Profile for < %=h @profile.user.login %></h2>
 2
 3< % if @profile.exists? -%>
 4	< %= render :partial => 'profile' %>
 5< % else -%>
 6	< %= render :partial => 'noprofile' %>
 7< % end -%>
 8
 9< % if  @profile.user.id == current_user.id -%>
10	< %= render :partial => 'options' %>
11< % end -%>

Now, isn’t that more readable? Even, if you want to change a profile, you can just edit _profile.rhtml and you’re done.