Home : Products : Gossamer Links : Development, Plugins and Globals :

Products: Gossamer Links: Development, Plugins and Globals: Re: [Jag] Cool "rate" system...: Edit Log

Here is the list of edits for this post
Re: [Jag] Cool "rate" system...
Hi, the css star system works just great for the actual rating part, but it does not display the current rating (or am I missing something? Basically, I'd like to use this very same CSS code but use it to actually display the current rating as well. Is this possible? YouTube does it where there is just 1 color used, and when you arrive on the page, the stars are at, say 3 stars. Then when you hover over them, they increase as you hover towards the right. Then you click and shazam, you have voted. (ruby on rails?) Netflix uses a 2 color system Red being a system color and Yellow being a user color. So, when you land on the page, there are 3 stars in Red. They hover as Yellow and once clicked -- they turn Yellow permanently, indicating you have already voted.

As a standard in Luna, the template uses this to display the current rating:

<%~if Votes%>
<%~set intRating = $Rating i/ 1%>
<img src="<%Links::Utils::image_url("stars-10-${intRating}.gif")%>" alt="<%intRating%> out of 10 stars" title="<%intRating%> out of 10 stars" /> (<%Votes%> vote<%if Votes != 1%>s<%endif%>)

And I'd like to use the new fabu stars that Eliot supplied (in an above post):
<ul class='star-rating'>
<li><a href='#' onclick="javascript: do_confirm(2,1,<%ID%>);" title='Rate this 1 star out of 5' class='one-star'>1</a></li>
<li><a href='#' onclick="javascript: do_confirm(4,2,<%ID%>);" title='Rate this 2 stars out of 5' class='two-stars'>2</a></li>
<li><a href='#' onclick="javascript: do_confirm(6,3,<%ID%>);" title='Rate this 3 stars out of 5' class='three-stars'>3</a></li>
<li><a href='#' onclick="javascript: do_confirm(8,4,<%ID%>);" title='Rate this 4 stars out of 5' class='four-stars'>4</a></li>
<li><a href='#' onclick="javascript: do_confirm(10,5,<%ID%>);" title='Rate this 5 stars out of 5' class='five-stars'>5</a></li>

Or something like it. It could work with either the Netflix or the YouTube model. Has anyone done this before?

Last edited by:

Evoir: Dec 6, 2006, 2:03 PM

Edit Log: