Burm.net

Acts As Taggable on Steroids Ruby On Rails Plugin With Paginate

Posted on the October 8th, 2008 under My Projects,programming,Ruby on Rails by John

Acts As Taggable On Steroids is a great plugin for Rails that makes adding tags to your application quick and easy. Check it out on github here => http://github.com/mattetti/acts_as_taggable_on_steroids/tree/master

I threw this post together with some notes that I took along the way when setting up the plugin for use.

Installation:

script/plugin install http://svn.viney.net.nz/things/rails/plugins/acts_as_taggable_on_steroids

Setup

Setup your migration by running the below:

ruby script/generate acts_as_taggable_migration
rake db:migrate

Add the acts_as_taggable to your model, in my case its the Events model…

class Event < ActiveRecord::Base
# acts as taggable on roids
acts_as_taggable

Now I needed to add a way to allow tags to be added to Events, in my form for my Event I added the following:

<p>
  <%= f.label 'Tag List (Delimiter = ,)' %><br />
  <%= f.text_field :tag_list %>
</p>

To view the tags associated this a Event on the Show page, along with linking to the actual tag to search for other events tagged with the same item, I added the following:

<p><strong>This event was tagged with</strong>: <% for tag in @event.tags %> 
<%= link_to tag.name, events_path(:view =>'tag', :tag => tag.name) %><% end %>
</p>

Tag Clouds

In order to use the plugin’s build in tag cloud functionality you need to add the helper to your application helper by doing the following:

  module ApplicationHelper
    include TagsHelper
  end

In your controller where you are planning on using your tag cloud add the below, this will grab the counts of all your tags so the helper can generate your cloud. Again in my case I am putting this in my Events controller.

@tags = Event.tag_counts

Now you use the following where you wish to show your views:

<% tag_cloud @tags, %w(tag1 tag2 tag3 tag4) do |tag, css_class| %>
    <%= link_to tag.name, { :action => :tag, :id => tag.name }, :class => css_class %>
  <% end %>

In your main CSS file you should add something to match the tags we specified above, this sets your font sizes for the cloud display generated by the helper…

  .tag1 { font-size: 1.0em; }
  .tag2 { font-size: 1.6em; }
  .tag3 { font-size: 2.7em; }
  .tag4 { font-size: 3.8em; }

Tag Clouds with Paginate Example

Here I am passing the page and tag to my events model to find all events tagged with that tag, and then use the results of that query and passing it onto paginate.

def self.tag_event_list(page, tag)
 
 options = Event.find_options_for_find_tagged_with(tag).merge :page => page, :per_page => 10, :order => 'date DESC' 
 paginate(options)
 
end

Other Notes:

I added the following to my environment.rb file so that the unused tags get destroyed if they are no longer in use by any events.

# automatically remove dead tags
Tag.destroy_unused = true

For more help check out the read me here: http://github.com/mattetti/acts_as_taggable_on_steroids/tree/master

The Ruby On Rails Paperclip Plugin Tutorial – Easy Image Attachments

Posted on the October 7th, 2008 under My Projects,programming,Ruby on Rails by John

I used Paperclip for my latest project, and I figured I would give a brief tutorial on how to use it.

Paperclip – Paperclip is intended as an easy file attachment library for ActiveRecord. The intent behind it was to keep setup as easy as possible and to treat files as much like other attributes as possible. http://github.com/thoughtbot/paperclip/tree/master

In my case, I wanted to allow an attachment to an Event, which will have one photo.

To install:

script/plugin install git://github.com/thoughtbot/paperclip.git

Create your migration, again in my case I was adding the images to my Events model / DB, so I did the following:

script/generate migration AddPhotosToEvents

Open up your newly created migration with your favorite Text editor, and add the following:

class AddPhotoToEvent < ActiveRecord::Migration
  def self.up
    add_column :events, :photo_file_name, :string
    add_column :events, :photo_content_type, :string
    add_column :events, :photo_file_size, :integer
  end
 
  def self.down
    remove_column :events, :photo_file_name
    remove_column :events, :photo_content_type
    remove_column :events, :photo_file_size
  end
end

Then rake your migration so the new columns are added to your database:

rake db:migrate

Next you need to tell your model to use Paperclip, again I am using the Event model as an example, the #Paperclip and below is what you need to add. If you notice below I added 4 options to the :styles. I wanted to have a few different sizes generated when a image was uploaded, i named them appropriately (you can name them whatever you wish). Please note when you put a # on the end it signifies that you want that exact aspect ratio, it will crop your photo automatically. When you use > on the end it will make the largest side the size you specify and keep the aspect ratio uploaded. In addition note that because we specified has_attached_file :photo its going to look for that naming convention we created in the migration above. In addition it uses that name to store your photo in the public folder of your application. So our photo url is going to be as follows: /public/photos/(event#)/(size_name)/image_name

class Event < ActiveRecord::Base
belongs_to :user
validates_presence_of :title, :on => :create, :message => "can't be blank"
validates_presence_of :teaser, :on => :create, :message => "can't be blank"
validates_presence_of :subject, :on => :create, :message => "can't be blank"
# Paperclip
has_attached_file :photo,
  :styles => {
    :thumb=> "100x100#",
    :small  => "150x150>",
    :medium => "300x300>",
    :large =>   "400x400>" }

Next you need to make sure you put the html => { :multipart => true } in both your edit and new views for the model you are working with. Example in my case:

<% form_for(@event,:html => { :multipart => true }) do |f| %>
  <%= f.error_messages %>
  <%= render :partial => 'form', :locals => { :f => f } %>
<% end %>

You then need to add the file_field to your new and edit forms or your _form partial like in my case:

<p>
  <%= f.label 'Photo' %><br />
  <%= f.file_field :photo %>
</p>

Next up is deciding on how you are going to use / view your images. In my case I wanted to show a few different sizes in the Event view. I also wanted to make sure I am only going to show photo’s if one exists. In this example I am just showing the small and medium sizes we generated:

<% if @event.photo.exists? then %>
<p>Small:<%= image_tag @event.photo.url(:small) %></p>
<p>Medium:<%= image_tag @event.photo.url(:medium) %></p>
<% else %>
<p> There are no photo's attached, upload one. </p>
<% end %>

A few other notes…

Calling @event.photo.nil destroys the photo

Also checkout this great tutorial Jim put up here.

Thats all for now, I’ll try to post an update with some more options / features when using the Paperclip plugin in the future.

*** Checkout my other tutorial on polymorphic paperclip if you would like to have multiple image attachments.