Modifications pour le document RatingWidget

Modifié par Pascale STEIMETZ-LE CACHEUX le 2026/03/25 16:54

Depuis la version 1.1
modifié par Pascale STEIMETZ-LE CACHEUX
sur 2026/03/24 11:45
Commentaire de modification : Il n'y a aucun commentaire pour cette version
À la version 7.2
modifié par XWikiGuest
sur 2026/03/24 15:11
Commentaire de modification : Il n'y a aucun commentaire pour cette version

Résumé

Détails

Propriétés de la Page
Auteur du document
... ... @@ -1,1 +1,1 @@
1 -XWiki.PSZ
1 +XWiki.XWikiGuest
Contenu
... ... @@ -1,147 +1,0 @@
1 -{{html clean="false"}}
2 -<style>
3 -.flora-rating-wrap {
4 - margin-top: 16px;
5 - padding-top: 10px;
6 - border-top: 1px solid #D9DFEE;
7 - display: flex;
8 - align-items: center;
9 - gap: 14px;
10 - flex-wrap: wrap;
11 - font-size: 14px;
12 -}
13 -
14 -.flora-rating-label {
15 - font-weight: 600;
16 - color: #2A2B69;
17 -}
18 -
19 -#flora-rating-widget {
20 - display: inline-flex;
21 - gap: 4px;
22 -}
23 -
24 -#flora-rating-widget .flora-star {
25 - background: none;
26 - border: none;
27 - padding: 0;
28 - margin: 0;
29 - font-size: 24px;
30 - line-height: 1;
31 - cursor: pointer;
32 - color: #d4af37;
33 -}
34 -
35 -#flora-rating-widget .flora-star:hover,
36 -#flora-rating-widget .flora-star.hovered {
37 - color: #f2c94c;
38 -}
39 -
40 -.flora-rating-result {
41 - color: #2F2F2F;
42 -}
43 -
44 -#flora-rating-message {
45 - font-size: 13px;
46 - color: #2F2F2F;
47 -}
48 -</style>
49 -{{/html}}
50 -
51 -{{groovy}}
52 -def doc = xcontext.getDoc().getFullName()
53 -
54 -def store = xwiki.getDocument("Flora.RatingStore3")
55 -def objects = store.getObjects("Flora.RatingVoteClass3")
56 -
57 -def notes = []
58 -
59 -if (objects != null) {
60 - for (o in objects) {
61 - if (o != null && o.getValue("document") == doc) {
62 - notes.add(o.getValue("note"))
63 - }
64 - }
65 -}
66 -
67 -def moyenne = 0
68 -if (notes.size() > 0) {
69 - moyenne = notes.sum() / notes.size()
70 -}
71 -
72 -print('<div class="flora-rating-wrap">')
73 -print('<span class="flora-rating-label">Noter cette page</span>')
74 -
75 -print('<div id="flora-rating-widget" aria-label="Noter cette page">')
76 -for (int i = 1; i <= 5; i++) {
77 - print('<button type="button" class="flora-star" data-note="' + i + '" aria-label="' + i + ' étoiles">★</button>')
78 -}
79 -print('</div>')
80 -
81 -print('<span class="flora-rating-result">')
82 -for (int i = 1; i <= 5; i++) {
83 - if (i <= Math.round(moyenne)) {
84 - print('★')
85 - } else {
86 - print('☆')
87 - }
88 -}
89 -print(' (' + notes.size() + ' votes)</span>')
90 -
91 -print('<span id="flora-rating-message"></span>')
92 -print('</div>')
93 -{{/groovy}}
94 -
95 -{{html clean="false"}}
96 -<script>
97 -(function () {
98 - const widget = document.getElementById('flora-rating-widget');
99 - if (!widget) return;
100 -
101 - const stars = Array.from(widget.querySelectorAll('.flora-star'));
102 - const message = document.getElementById('flora-rating-message');
103 -
104 - function floraGetCookieId() {
105 - let id = localStorage.getItem('flora_rating_cookie');
106 - if (!id) {
107 - id = 'browser-' + Math.random().toString(36).slice(2);
108 - localStorage.setItem('flora_rating_cookie', id);
109 - }
110 - return id;
111 - }
112 -
113 - function paintStars(count) {
114 - stars.forEach((star, index) => {
115 - star.classList.toggle('hovered', index < count);
116 - });
117 - }
118 -
119 - stars.forEach((star) => {
120 - star.addEventListener('mouseenter', function () {
121 - paintStars(parseInt(this.dataset.note, 10));
122 - });
123 -
124 - star.addEventListener('click', function () {
125 - const note = parseInt(this.dataset.note, 10);
126 - const cookieId = floraGetCookieId();
127 - const doc = document.body.getAttribute('data-xwiki-document') || '';
128 - const url = '/bin/view/Flora/RatingService3?xpage=plain'
129 - + '&note=' + encodeURIComponent(note)
130 - + '&doc=' + encodeURIComponent(doc)
131 - + '&cookieId=' + encodeURIComponent(cookieId);
132 -
133 - fetch(url)
134 - .then(r => r.text())
135 - .then(() => window.location.reload())
136 - .catch(() => {
137 - if (message) message.innerText = 'Erreur lors de l’enregistrement.';
138 - });
139 - });
140 - });
141 -
142 - widget.addEventListener('mouseleave', function () {
143 - paintStars(0);
144 - });
145 -})();
146 -</script>
147 -{{/html}}