A cool change to NuRatings

[kinggori]

I changed the way ratings are displayed so that they look like slickdeal's ratings and I'll share the code here

http://forums.slickdeals.net/forumdi...hp?sduid=0&f=4

Create new template nu_ratings_threadbit2
Product: NuHit's Ratings
Title: nu_ratings_threadbit2

PHP Code:


<if condition="$show['nr_thread_rating']">
    <if condition="$vboptions[disable_ajax] != 2">
        <script type="text/javascript">
        <!--
        var g_rating_thread_$thread[threadid] = false;
        function rate_thread_$thread[threadid](dir)
        {
            if (g_rating_thread_$thread[threadid])
                return;
            g_rating_thread_$thread[threadid] = true;    
            nr_rate_thread( rate_thread_done_$thread[threadid], $thread[threadid], dir );
        }
            
        function rate_thread_done_$thread[threadid]()
        {
            g_rating_thread_$thread[threadid] = false;
            nr_rate_thread_done( 'nr_rating_$thread[threadid]', 'thumbs_up_$thread[threadid]', 'thumbs_dn_$thread[threadid]' );
        }
        
        //-->
        </script>
    </if>

<div class="nr-ctr$stylevar[nr_ctr_size] nr-right">

<div>

<if condition="$thread[nr_rating] == 1">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating1.gif"/>
</if>
<if condition="$thread[nr_rating] == 2">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating2.gif"/>
</if>
<if condition="$thread[nr_rating] == 3">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating3.gif"/>
</if>
<if condition="$thread[nr_rating] == 4">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating4.gif"/>
</if>
<if condition="$thread[nr_rating] == 5">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating5.gif"/>
</if>
<if condition="$thread[nr_rating] == 6">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating6.gif"/>
</if>
<if condition="$thread[nr_rating] == 7">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating7.gif"/>
</if>
<if condition="$thread[nr_rating] == 8">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating8.gif"/>
</if>
<if condition="$thread[nr_rating] == 9">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating9.gif"/>
</if>
<if condition="$thread[nr_rating] > 9">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating10.gif"/>
</if>


<if condition="$thread[nr_rating] == -1">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-1.gif"/>
</if>
<if condition="$thread[nr_rating] == -2">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-2.gif"/>
</if>
<if condition="$thread[nr_rating] == -3">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-3.gif"/>
</if>
<if condition="$thread[nr_rating] == -4">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-4.gif"/>
</if>
<if condition="$thread[nr_rating] == -5">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-5.gif"/>
</if>
<if condition="$thread[nr_rating] == -6">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-6.gif"/>
</if>
<if condition="$thread[nr_rating] == -7">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-7.gif"/>
</if>
<if condition="$thread[nr_rating] == -8">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-8.gif"/>
</if>
<if condition="$thread[nr_rating] == -9">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-9.gif"/>
</if>
<if condition="$thread[nr_rating] < -9">
<img src="http://forum.yourdomain.com/NuRatings/tr/rating-10.gif"/>
</if>

</div>




</div>
<div id="nr-wrt$thread[threadid]" class="nr-who-rated">&nbsp;</div>
</if> 


If you need help adding this feature please let me know

[kafi]

Very nice, this approach inspired me to differ green and red points, but see this:

<if condition="$thread[nr_rating] > 0">color:green</if>

it is not working... is the operator syntax ok?

Thanks!!!

[ElfMage]

The syntax is fine. Where are you adding this condition?

This should go in the 'style' attribute for the ratings in order for the color:green to work.

[kafi]

I was adding it here:

PHP Code:

<div style="clear:both;position:relative">$post[nu_ratings_postbit]
<div class="nr-rating" style="position:absolute;top:-20px;font-size:14px;float:right;height:10px;font-weight:bold;color:gray" id="nr_rating_p$post[postid]">$post[nr_rating]</div>
</div></div> 


like this:

PHP Code:

<div style="clear:both;position:relative">$post[nu_ratings_postbit]
<div class="nr-rating" style="position:absolute;top:-20px;font-size:14px;float:right;height:10px;font-weight:bold;<if condition="$thread[nr_rating] > 0">color:green</if>" id="nr_rating_p$post[postid]">$post[nr_rating]</div>
</div></div> 


I also wish i can have different style for $post[nr_rating] for post rating and for thread rating. Currently there is only one option to play with css, therefore as you can see I had to play with absolute positioning (to get rid of bigg padding around number that I use in thread rating...).

Thanks!!!


The concept of green was like youtube (green for positive and red for negative nubmers...)

[ElfMage]

Try this instead:

PHP Code:

<div style="clear:both;position:relative">$post[nu_ratings_postbit]
<div class="nr-rating" style="position:absolute;top:-20px;font-size:14px;float:right;height:10px;font-weight:bold;color:gray; <if condition="$thread[nr_rating] > 0">color:green;</if>" id="nr_rating_p$post[postid]">$post[nr_rating]</div>
</div></div> 


Notice how I moved your condition to within the 'style' attribute of the DIV.

As far as different styles, we'll add this.

[kafi]

Hmm, althoug I do not see the difference, I have tried your code, but it doesnt work either.
It probably can't read number of rating.... ???

[ElfMage]

You know what? My apologies, my code is exactly as yours...

The first time I was reading this thread on my cell phone, and I misread your code.

Could you send me a PM with a link to a thread where this code should be working?

Thanks

[kafi]

hehe, appologies is on my site too
I needed to color points for post not for thread, therefor it shoud be

<if condition="$post[nr_rating] > 0">

Here is my final code:

PHP Code:

<div class="nr-rating" style="position:absolute;top:-20px;font-size:14px;height:10px;font-weight:bold;color: <if condition="$post[nr_rating] == 0">gray<else /><if condition="$post[nr_rating] < 0">red<else />green</if></if>" id="nr_rating_p$post[postid]">$post[nr_rating]</div> 


I am eager for new release where I will be able to save some code with css... (plus the bug in IE)
Anyway, THANK YOU for your assistance!!!!!

I miss THANK YOU or REPUTATION button, so that I can award your work virtually...

[ElfMage]

Glad you caught that. Thanks.

[wiidbz]

I can't get this to work. Maybe because I made the template to be custom template? How do I make include into Product: NuHit's Ratings?

[wiidbz]

I found out it's not the template, the page won't read nu_ratings_threadbit2 at all. It will only read nu_ratings_threadbit. Anyone know how to make this work?