Рейтинг starrr (Разовое использование)
 

Здравствуйте, подскажите пожалуйста как можно сделать разовую активацию рейтинга? Один раз нажал и рейтинг был заблокирован, пока не перезагрузишь страницу.

https://github.com/dobtco/starrr

https://jsfiddle.net/PraVitelb/6x49hc18/11/

<div class="starrr" data-rating="'7.5'" id="1"></div>
<div class="starrr" data-rating="'3.4'" id="2"></div>

var slice = [].slice;
(function($, window) {
	var Starrr;
	var active;
	window.Starrr = Starrr = (function() {
		Starrr.prototype.defaults = {
			rating: void 0,
			max: 10.0,
			readOnly: false,
			emptyClass: 'far fa-star',
			fullClass: 'fas fa-star',
			halfClass: 'fas fa-star-half-alt',
			change: function(e, value) {}
		};
	
		function Starrr($el, options) {
			this.options = $.extend({}, this.defaults, options);
			this.$el = $el;
			this.createStars();
			this.syncRating();
			if (this.options.readOnly) {
				$(this)[0].$el.children().addClass('readonly')
				return;
			}
			this.$el.on('mouseover.starrr', 'a', (function(_this) {
				return function(e) {
					return _this.syncRating(_this.getStars().index(e.currentTarget) + 1.0);
				};
			})(this));
			this.$el.on('mouseout.starrr', (function(_this) {
				return function() {
					return _this.syncRating();
				};
			})(this));
			this.$el.on('click.starrr', 'a', (function(_this) {
				return function(e) {
					e.preventDefault();
					return _this.setRating(_this.getStars().index(e.currentTarget) + 1.0);
				};
			})(this));
			this.$el.on('starrr:change', this.options.change);
		}
		Starrr.prototype.getStars = function() {
			return this.$el.find('a');
		};
		Starrr.prototype.createStars = function() {
			var j, ref, results;
			results = [];
			for (j = 0.5, ref = this.options.max; 0.5 <= ref ? j <= ref : j >= ref; 0.5 <= ref ? j++ : j--) {
				results.push(this.$el.append("<a href='#rating' />"));
			}
			return results;
		};
		Starrr.prototype.setRating = function(rating) {
			/*if (this.options.rating === rating) {
				rating = void 0;
			}*/
			this.options.rating = rating;
			this.syncRating();
			return this.$el.trigger('starrr:change', rating);
		};
		Starrr.prototype.getRating = function() {
			return this.options.rating;
		};
		Starrr.prototype.syncRating = function(rating) {
			var $stars, i, j, ref, results;
			rating || (rating = this.options.rating);
			$stars = this.getStars();
			results = [];
			for (i = j = 0.5, ref = this.options.max; 0.5 <= ref ? j <= ref : j >= ref; i = 0.5 <= ref ? ++j : --j) {
				results.push($stars.eq(i - 0.5).removeClass(rating >= i ? (rating >= (i+0.5) ? this.options.halfClass : this.options.fullClass) : (rating < (i+0.5) ? this.options.halfClass : this.options.halfClass)).addClass(rating >= i ? (rating >= (i+0.5) ? this.options.fullClass : this.options.halfClass) : (rating < (i+0.5) ? this.options.emptyClass : this.options.fullClass)));
			}
			return results;
		};
		return Starrr;
	})();
	return $.fn.extend({
		starrr: function() {
			var args, option;
			option = arguments[0], args = 2 <= arguments.length ? slice.call(arguments, 1) : [];
			return this.each(function() {
				var data;
				option.rating = $(this).attr("data-rating");
				data = $(this).data('starrr');
				if (!data) {
					$(this).data('starrr', (data = new Starrr($(this), option)));
				}
				if (typeof option === 'string') {
					return data[option].apply(data, args);
				}
			});
		}
	});
})(window.jQuery, window);

строка 35
this.$el.one('click.starrr', 'a', (function(_this) {

Спасибо Вам большое

А не подскажете ещё как можно заблокировать использование по id

<div class="starrr" data-rating="'7.5'" id="1"></div>
<div class="starrr" data-rating="'3.4'" id="2"></div>
<div class="starrr" data-rating="'7.5'" id="3"></div>

Допустим id="3" чтобы нажать нельзя было
Там есть функция - readOnly: true, но как бы я не пробовал, либо не блокирует, либо всё не работает

PraVitelb,
после строки 18 добавить код

this.options.readOnly =  this.$el.data('readonly');

а в элемент атрибут
<div class="starrr" data-rating="7.1" id="2" data-readonly="true" ></div>

рони,

А через JS это можно сделать? То есть при нажатии чтобы присваивался атрибут
Пытаюсь добавить никак не получается

PraVitelb,
не понимаю

рони,
Атрибут: data-readonly отключает использование рейтинга
Мне нужно чтобы при нажатии на звезду применялся этот атрибут и рейтинг не работал
Но как я не пытаюсь его добавить ничего не выходит

чем one не устроил?

Устроил, но если наводить мышкой то анимация работала

В общем в конце концов получилось сделать то, что хотел, спасибо тебе большое рони за помощь)

PraVitelb,
вместо one

добавить

_this.$el.off();

в строку 37