1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104
|
jQuery.fn.rater = function(url, options)
{
if(url == null) return;
function getParamValue(param,url) //récup valeur des get url
{
var u = url == undefined ? document.location.href : url;
var reg = new RegExp('(\\?|&|^)'+param+'=(.*?)(&|$)');
matches = u.match(reg);
return matches[2] != undefined ? decodeURIComponent(matches[2]).replace(/\+/g,' ') : '';
}
var voted = getParamValue('v',url);
//alert(url);
voted = (voted != '') ? voted : 0;
var settings = {
url : url, // post changes to
maxvalue : 10, // max number of stars
curvalue : 0,
voted : voted
// number of selected stars
};
if(options) { jQuery.extend(settings, options); };
jQuery.extend(settings, {cancel: (settings.maxvalue > 1) ? true : false});
var container = jQuery(this);
var parentContainer = $(this).parent();
jQuery.extend(container, { averageRating: settings.curvalue, url: settings.url });
console.log(parentContainer); //[div#RateUnit_1.blockTypes]
console.log(container);//[div#demo1.demo]
//console.log("#RateUnit_\\[1\\]".children("#demo\\[1\\]");
if(!settings.style || settings.style == null || settings.style == 'basic') {
var raterwidth = settings.maxvalue * 15;
var ratingparent = '<ul class="star-rating" style="width:'+raterwidth+'px">';
}
if(settings.style == 'small') {
var raterwidth = settings.maxvalue * 10;
var ratingparent = '<ul class="star-rating small-star" style="width:'+raterwidth+'px">';
}
if(settings.style == 'inline') {
var raterwidth = settings.maxvalue * 10;
var ratingparent = '<span class="inline-rating"><ul class="star-rating small-star" style="width:'+raterwidth+'px">';
}
container.append(ratingparent);
// create rater
var starWidth, starIndex, listitems = '';
var curvalueWidth = Math.floor(100 / settings.maxvalue * settings.curvalue);
for(var i = 0; i <= settings.maxvalue ; i++) {
if (i == 0) {
listitems+='<li class="current-rating" style="width:'+curvalueWidth+'%;">'+settings.curvalue+'/'+settings.maxvalue+'</li>';
} else {
starWidth = Math.floor(100 / settings.maxvalue * i);
starIndex = (settings.maxvalue - i) + 2;
listitems+='<li class="star"><a href="#'+i+'" title="Voter '+i+'" style="width:'+starWidth+'%;z-index:'+starIndex+'">'+i+'</a></li>';
}
}
container.find('.star-rating').append(listitems); // i am using find here, because the span wrapped in the small style would break children()
if(settings.maxvalue > 1) // add a container for the ajax result
{
container.append('<span class="star-rating-result"></span>');
}
var stars = jQuery(container).find('.star-rating').children('.star');
//if (voted == 0)
stars.click(function()
{
if(settings.maxvalue == 1) // on / off
{
settings.curvalue = (settings.curvalue == 0) ? 1 : 0;
jQuery(container).find('.star-rating').children('.current-rating').css({width:(settings.curvalue*100)+'%'});
jQuery.post(container.url, { "rating": settings.curvalue });
return false;
}
else
{
//alert (voted);
settings.curvalue = stars.index(this) + 1;
//raterValue = jQuery(container).find('.star-rating').children('.star').css({width:(settings.curvalue*100)+'%'});
raterValue = jQuery(this).children('a')[0].href.split('#')[1];
jQuery.post(container.url, { "rating": raterValue }, function(response){
container.children('.star-rating-result').html(response)
});
return false;
}
return true;
});
return this; // strict warning: anonymous function does not always return a value. fix?
} |
Partager