<var C = caller.C>
<var att = caller.att>

<var _rating = caller._rating>
<var _tbl = caller._tbl>
<var _idnum = caller._idnum>
<var _singular = caller._singular>


<!--- rating --->
<div align="left">
<div align="center">

<if _rating EQ 0>
<!--- rating forms --->
<table style="width:320px; border:0px solid white;" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="width:33%; border:0px solid white;"><div align="center" style="padding:7px;">
<var _color = "red">
<postform style="display:inline;">
<input type="hidden" style="display:none;" name="my_rating" value="1">
<input type="submit" value="1" class="spf_btn" style="cursor:pointer; background:#_color#; border-color:#_color#; padding-left:1em; padding-right:1em;">
</postform>
<small><small><div style="padding-top:3px;">
bad
</div></small></small>
</div></td>
<td style="width:33%; border:0px solid white;"><div align="center" style="padding:7px;">
<var _color = "green">
<postform style="display:inline;">
<input type="hidden" style="display:none;" name="my_rating" value="2">
<input type="submit" value="2" class="spf_btn" style="cursor:pointer; background:#_color#; border-color:#_color#; padding-left:1em; padding-right:1em;">
</postform>
<small><small><div style="padding-top:3px;">
good
</div></small></small>
</div></td>
<td style="width:33%; border:0px solid white;"><div align="center" style="padding:7px;">
<var _color = "blue">
<postform style="display:inline;">
<input type="hidden" style="display:none;" name="my_rating" value="3">
<input type="submit" value="3" class="spf_btn" style="cursor:pointer; background:#_color#; border-color:#_color#; padding-left:1em; padding-right:1em;">
</postform>
<small><small><div style="padding-top:3px;">
amazing
</div></small></small>
</div></td>
</tr>
</table>
<else>
<!--- show aggregate ratings --->
<var Totals = StructNew()>
<var Totals.all = 0>
<loop list="1,2,3" index="x">
<var _tot = 0>
<var _where = "user.sites LIKE('%|spf|%') AND user.spf_rate_protected LIKE('%|/#_tbl#-#_idnum#|#x#|%')">
<set orb="user" select="count(user.id) AS idcount" where="#_where#">
<setcrawl><var _tot = set.idcount></setcrawl>
</set>
<var "Totals.r#x#" = _tot>
<var Totals.all = Totals.all + _tot>
</loop>
<var Pcts = StructNew()>
<var Pcts.all = 100>
<var Pcts.r1 = round(Totals.r1 / Totals.all * 100)>
<var Pcts.r2 = round(Totals.r2 / Totals.all * 100)>
<var Pcts.r3 = round(Totals.r3 / Totals.all * 100)>
<var _padding = 5>
<small><table style="width:500px; border:0px solid white;" cellpadding="0" cellspacing="0" border="0">
<var _gradient_a = "##ffcccc">
<var _gradient_b = "##fff5f5">
<tr>
<td style="width:20%; border:0px solid white;"><div align="left" style="padding:#_padding#px;">
1 - Bad:
</div></td>
<td style="width:10%; border:0px solid white;"><div align="center" style="padding:#_padding#px; background:red; color:white; border-top-left-radius:7px; border-bottom-left-radius:7px;">
#numberFormat(Totals.r1)#
</div></td>
<td style="width:70%; border:0px solid white; background: #_gradient_a#; background: -webkit-gradient(linear, left, right, from(#_gradient_a#), to(#_gradient_b#)); background: -webkit-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -moz-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -ms-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -o-linear-gradient(left,#_gradient_a#, #_gradient_b#);"><div align="center" style="padding:#_padding#px 0px; background:red; color:white; width:#Pcts.r1#%; <if Pcts.r1 NEQ 0> border-top-right-radius:7px; border-bottom-right-radius:7px;</if>">
<!--- --->
</div></td>
</tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
<var _gradient_a = "##ccffcc">
<var _gradient_b = "##f5fff5">
<tr>
<td style="width:20%; border:0px solid white;"><div align="left" style="padding:#_padding#px;">
2 - Good:
</div></td>
<td style="width:10%; border:0px solid white;"><div align="center" style="padding:#_padding#px; background:green; color:white; border-top-left-radius:7px; border-bottom-left-radius:7px;">
#numberFormat(Totals.r2)#
</div></td>
<td style="width:70%; border:0px solid white; background: #_gradient_a#; background: -webkit-gradient(linear, left, right, from(#_gradient_a#), to(#_gradient_b#)); background: -webkit-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -moz-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -ms-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -o-linear-gradient(left,#_gradient_a#, #_gradient_b#);"><div align="center" style="padding:#_padding#px 0px; background:green; color:white; width:#Pcts.r2#%; <if Pcts.r2 NEQ 0> border-top-right-radius:7px; border-bottom-right-radius:7px;</if>">
<!--- --->
</div></td>
</tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
<var _gradient_a = "##ccccff">
<var _gradient_b = "##f5f5ff">
<tr>
<td style="width:20%; border:0px solid white;"><div align="left" style="padding:#_padding#px;">
3 - Amazing:
</div></td>
<td style="width:10%; border:0px solid white;"><div align="center" style="padding:#_padding#px; background:blue; color:white; border-top-left-radius:7px; border-bottom-left-radius:7px;">
#numberFormat(Totals.r3)#
</div></td>
<td style="width:70%; border:0px solid white; background: #_gradient_a#; background: -webkit-gradient(linear, left, right, from(#_gradient_a#), to(#_gradient_b#)); background: -webkit-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -moz-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -ms-linear-gradient(left, #_gradient_a#, #_gradient_b#); background: -o-linear-gradient(left,#_gradient_a#, #_gradient_b#);"><div align="center" style="padding:#_padding#px 0px; background:blue; color:white; width:#Pcts.r3#%; <if Pcts.r3 NEQ 0> border-top-right-radius:7px; border-bottom-right-radius:7px;</if>">
<!--- --->
</div></td>
</tr>
</table></small>
<div>&nbsp;</div>
<small><small><div style="width:500px; color:#C.g3#; line-height:1.32em;" align="left">
<div style="padding:#_padding#px;">
<p>
<var _avg = ( Totals.r1*1 + Totals.r2*2 + Totals.r3*3 ) / Totals.all>
<b>Average Rating: #round(numberFormat(_avg,"9.9"))#</b>
</p>
<p>
#numberFormat(Totals.all)# Club Steve USA member<if Totals.all NEQ 1>s</if> rated this.
<br>You gave this a #numberFormat(_rating)# out of 3.
</p>
</div>
</div></small></small>
<div>&nbsp;</div>

<tag.spf_btn val="Finished With This" slash="#so_slash_string#" align="left">

</if>

</div>
<!---<if _rating EQ 0>
<div align="left" style="margin:1em;">
<div style="line-height:1.32em;">
<p>
Click on "1", "2" or "3" to rate this #lcase(_singular)#. Later,
you can see how other Club Steve USA members rated this.
</p>
</div>
</div>
</if>--->
</div>

<if _rating GT 0>
<tag.jquery plugins="scrollto">
<script type="text/javascript">
$(document).ready(function() {
setTimeout("$.scrollTo('##ratings', {duration: 2000})",100);
});
</script>
</if>