Aller au contenu

Modifications pour le document RatingWidget

Modifié par Pascale STEIMETZ-LE CACHEUX le 2026/03/27 17:23
Depuis la version 12.1
modifié par Pascale STEIMETZ-LE CACHEUX
sur 2026/03/25 16:54
Commentaire de modification : Il n'y a aucun commentaire pour cette version
À 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

Résumé

Détails

Propriétés de la Page
Contenu
... ... @@ -1,40 +38,3 @@
1 -{{velocity}}
2 -#if(!$ratingTarget)
3 - #set($ratingTarget = $doc.fullName)
4 -#end
5 -
6 -#set($currentDoc = $ratingTarget)
7 -
8 -#set($storeDoc = $xwiki.getDocument("Flora.RatingStore3"))
9 -#set($objects = $storeDoc.getObjects("Flora.RatingVoteClass3"))
10 -
11 -#set($total = 0)
12 -#set($count = 0)
13 -
14 -#foreach($obj in $objects)
15 - #if($obj && $obj.getValue("document") && $obj.getValue("document").toString() == $currentDoc)
16 - #set($note = $obj.getValue("note"))
17 - #if($note)
18 - #set($total = $total + $note)
19 - #set($count = $count + 1)
20 - #end
21 - #end
22 -#end
23 -
24 -#if($count > 0)
25 - #set($avg = $total / $count)
26 -#else
27 - #set($avg = 0)
28 -#end
29 -
30 -#set($stars = "")
31 -#foreach($i in [1..5])
32 - #if($i <= $avg.round())
33 - #set($stars = "${stars}★")
34 - #else
35 - #set($stars = "${stars}☆")
36 - #end
37 -#end
38 38  {{html clean="false"}}
39 39  <style>
40 40  .flora-rating-wrap {
... ... @@ -47,44 +47,138 @@
47 47   flex-wrap: wrap;
48 48   font-size: 14px;
49 49  }
13 +
50 50  .flora-rating-label {
51 51   font-weight: 600;
52 52   color: #2A2B69;
53 53  }
54 -.flora-stars {
18 +
19 +#flora-rating-widget {
55 55   display: inline-flex;
56 56   gap: 4px;
57 57  }
58 -.flora-stars button {
23 +
24 +#flora-rating-widget .flora-star {
59 59   background: none;
60 60   border: none;
61 - font-size: 22px;
62 - cursor: pointer;
63 - color: #d4af37;
64 64   padding: 0;
65 65   margin: 0;
29 + font-size: 24px;
30 + line-height: 1;
31 + cursor: pointer;
32 + color: #d4af37;
66 66  }
67 -.flora-stars button:hover,
68 -.flora-stars button.hovered {
34 +
35 +#flora-rating-widget .flora-star:hover,
36 +#flora-rating-widget .flora-star.hovered {
69 69   color: #f2c94c;
70 70  }
39 +
71 71  .flora-rating-result {
72 72   color: #2F2F2F;
73 73  }
43 +
44 +#flora-rating-message {
45 + font-size: 13px;
46 + color: #2F2F2F;
47 +}
74 74  </style>
49 +{{/html}}
75 75  
76 -<div class="flora-rating-wrap" data-doc="$escapetool.xml($currentDoc)">
77 - <span class="flora-rating-label">Votre avis compte pour nous, que pensez-vous de cet article ?</span>
51 +{{groovy}}
52 +def doc = xcontext.getDoc().getFullName()
78 78  
79 - <div class="flora-stars">
80 - <button class="flora-star" data-note="1" type="button">★</button>
81 - <button class="flora-star" data-note="2" type="button">★</button>
82 - <button class="flora-star" data-note="3" type="button">★</button>
83 - <button class="flora-star" data-note="4" type="button">★</button>
84 - <button class="flora-star" data-note="5" type="button">★</button>
85 - </div>
54 +def store = xwiki.getDocument("Flora.RatingStore3")
55 +def objects = store.getObjects("Flora.RatingVoteClass3")
86 86  
87 - <span class="flora-rating-result">$stars ($count votes)</span>
88 -</div>
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>
89 89  {{/html}}
90 -{{/velocity}}
XWiki.XWikiRights[0]
Autoriser / Interdire
... ... @@ -1,1 +1,0 @@
1 -Autoriser
Groupes
... ... @@ -1,1 +1,0 @@
1 -XWiki.XWikiAllGroup
Niveaux
... ... @@ -1,1 +1,0 @@
1 -view,comment
XWiki.XWikiRights[1]
Autoriser / Interdire
... ... @@ -1,1 +1,0 @@
1 -Autoriser
Groupes
... ... @@ -1,1 +1,0 @@
1 -XWiki.XWikiAdminGroup
Niveaux
... ... @@ -1,1 +1,0 @@
1 -view,comment
XWiki.XWikiRights[2]
Autoriser / Interdire
... ... @@ -1,1 +1,0 @@
1 -Autoriser
Niveaux
... ... @@ -1,1 +1,0 @@
1 -view,comment
Utilisateurs
... ... @@ -1,1 +1,0 @@
1 -XWiki.XWikiGuest