Änderungen von Dokument Sandbox

Zusammenfassung

• Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)

Details

Seiteneigenschaften

Inhalt

...	...	@@ -119,51 +119,46 @@
119	119
120	120	== Rating Tests ==
121	121
122		-{{velocity}}
123		-$services.ratings.aufgaben.setRating("xwiki:Sandbox.WebHome.WebHome^test", 0)
124		-$services.ratings.aufgaben.getCurrentUserRatings(0, 100, true)
125		-
126		-{{html clean="false" wiki="true"}}
127		-<style>
128		-star-rating { display: inline-block; width: 120px }
129		-</style>
130		-<star-rating stars=5 rating="$average.get().averageVote" rid="test" bgcolor="white" nocolor="lightgrey" color="gold" onclick="rated.call(this)"></star-rating>
131		-{{/html}}
132		-{{/velocity}}
133		-
134	134	{{html clean="false"}}
135	135	<script>
136		- function rated() {
137		- console.log(XWiki.currentDocument.space + ".WebHome")
138		- console.log(this.getAttribute("rating"));
139		- sendRate(this.getAttribute("rid"), parseInt(this.getAttribute("rating")));
140		- }
141		- var sendRate = function (rid, vote) {
142		- fetch(new XWiki.Document('WebHome', 'Macros.Aufgabenbewertung').getURL('get') + "?outputSyntax=plain", {
143		- method: "POST",
144		- headers: { "Content-Type": "application/json"},
145		- body: JSON.stringify({
146		- vote: vote,
147		- doc: XWiki.currentDocument.space + ".WebHome",
148		- id: rid,
149		- form_token: document.documentElement.getAttribute("data-xwiki-form-token")
150		- })
151		- }).then(data => {
152		- console.log(data.json())
	124	+ customElements.define("star-rating", class extends HTMLElement {
	125	+ set rating(rate) {
	126	+ if (!String(rate).includes("%")) rate = Number(rate) / this.stars * 100 + "%";
	127	+ this.querySelector(":nth-child(2)").setAttribute("width", rate); //2nd rect
	128	+ }
	129	+ set value(v) {
	130	+ this.setAttribute("rating", v);
	131	+ }
	132	+ connectedCallback() {
	133	+ let {bgcolor,stars,nocolor,color,rating} = this.attributes;
	134	+ let repeat = (count, func) => Array(count).fill().map(func);
	135	+ this.stars = ~~stars.value || 5;
	136	+ this.innerHTML = `<svg viewBox="0 0 ${this.stars*100} 100" style=cursor:pointer>` +
	137	+ `<rect height=100 fill=${nocolor.value} width=100% />` +
	138	+ `<rect height=100 fill=${color.value} />` +
	139	+ repeat(this.stars , (i, n) => `<path fill=${bgcolor.value} d="m${ n*100 } 0h102v100h-102v-100m91 42a6 6 90 00-4-10l-22-1a1 1 90 01-1 0l-8-21a6 6 90 00-11 0l-8 21a1 1 90 01-1 1l-22 1a6 6 90 00-4 10l18 14a1 1 90 010 1l-6 22a6 6 90 008 6l19-13a1 1 90 011 0l19 13a6 6 90 006 0a6 6 90 002-6l-6-22a1 1 90 010-1z"/>`) +
	140	+ repeat(this.stars * 2, (i, n) => `<rect x=${ n*50 } n=${n} opacity=0 width=50 height=100 ` +
	141	+ ` onclick="this.closest('star-rating').value=${(n+1)/2}; this.closest('star-rating').dispatchEvent(new Event('click'))" ` +
	142	+ ` onmouseover="this.closest('star-rating').rating=${(n+1)/2}"/>`) +
	143	+ "</svg>";
	144	+ this.rating = rating.value;
	145	+ this.addEventListener('mouseleave', (e) => {
	146	+ if (e.target.tagName === 'STAR-RATING') {
	147	+ e.target.rating = e.target.getAttribute("rating")
	148	+ }
	149	+ })
	150	+ }
153	153	});
154		- }
155	155	</script>
156	156	{{/html}}
157	157
158		-== Alle Problemlöseaufgaben ==
	155	+{{velocity}}
	156	+#set($average = $services.ratings.aufgaben.setRating($doc.space + "^" + "test", 1))
159	159
160		-{{html}}
161		-<h1>Header Level H1</h1>
162		-<h2>Header Level H2</h2>
163		-<h3>Header Level H3</h3>
164		-<h4>Header Level H4</h4>
165		-<h5>Header Level H5</h5>
166		-<h6>Header Level H6</h6>
167		-
168		-
	158	+{{html clean="false" wiki="true"}}
	159	+<style>
	160	+star-rating { display: inline-block; width: 120px }
	161	+</style>
	162	+<star-rating stars=5 rating="$average" bgcolor="white" nocolor="lightgrey" color="gold" onclick="event"></star-rating>
169	169	{{/html}}
	164	+{{/velocity}}