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 +5,3 @@
1		-{{velocity}}
2		-#set($currentDoc = $doc.fullName)
3		-{{/velocity}}
4		-
5	5	{{html clean="false"}}
6	6	<style>
7	7	.flora-rating-wrap {
...	...	@@ -20,12 +20,12 @@
20	20	color: #2A2B69;
21	21	}
22	22
23		-.flora-rating-actions {
	19	+#flora-rating-widget {
24	24	display: inline-flex;
25	25	gap: 4px;
26	26	}
27	27
28		-.flora-rating-actions button {
	24	+#flora-rating-widget .flora-star {
29	29	background: none;
30	30	border: none;
31	31	padding: 0;
...	...	@@ -36,8 +36,8 @@
36	36	color: #d4af37;
37	37	}
38	38
39		-.flora-rating-actions button:hover,
40		-.flora-rating-actions button.hovered {
	35	+#flora-rating-widget .flora-star:hover,
	36	+#flora-rating-widget .flora-star.hovered {
41	41	color: #f2c94c;
42	42	}
43	43
...	...	@@ -45,34 +45,65 @@
45	45	color: #2F2F2F;
46	46	}
47	47
48		-.flora-rating-message {
	44	+#flora-rating-message {
49	49	font-size: 13px;
50	50	color: #2F2F2F;
51	51	}
52	52	</style>
	49	+{{/html}}
53	53
54		-<div class="flora-rating-wrap">
55		- <span class="flora-rating-label">Noter cette page</span>
	51	+{{groovy}}
	52	+def doc = xcontext.getDoc().getFullName()
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>
63		- </div>
	54	+def store = xwiki.getDocument("Flora.RatingStore3")
	55	+def objects = store.getObjects("Flora.RatingVoteClass3")
64	64
65		- <span class="flora-rating-message"></span>
66		-</div>
	57	+def notes = []
67	67
	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"}}
68	68	<script>
69	69	(function () {
70		- const actions = document.querySelector('.flora-rating-actions');
71		- if (!actions) return;
	98	+ const widget = document.getElementById('flora-rating-widget');
	99	+ if (!widget) return;
72	72
73		- const stars = Array.from(actions.querySelectorAll('button'));
74		- const message = document.querySelector('.flora-rating-message');
75		- const doc = actions.getAttribute('data-doc');
	101	+ const stars = Array.from(widget.querySelectorAll('.flora-star'));
	102	+ const message = document.getElementById('flora-rating-message');
76	76
77	77	function floraGetCookieId() {
78	78	let id = localStorage.getItem('flora_rating_cookie');
...	...	@@ -97,6 +97,7 @@
97	97	star.addEventListener('click', function () {
98	98	const note = parseInt(this.dataset.note, 10);
99	99	const cookieId = floraGetCookieId();
	127	+ const doc = document.body.getAttribute('data-xwiki-document') || '';
100	100	const url = '/bin/view/Flora/RatingService3?xpage=plain'
101	101	+ '&note=' + encodeURIComponent(note)
102	102	+ '&doc=' + encodeURIComponent(doc)
...	...	@@ -106,48 +106,14 @@
106	106	.then(r => r.text())
107	107	.then(() => window.location.reload())
108	108	.catch(() => {
109		- if (message) {
110		- message.innerText = 'Erreur lors de l’enregistrement.';
111		- }
	137	+ if (message) message.innerText = 'Erreur lors de l’enregistrement.';
112	112	});
113	113	});
114	114	});
115	115
116		- actions.addEventListener('mouseleave', function () {
	142	+ widget.addEventListener('mouseleave', function () {
117	117	paintStars(0);
118	118	});
119	119	})();
120	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}}