Code source wiki de RatingWidget

Version 2.1 par Pascale STEIMETZ-LE CACHEUX le 2026/03/24 11:52

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