aboutsummaryrefslogtreecommitdiffstats
path: root/template
diff options
context:
space:
mode:
authorrvelices <rv-github@modusoptimus.com>2008-07-15 01:29:23 +0000
committerrvelices <rv-github@modusoptimus.com>2008-07-15 01:29:23 +0000
commit9c96b905ff3327ad5264b794048b6c71bbc5e4ee (patch)
treea0565907ca8d5546ffcd963c952e331e37109c9a /template
parentdf29ffbde72e88635f454d5d6d84c5a7209460f3 (diff)
- image rating on picture page done through ajax (tested safari/ie 6&7/ff)
git-svn-id: http://piwigo.org/svn/trunk@2435 68402e56-0260-453c-a942-63ccdbb3a9ee
Diffstat (limited to 'template')
-rw-r--r--template/yoga/picture.tpl10
-rw-r--r--template/yoga/rating.js142
2 files changed, 83 insertions, 69 deletions
diff --git a/template/yoga/picture.tpl b/template/yoga/picture.tpl
index af22ade18..aec446bd6 100644
--- a/template/yoga/picture.tpl
+++ b/template/yoga/picture.tpl
@@ -162,7 +162,6 @@ y.callService(
{
selectElement.disabled = true;
var y = new PwgWS(rootUrl);
-
y.callService(
"pwg.images.setPrivacyLevel", {image_id: id, level:level} ,
{
@@ -182,7 +181,7 @@ y.callService(
{if isset($rate_summary) }
<tr>
<td class="label">{'Average rate'|@translate}</td>
- <td class="value">
+ <td class="value" id="ratingSummary">
{if $rate_summary.count}
{assign var='rate_text' value='%.2f (rated %d times, standard deviation = %.2f)'|@translate }
{$pwg->sprintf($rate_text, $rate_summary.average, $rate_summary.count, $rate_summary.std) }
@@ -213,7 +212,7 @@ y.callService(
{if isset($rating)}
<form action="{$rating.F_ACTION}" method="post" id="rateForm">
<div>
-{if isset($rating.USER_RATE)}{'update_rate'|@translate}{else}{'new_rate'|@translate}{/if}
+<span id="updateRate">{if isset($rating.USER_RATE)}{'update_rate'|@translate}{else}{'new_rate'|@translate}{/if}</span>
:
{foreach from=$rating.marks item=mark name=rate_loop}
{if !$smarty.foreach.rate_loop.first} | {/if}
@@ -224,6 +223,11 @@ y.callService(
{/if}
{/foreach}
<script type="text/javascript" src="{$ROOT_URL}{$themeconf.template_dir}/rating.js"></script>
+<script type="text/javascript">
+makeNiceRatingForm( {ldelim}rootUrl: '{$ROOT_URL|@escape:"javascript"}', image_id: {$current.id},
+updateRateText: "{'update_rate'|@translate|@escape:'javascript'}", updateRateElement: document.getElementById("updateRate"),
+ratingSummaryText: "{'%.2f (rated %d times, standard deviation = %.2f)'|@translate|@escape:'javascript'}", ratingSummaryElement: document.getElementById("ratingSummary") {rdelim} );
+</script>
</div>
</form>
{/if}
diff --git a/template/yoga/rating.js b/template/yoga/rating.js
index a4f8f86b8..682ab10d0 100644
--- a/template/yoga/rating.js
+++ b/template/yoga/rating.js
@@ -1,90 +1,100 @@
-makeNiceRatingForm();
+var gRatingOptions, gRatingButtons, gUserRating;
-function makeNiceRatingForm()
+function makeNiceRatingForm(options)
{
- var form = document.getElementById('rateForm');
- if (!form) return; //? template changed
- gRatingButtons = form.getElementsByTagName('input');
+ gRatingOptions = options || {};
+ var form = document.getElementById('rateForm');
+ if (!form) return; //? template changed
- gUserRating = "";
- for (var i=0; i<gRatingButtons.length; i++)
- {
- if ( gRatingButtons[i].type=="button" )
- {
- gUserRating = gRatingButtons[i].value;
- break;
- }
- }
+ gRatingButtons = form.getElementsByTagName('input');
+ gUserRating = "";
+ for (var i=0; i<gRatingButtons.length; i++)
+ {
+ if ( gRatingButtons[i].type=="button" )
+ {
+ gUserRating = gRatingButtons[i].value;
+ break;
+ }
+ }
- for (var i=0; i<gRatingButtons.length; i++)
- {
- var rateButton = gRatingButtons[i];
- rateButton.initialRateValue = rateButton.value; // save it as a property
+ for (var i=0; i<gRatingButtons.length; i++)
+ {
+ var rateButton = gRatingButtons[i];
+ rateButton.initialRateValue = rateButton.value; // save it as a property
+ try { rateButton.type = "button"; } catch (e){}// avoid normal submit (use ajax); not working in IE6
- rateButton.value = ""; //hide the text IE/Opera
- with (rateButton.style)
- {
- textIndent = "-50px"; //hide the text FF
- marginLeft = marginRight = 0;
- }
+ if (navigator.userAgent.indexOf('AppleWebKit/') == -1 ) rateButton.value = ""; //hide the text IE/Opera - breaks safari
+ with (rateButton.style)
+ {
+ textIndent = "-50px"; //hide the text FF
+ marginLeft = marginRight = 0;
+ }
- if (i!=gRatingButtons.length-1 && rateButton.nextSibling.nodeType == 3 /*TEXT_NODE*/)
- rateButton.parentNode.removeChild(rateButton.nextSibling);
- if (i>0 && rateButton.previousSibling.nodeType == 3 /*TEXT_NODE*/)
- rateButton.parentNode.removeChild(rateButton.previousSibling);
+ if (i!=gRatingButtons.length-1 && rateButton.nextSibling.nodeType == 3 /*TEXT_NODE*/)
+ rateButton.parentNode.removeChild(rateButton.nextSibling);
+ if (i>0 && rateButton.previousSibling.nodeType == 3 /*TEXT_NODE*/)
+ rateButton.parentNode.removeChild(rateButton.previousSibling);
- if(window.addEventListener){ // Mozilla, Netscape, Firefox
- rateButton.addEventListener("click", updateRating, false );
- rateButton.addEventListener("mouseout", resetRatingStarDisplay, false );
- rateButton.addEventListener("mouseover", updateRatingStarDisplayEvt, false );
- }
- else if(window.attachEvent) { // IE
- rateButton.attachEvent("onclick", updateRating);
- rateButton.attachEvent("onmouseout", resetRatingStarDisplay);
- rateButton.attachEvent("onmouseover", updateRatingStarDisplayEvt);
- }
- }
- resetRatingStarDisplay();
+ if(window.addEventListener){ // Mozilla, Netscape, Firefox
+ rateButton.addEventListener("click", updateRating, false );
+ rateButton.addEventListener("mouseout", resetRatingStarDisplay, false );
+ rateButton.addEventListener("mouseover", updateRatingStarDisplayEvt, false );
+ }
+ else if(window.attachEvent) { // IE
+ rateButton.attachEvent("onclick", updateRating);
+ rateButton.attachEvent("onmouseout", resetRatingStarDisplay);
+ rateButton.attachEvent("onmouseover", updateRatingStarDisplayEvt);
+ }
+ }
+ resetRatingStarDisplay();
}
function resetRatingStarDisplay()
{
- updateRatingStarDisplay( gUserRating );
+ updateRatingStarDisplay( gUserRating );
}
function updateRatingStarDisplay(userRating)
{
- for (i=0; i<gRatingButtons.length; i++)
- {
- var rateButton = gRatingButtons[i];
- if (userRating!=="" && userRating>=rateButton.initialRateValue )
- {
- rateButton.className = "rateButtonStarFull";
- }
- else
- {
- rateButton.className = "rateButtonStarEmpty";
- }
- }
+ for (var i=0; i<gRatingButtons.length; i++)
+ gRatingButtons[i].className = (userRating!=="" && userRating>=gRatingButtons[i].initialRateValue ) ? "rateButtonStarFull" : "rateButtonStarEmpty";
}
function updateRatingStarDisplayEvt(e)
{
- if (e.target)
- updateRatingStarDisplay(e.target.initialRateValue);
- else //IE
- updateRatingStarDisplay(e.srcElement.initialRateValue);
+ updateRatingStarDisplay(
+ e.target ? e.target.initialRateValue : e.srcElement.initialRateValue);
}
function updateRating(e)
{
- if (e.target)
- var rateButton = e.target;
- else //IE
- var rateButton = e.srcElement;
- if (rateButton.initialRateValue == gUserRating)
- return false; //nothing to do
- // some ajax here one day would be nice
- rateButton.value = rateButton.initialRateValue; // put back real value
- return true;
+ var rateButton = e.target || e.srcElement;
+ if (rateButton.initialRateValue == gUserRating)
+ return false; //nothing to do
+
+ for (var i=0; i<gRatingButtons.length; i++) gRatingButtons[i].disabled=true;
+ var y = new PwgWS(gRatingOptions.rootUrl);
+ y.callService(
+ "pwg.images.rate", {image_id: gRatingOptions.image_id, rate: rateButton.initialRateValue } ,
+ {
+ onFailure: function(num, text) {
+ alert(num + " " + text);
+ document.location = rateButton.form.action + "&rate="+rateButton.initialRateValue;
+ },
+ onSuccess: function(result) {
+ gUserRating = rateButton.initialRateValue;
+ for (var i=0; i<gRatingButtons.length; i++) gRatingButtons[i].disabled=false;
+ if (gRatingOptions.updateRateElement) gRatingOptions.updateRateElement.innerHTML = gRatingOptions.updateRateText;
+ if (gRatingOptions.ratingSummaryElement)
+ {
+ var t = gRatingOptions.ratingSummaryText;
+ var args =[result.average, result.count, result.stdev], idx = 0, rexp = new RegExp( /%\.?\d*[sdf]/ );
+ _xxx = t.match( rexp );
+ while (idx<args.length) t=t.replace(rexp, args[idx++]);
+ gRatingOptions.ratingSummaryElement.innerHTML = t;
+ }
+ }
+ }
+ );
+ return false;
} \ No newline at end of file