Modifications pour le document RatingWidget

Résumé

• Propriétés de la Page (1 modifications, 0 ajouts, 0 suppressions)

Détails

Propriétés de la Page

Contenu

...	...	@@ -1,7 +1,43 @@
1	1	{{velocity}}
2		-#set($currentDoc = $doc.fullName)
	2	+#if(!$ratingTarget)
	3	+ #set($ratingTarget = $doc.fullName)
	4	+#end
3	3	{{/velocity}}
4	4
	7	+{{groovy}}
	8	+def currentDoc = "$ratingTarget"
	9	+
	10	+def store = xwiki.getDocument("Flora.RatingStore3")
	11	+def objects = store.getObjects("Flora.RatingVoteClass3")
	12	+
	13	+def total = 0
	14	+def count = 0
	15	+
	16	+if (objects != null) {
	17	+ for (o in objects) {
	18	+ if (o != null) {
	19	+ def docValue = o.getValue("document")
	20	+ def noteValue = o.getValue("note")
	21	+
	22	+ if (docValue != null && docValue.toString() == currentDoc && noteValue != null) {
	23	+ total += Integer.parseInt(noteValue.toString())
	24	+ count += 1
	25	+ }
	26	+ }
	27	+ }
	28	+}
	29	+
	30	+def avg = count > 0 ? total / count : 0
	31	+def stars = ""
	32	+for (int i = 1; i <= 5; i++) {
	33	+ stars += (i <= Math.round(avg)) ? "★" : "☆"
	34	+}
	35	+
	36	+xcontext.put("floraRatingDoc", currentDoc)
	37	+xcontext.put("floraRatingStars", stars)
	38	+xcontext.put("floraRatingCount", count)
	39	+{{/groovy}}
	40	+
5	5	{{html clean="false"}}
6	6	<style>
7	7	.flora-rating-wrap {
...	...	@@ -14,140 +14,43 @@
14	14	flex-wrap: wrap;
15	15	font-size: 14px;
16	16	}
17		-
18	18	.flora-rating-label {
19	19	font-weight: 600;
20	20	color: #2A2B69;
21	21	}
22		-
23		-.flora-rating-actions {
	57	+.flora-stars {
24	24	display: inline-flex;
25	25	gap: 4px;
26	26	}
27		-
28		-.flora-rating-actions button {
	61	+.flora-stars button {
29	29	background: none;
30	30	border: none;
31		- padding: 0;
32		- margin: 0;
33		- font-size: 24px;
34		- line-height: 1;
	64	+ font-size: 22px;
35	35	cursor: pointer;
36	36	color: #d4af37;
	67	+ padding: 0;
	68	+ margin: 0;
37	37	}
38		-
39		-.flora-rating-actions button:hover,
40		-.flora-rating-actions button.hovered {
	70	+.flora-stars button:hover,
	71	+.flora-stars button.hovered {
41	41	color: #f2c94c;
42	42	}
43		-
44	44	.flora-rating-result {
45	45	color: #2F2F2F;
46	46	}
47		-
48		-.flora-rating-message {
49		- font-size: 13px;
50		- color: #2F2F2F;
51		-}
52	52	</style>
53	53
54		-<div class="flora-rating-wrap">
	79	+<div class="flora-rating-wrap" data-doc="$escapetool.xml($floraRatingDoc)">
55	55	<span class="flora-rating-label">Noter cette page</span>
56	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>
	82	+ <div class="flora-stars">
	83	+ <button class="flora-star" data-note="1" type="button">★</button>
	84	+ <button class="flora-star" data-note="2" type="button">★</button>
	85	+ <button class="flora-star" data-note="3" type="button">★</button>
	86	+ <button class="flora-star" data-note="4" type="button">★</button>
	87	+ <button class="flora-star" data-note="5" type="button">★</button>
63	63	</div>
64	64
65		- <span class="flora-rating-message"></span>
	90	+ <span class="flora-rating-result">$floraRatingStars ($floraRatingCount votes)</span>
66	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	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}}