Recently I needed to implement star rating system for one of my project I am working on.
If you are not familiar with a star rating system, its simply a method of voting using (usually) 5 stars in a row, which will change colour as you hover over them indicating the level at which to rate something. You may think a simple rollover would accomplish this but difficulty arises because as you rollover each star it should stay highlighted while you light up the next one and so on until the end of the row of stars.
If this doesnt make much sense to you then take a look at what we are going to achieve in this article. (I will leave the server-side coding to someone more knowledgeable and we will just concentrate on the visual aspects of making this effect happen. )
As you can see from the demo the stars stay hovered as you rollover each one. However, as mentioned earlier, the complicated part is that as each star is hovered it should stay alight while the next one is hovered so that if you start at the left side then 1,2,3,4 and 5 stars will be alight as you traverse the row. Usually a rollover will only be active on the anchor that the pointer is currently over making previous anchors lose their focus and thus their hover effect disappear.
Install the acts_as_rateable plugin.
Run the following from the root of your Rails app to install the plugin.
or
http://rubyforge.org/projects/rateableplugin/
Create the table(migration) to store rating into database
def self.up
create_table :ratings, :force => true do |t|
t.column :rating, :integer, :default => 0
t.column :created_at, :datetime, :null => false
t.column :rateable_type, :string, :limit => 15,
:default => “”, :null => false
t.column :rateable_id, :integer, :default => 0, :null => false
t.column :user_id, :integer, :default => 0, :null => false
end
add_index :ratings, [”user_id”], :name => “fk_ratings_user”
end
def self.down
drop_table :ratings
end
end
Model
models rateable
I was trying to add a rating system for the model Picture. Yours can obviously be whatever you like but from here on out I’ll be using Picture. So add acts_as_rateable to your model.
Controller to handle the rating
def rate
@picture = Picture.find(params[:id])
Rating.delete_all(["rateable_type = 'Picture' AND rateable_id = ? AND user_id = ?",
@picture.id, current_user.id])
@picture.add_rating Rating.new(:rating => params[:rating],
:user_id => current_user.id)
end
end
Views
Create the partial /views/rating/_rating.rhtml
- {:action=>ajax_pagination_links, :page => @posts_pages.current.previous }, if @posts_pages.current.previous -%>
<%= link_to_remote 'Next page', {:url=>{:action=>ajax_pagination_links, :page => @posts_pages.current.next} if @posts_pages.current.next -%>
Second Method
Put this code in a helper somewhere
first, last = paginator.first, paginator.last
returning html = '' do
if options[:always_show_anchors] and not window_pages[0].first?
html << link_to_remote(first.number, :update => options[:update], :url => { options[:name] => first }.update(options[:params] ))
html << ' ... ' if window_pages[0].number - first.number > 1
html << ' '
end
window_pages.each do |page|
if paginator.current == page && !options[:link_to_current_page]
html << page.number.to_s
else
html << link_to_remote(page.number, :update => options[:update], :url => { options[:name] => page }.update(options[:params] ))
end
html << ' '
end
if options[:always_show_anchors] && !window_pages.last.last?
html << ' ... ' if last.number - window_pages[-1].number > 1
html << link_to_remote(paginator.last.number, :update => options[:update], :url => { options[:name] => last }.update( options[:params]))
end
end
end
and use following code for creating links
View