https://boutique.bistro-regent.fr/modules/productcomments/views/js/jquery.rating.plugin.js

1/**
2 * Copyright since 2007 PrestaShop SA and Contributors
3 * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
4 *
5 * NOTICE OF LICENSE
6 *
7 * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
8 * that is bundled with this package in the file LICENSE.md.
9 * It is also available through the world-wide-web at this URL:
10 * https://opensource.org/licenses/AFL-3.0
11 * If you did not receive a copy of the license and are unable to
12 * obtain it through the world-wide-web, please send an email
13 * to [email protected] so we can send you a copy immediately.
14 *
15 * DISCLAIMER
16 *
17 * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
18 * versions in the future. If you wish to customize PrestaShop for your
19 * needs please refer to https://devdocs.prestashop.com/ for more information.
20 *
21 * @author    PrestaShop SA and Contributors <[email protected]>
22 * @copyright Since 2007 PrestaShop SA and Contributors
23 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
24 */
25
26jQuery.fn.rating = function(generalOptions) {
27  const $ratings = $(this);
28
29  $ratings.each(function initRating() {
30    const $ratingComponent = $(this);
31    var options = generalOptions ? generalOptions : {};
32    if (!options.grade && $ratingComponent.data('grade')) {
33      options.grade = $ratingComponent.data('grade');
34    }
35    if (!options.min && $ratingComponent.data('min')) {
36      options.min = $ratingComponent.data('min');
37    }
38    if (!options.max && $ratingComponent.data('max')) {
39      options.max = $ratingComponent.data('max');
40    }
41    if (!options.input && $ratingComponent.data('input')) {
42      options.input = $ratingComponent.data('input');
43    }
44    var componentOptions = jQuery.extend({
45      grade: null,
46      input: null,
47      min: 1,
48      max: 5,
49      starWidth: 20
50    }, options);
51
52    const minValue = Math.min(componentOptions.min, componentOptions.max);
53    const maxValue = Math.max(componentOptions.min, componentOptions.max);
54    const ratingValue = Math.min(Math.max(minValue, componentOptions.grade), maxValue);
55
56    $ratingComponent.html('');
57    $ratingComponent.append('<div class="star-content star-empty clearfix"></div>');
58    $ratingComponent.append('<div class="star-content star-full clearfix"></div>');
59
60    const emptyStars = $('.star-empty', this);
61    const fullStars = $('.star-full', this);
62    const emptyStar = $('<div class="star"></div>');
63    const fullStar = $('<div class="star-on"></div>');
64
65    var ratingInput;
66    if (componentOptions.input) {
67      ratingInput = $('<input type="number" name="'+componentOptions.input+'" id="'+componentOptions.input+'" />');
68      ratingInput.val(ratingValue);
69      ratingInput.css('display', 'none');
70      ratingInput.on('change', displayInteractiveGrade);
71      $ratingComponent.append(ratingInput);
72      initInteractiveGrade();
73    } else {
74      displayGrade(ratingValue);
75    }
76
77    function initInteractiveGrade() {
78      emptyStars.html('');
79      fullStars.html('');
80      var newStar;
81      for (var i = minValue; i <= maxValue; ++i) {
82        newStar = emptyStar.clone();
83        newStar.data('grade', i);
84        newStar.on('mouseenter mouseleave', function overStar() {
85          var overIndex = $('.star', fullStars).index($(this));
86          $('.star', fullStars).each(function overStars() {
87            $(this).removeClass('star-on');
88            var starIndex = $('.star', fullStars).index($(this));
89            if (starIndex <= overIndex) {
90              $(this).addClass('star-hover');
91            } else {
92              $(this).removeClass('star-hover');
93            }
94          });
95        });
96        newStar.on('click', function selectGrade() {
97          var selectedGrade = $(this).data('grade');
98          ratingInput.val(selectedGrade);
99          ratingChosen = true;
100        });
101        fullStars.append(newStar);
102      }
103
104      fullStars.on('mouseenter', function(){}).on('mouseleave', displayInteractiveGrade);
105      displayInteractiveGrade();
106    }
107
108    function displayInteractiveGrade() {
109      $('.star', fullStars).each(function displayStar() {
110        var starValue = $(this).data('grade');
111        $(this).removeClass('star-hover');
112        if (starValue <= ratingInput.val()) {
113          $(this).addClass('star-on');
114        } else {
115          $(this).removeClass('star-on');
116        }
117      });
118    }
119
120    function displayGrade(grade) {
121      emptyStars.html('');
122      fullStars.html('');
123      var newStar;
124      for (var i = minValue; i <= maxValue; ++i) {
125        if (i <= Math.floor(grade)) {
126          newStar = emptyStar.clone();
127          newStar.css('visibility', 'hidden');
128          emptyStars.append(newStar);
129          fullStars.append(fullStar.clone());
130        } else if (i > Math.ceil(grade)) {
131          newStar = emptyStar.clone();
132          emptyStars.append(newStar.clone());
133        } else {
134          //This the partial star composed of
135          // - one invisible partial empty star
136          // - one visible partial empty star (remaining part)
137          // - one visible partial full star
138          var fullWidth = (grade - i + 1) * componentOptions.starWidth;
139          var emptyWidth = componentOptions.starWidth - fullWidth;
140          newStar = emptyStar.clone();
141          newStar.css('visibility', 'hidden');
142          newStar.css('width', fullWidth);
143          emptyStars.append(newStar);
144
145          newStar = emptyStar.clone();
146          newStar.css('width', emptyWidth);
147          newStar.css('background-position', '0px -'+fullWidth+'px');
148          newStar.css('background-position', '-'+fullWidth+'px 0px');
149          newStar.css('marginLeft', 0);
150          emptyStars.append(newStar);
151
152          fullStar.css('width', fullWidth);
153          fullStars.append(fullStar.clone());
154        }
155      }
156    }
157  });
158}