From 1ac69d664ef258186b9252fc610ca7d777bbdd79 Mon Sep 17 00:00:00 2001
From: Simon Cozens <simon@simon-cozens.org>
Date: Thu, 8 Feb 2007 20:19:41 +0000
Subject: [PATCH] Ajax-up the comments (References #5) and add user ratings
 (Closes #6).

git-svn-id: http://svn.simon-cozens.org/memories/trunk@12 041978f6-d955-411f-a9d7-1d8545c9c3c7
---
 templates/header                 |   1 +
 templates/photo/comment          |  46 +++++++++++++++--
 templates/static/alt_star.gif    | Bin 0 -> 1947 bytes
 templates/static/star.gif        | Bin 0 -> 1120 bytes
 templates/static/star_rating.css |  84 +++++++++++++++++++++++++++++++
 templates/static/star_small.gif  | Bin 0 -> 263 bytes
 6 files changed, 127 insertions(+), 4 deletions(-)
 create mode 100644 templates/static/alt_star.gif
 create mode 100644 templates/static/star.gif
 create mode 100644 templates/static/star_rating.css
 create mode 100644 templates/static/star_small.gif

diff --git a/templates/header b/templates/header
index ada7f30..50c09d7 100644
--- a/templates/header
+++ b/templates/header
@@ -3,6 +3,7 @@
     <title> Memories - Photo Sharing [% IF photo %] - [% photo.title; END%]</title>
     <meta name="robots" content="nofollow">
     <link title="Maypole" href="[%base%]/static/memories.css" type="text/css" rel="stylesheet"/>
+    <link href="[%base%]/static/star_rating.css" type="text/css" rel="stylesheet"/>
     [% IF photos %]
 <link rel="alternate" type="application/rdf+xml" title="RSS"
 href="[%base%]/[%path%]?format=rss" />
diff --git a/templates/photo/comment b/templates/photo/comment
index 498e5b6..f1c74da 100644
--- a/templates/photo/comment
+++ b/templates/photo/comment
@@ -1,3 +1,42 @@
+<p style="background:#fff">Rate this photo!
+<span class="inline-rating">
+<ul class="star-rating">
+   [% IF photo.approx_rating %]
+   <li class='current-rating' style="width:[% photo.approx_rating * 25 %]px">Currently [%photo.approx_rating%]/5 Stars.</li>
+   [% END %]
+   <li><a href='javascript:add_rating(1)' title='1 star out of 5' class='one-star'>1</a></li>
+   <li><a href='javascript:add_rating(2)' title='2 stars out of 5' class='two-stars'>2</a></li>
+   <li><a href='javascript:add_rating(3)' title='3 stars out of 5' class='three-stars'>3</a></li>
+   <li><a href='javascript:add_rating(4)' title='4 stars out of 5' class='four-stars'>4</a></li>
+   <li><a href='javascript:add_rating(5)' title='5 stars out of 5' class='five-stars'>5</a></li>
+   </ul>
+</span>
+ ([%photo.approx_rating%] out of [%photo.rated%] votes) 
+</p>
+<script>
+add_rating = function (rank) {
+    new Ajax.Request("[%base%]/photo/add_rating/[%photo.id%]",
+      { method: "get", parameters: {rating: rank },
+        onSuccess: function () {
+          new Ajax.Updater("content", "[%base%]/photo/comment/[%photo.id%]")
+        }
+      });
+    add_rating = function (rank) { alert("You've already rated this photo")  }
+}
+
+
+function post_comment () {
+    new Ajax.Request("[%base%]/photo/add_comment/[%photo.id%]",
+      { method: "post",
+        parameters: { name: $("commentname").value,
+                      content: $("newcomment").value
+                    },
+        onSuccess: function () {
+          new Ajax.Updater("content", "[%base%]/photo/comment/[%photo.id%]")
+        }
+      });
+}
+</script>
 <div class="comments">
 [% FOR comment = photo.comments %]
     <div class="comment">
@@ -6,10 +45,9 @@
     </div>
 [% END %]
     <div class="comment">
-        <form action="[%base%]/photo/add_comment/[%photo.id%]" method="post">
-        Name: <input name="name" /> <hr>
-        <textarea name="content" cols="60" rows="5"/>
-        </textarea>
+        <form action="javascript:post_comment()" method="post">
+        Name: <input id="commentname" name="name" /> <hr>
+        <textarea id="newcomment" name="content" cols="60" rows="5"/></textarea>
         <p>
         <input type="submit" name="Comment on this picture" value="Comment on this picture">
         </p>
diff --git a/templates/static/alt_star.gif b/templates/static/alt_star.gif
new file mode 100644
index 0000000000000000000000000000000000000000..068fa7f3fa6bc50d2080aaf6cf82c60187b89f97
GIT binary patch
literal 1947
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
UrwbmYuY7&K%u??|p%9sW0sPrdm;e9(

literal 0
HcmV?d00001

diff --git a/templates/static/star.gif b/templates/static/star.gif
new file mode 100644
index 0000000000000000000000000000000000000000..32633e30d43c43e8b412b7d47a80e2bd40c9a052
GIT binary patch
literal 1120
zcmcJM{WIHl0DwOdny;5OK}77ZWYMi!dPHkp)=YF+5;fwbtgUU->6O~9Gwsb?Z;OaT
zN=`_IzHE0fF)yvD)ltWqdRsQMF)`83d%P?Z^_B$re7F7)dwzcI`Q>4AKMV;?^8jbS
z0sz~hlW>2=FgvFk9=583_kR5x9lW)<u`xG2V^+n$iKzYl9CKZ)b-H8kVa&2|8NN!}
zeUu3oB-Vix6h-0s#MI=Z`FrNp=9YD~7hSvy4e@aCOLQ;@!fi{d0O~TW{pa9r@3PT2
zHaZF|58z)>mitj~JkPo|51*ZeYl@xnFt{jylT{Y=Eok0^FKb`u$KldBbnp_Kird%M
z!qpzLiUr61liT4|I{cln*A~0DuweN)0dDJeTcV+91CD(KO?TlAAI@Z$Os2K9wVl#X
zbW(v%<(U+baOIQz&IEJa$GeZOSq)ENUpUmo!L4j)S%UjUxZ43uayTJIwc&815zb~=
z4PDUu_ul9|xIP3|A46j$8U+3is1{or97qR#uj8+u036CE3JQdUBC(i#v#3PK=Fk{q
zsg#TmE7*!6JYK-y+!3)!w*@3zZ8Z^35_0Hx@-M}bQo2$|qIc2}n!JFG!y`U)#vKN&
zmfhFVNF3-cAHGL=BEVyYD{zHRk%kgBeM*d5P|#`8e-?|{6|_f1BT~+`m@_NIufOWg
zZw%Im3vms$NUo5gN3P5KkSasEvRT5mjV6kEaYu>^!oKl5Tb#nZawMUFc->{5X5*H8
zF+%0+qlyu5mM*Z295RK|tjs>EDsUhpZ#>Vnb(9?NKVRV)x-iFNIL#5g$Z2V6Kz=)?
zXf$vIJiyU>-)l*oNq4iqh|cBAyhRn^k`TKLoq^@#ZpX)Bo0w$8E>U-)6^X7|7yVY6
z%p(AT9Qb&L=m^JH4*AdG6R%cvCTMLW-n`sT?^kaV$tRu5Iv&=vN?x={d1T&gUWaoa
z@kCSLkL_-@UG-l2_)e}XqNNt8xiK!zONmh_zAfo&$w)BQOWlGk7Gsqd1#&gyhA)2Q
zpu^=WH$6hXAjZ(*w(5?G4Ae9&H)G#lMf&#G;ks$TFr~db2xCyWxYTRpe>zw42#WkY
zv#i@OvbS4F)87DU+`NYFm}E$u#@Yw?P}7MFC+z?eb1=cl-p4Z)xJEF_1euqvRXYf^
zHS4S{jC%^dM;`J4U}3ZRYLbs12mpr<y_1_4Nl1Mj;1R*rn+hsF`vIu1hy1{WOma#R
z)5cwc06_mk1F{{Iv@$|$Gv%`UqgmM#<WzYN$>}^}JcDp5cjol_C6qv5mmM}ObfxAR
zyG5(A2<A_&iYz06sF4j(D|o!4$h$lsa&+ZWh8jfe946`b*We7xJ2BtBsnAnaLg7l)
k-`OdvMm4lCO7ELKnSm{%NIid~+@D5Ydf6th#endC0kPx+iU0rr

literal 0
HcmV?d00001

diff --git a/templates/static/star_rating.css b/templates/static/star_rating.css
new file mode 100644
index 0000000..8ba0141
--- /dev/null
+++ b/templates/static/star_rating.css
@@ -0,0 +1,84 @@
+.star-rating,
+.star-rating a:hover,
+.star-rating a:active,
+.star-rating a:focus,
+.star-rating .current-rating{
+	background: url(star.gif) left -1000px repeat-x;
+}
+.star-rating{
+	position:relative;
+	width:125px;
+	height:25px;
+	overflow:hidden;
+	list-style:none;
+	margin:0;
+	padding:0;
+	background-position: left top;
+}
+.star-rating li{
+	display: inline;
+}
+.star-rating a, 
+.star-rating .current-rating{
+	position:absolute;
+	top:0;
+	left:0;
+	text-indent:-1000em;
+	height:25px;
+	line-height:25px;
+	outline:none;
+	overflow:hidden;
+	border: none;
+}
+.star-rating a:hover,
+.star-rating a:active,
+.star-rating a:focus{
+	background-position: left bottom;
+}
+.star-rating a.one-star{
+	width:20%;
+	z-index:6;
+}
+.star-rating a.two-stars{
+	width:40%;
+	z-index:5;
+}
+.star-rating a.three-stars{
+	width:60%;
+	z-index:4;
+}
+.star-rating a.four-stars{
+	width:80%;
+	z-index:3;
+}
+.star-rating a.five-stars{
+	width:100%;
+	z-index:2;
+}
+.star-rating .current-rating{
+	z-index:1;
+	background-position: left center;
+}	
+
+/* for an inline rater */
+.inline-rating{
+	display:-moz-inline-block;
+	display:-moz-inline-box;
+	display:inline-block;
+	vertical-align: middle;
+}
+
+/* smaller star */
+.small-star{
+	width:50px;
+	height:10px;
+}
+.small-star,
+.small-star a:hover,
+.small-star a:active,
+.small-star a:focus,
+.small-star .current-rating{
+	background-image: url(star_small.gif);
+	line-height: 10px;
+	height: 10px;
+}



diff --git a/templates/static/star_small.gif b/templates/static/star_small.gif
new file mode 100644
index 0000000000000000000000000000000000000000..f180d8998aee5d0269c1ce0b9be19433f76b6ea0
GIT binary patch
literal 263
zcmZ?wbhEHb<YJIxIKsg29|(Sa`1bAFr%#{$zd8T^>HcTWp53`~=jP3u|1VGYf2QHg
znKS>775v{BuxHPn&6_v>U#9SXzQD?rEC0`Am^N)%Wo2bSK|xwt8qgR9Y(ViR3nM#&
z1cMGp5@aU>Ym0&cQ<K5GhQtMrH_dU*+2JO$+rn<b&g`z{J9#FD*SfVIeOqAFHOJ+J
zr&404&NSg9?VT|yx7Qx^-WMUT(rf1<mnj#O-ES5y3fU%l>g7jan+O(`Fa{o;W<f!9
x)@~kQVV>@8!M-WNf~*WI0#gN=lvt<EQ0AP<sm?3VEx@bJ#i+!{rKHGU4FFl^Y<U0x

literal 0
HcmV?d00001

-- 
2.39.5