https://matexmotors.com/Content/assets/plugins/rating/jquery.rating-stars.js

1jQuery.fn.ratingStars = function( options ) {
2 
3    var defaults = {
4        selectors: {
5            starsSelector: '.rating-stars',
6            starSelector: '.rating-star',
7            starActiveClass: 'is--active',
8            starHoverClass: 'is--hover',
9            starNoHoverClass: 'is--no-hover',
10            targetFormElementSelector: '.rating-value'
11        }
12    };
13 
14    var settings = $.extend( {}, defaults, options );
15
16    var methods = {
17        init: function(element) {
18            var me = this;
19            
20            methods.registerEvents(element);
21            methods.loadDefaultValue(element);
22        },
23
24        loadDefaultValue: function (element) {
25            var me = this;
26            var defaultValue = $(element).children(settings.selectors.targetFormElementSelector).val();
27
28            var i = 0;
29            $.each($(element).children(settings.starsSelector).children(settings.starSelector), function(index, element) {
30                if(i <= (defaultValue - 1)) {
31                    $(element).addClass(settings.selectors.starActiveClass);
32                }
33                i++;
34            });
35        },
36
37        registerEvents: function (element) {
38            var me = this;
39    
40            $.each($(element).children(settings.starsSelector).children(settings.starSelector), function(index, starElement) {
41                $(starElement).on("mouseenter", $.proxy(me.onStarEnter, me, starElement, element));
42                $(starElement).on("mouseleave", $.proxy(me.onStarLeave, me, starElement, element));
43                $(starElement).on("click touchstart", $.proxy(me.onStarSelected, me, starElement, element));
44            });
45        },
46
47        onStarEnter: function(starElement, container) {
48            var me = this;
49            var elementIndex = $(starElement).index();
50    
51            // add the hover classes
52            var i = 0;
53            $.each($(container).children(settings.starsSelector).children(settings.starSelector), function(index, element) {
54                if(i <= elementIndex) {
55                    // add a class to represent the chosen stars.
56                    $(element).addClass(settings.selectors.starHoverClass);
57                } else {
58                    // add a class to represent the remaining stars.
59                    $(element).addClass(settings.selectors.starNoHoverClass);
60                }
61                i++;
62            });
63
64            $(container).trigger("ratingOnEnter", {
65                ratingValue: (elementIndex + 1)
66            });
67        },
68    
69        onStarLeave: function(starElement, container) {
70            var me = this;
71            var elementIndex = $(starElement).index();
72    
73            // remove all hover classes
74            $(container).children(settings.starsSelector).children(settings.starSelector).removeClass(settings.selectors.starHoverClass);
75            $(container).children(settings.starsSelector).children(settings.starSelector).removeClass(settings.selectors.starNoHoverClass);
76
77            $(container).trigger("ratingOnLeave", {
78                ratingValue: (elementIndex + 1)
79            });
80        },
81    
82        onStarSelected: function(starElement, container) {
83            var me = this;
84            var elementIndex = $(starElement).index();
85    
86            // remove the currently selected class
87            $(container).children(settings.starsSelector).children(settings.starSelector).removeClass(settings.selectors.starActiveClass);
88    
89            // set the selected class for the stars
90            var i = 0;
91            $.each($(container).children(settings.starsSelector).children(settings.starSelector), function(index, element) {
92                if(i <= elementIndex) {
93                    $(element).addClass(settings.selectors.starActiveClass);
94                }
95                i++;
96            });
97    
98            // set the rating value to the form
99            $(container).children(settings.selectors.targetFormElementSelector).val(elementIndex + 1);
100
101            $(container).trigger("ratingChanged", {

102                ratingValue: (elementIndex + 1)
103            });
104        }
105    };
106 
107    return this.each(function() {
108        methods.init($(this));
109    });
110};