Änderungen von Dokument Sandbox

Zuletzt geändert von Holger Engels am 2024/01/26 15:58

Von Version 37.1
bearbeitet von Holger Engels
am 2023/12/29 20:45
Änderungskommentar: Es gibt keinen Kommentar für diese Version
Auf Version 14.1
bearbeitet von Holger Engels
am 2023/11/11 15:54
Änderungskommentar: Es gibt keinen Kommentar für diese Version

Zusammenfassung

Details

Seiteneigenschaften
Inhalt
... ... @@ -1,5 +3,3 @@
1 -{{qrcode}}[[lala>>Eingangsklasse.BPE_4_6]]{{/qrcode}}
2 -
3 3  Der Sandkasten ist ein Teil dieses Wikis, der frei editierbar ist. Er ist dafür gedacht, das Arbeiten mit dem Wiki zu üben. Sie können herausfinden, wie das Bearbeiten von Seiten funktioniert und wie man neue Seiten erstellt. Klicken Sie einfach auf **Bearbeiten** um zu beginnen!
4 4  
5 5  {{info}}
... ... @@ -121,38 +121,48 @@
121 121  
122 122  == Rating Tests ==
123 123  
122 +{{html clean="false"}}
123 +<script>
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 + }
151 + });
152 +</script>
153 +{{/html}}
154 +
124 124  {{velocity}}
125 -$services.ratings.aufgaben.setRating("xwiki:Sandbox.WebHome.WebHome^test", 0)
126 -$services.ratings.aufgaben.getCurrentUserRatings(0, 100, true)
156 +#set($average = $services.ratings.aufgaben.getAverageRating($doc.space + "^" + "test"))
127 127  
128 128  {{html clean="false" wiki="true"}}
129 129  <style>
130 130  star-rating { display: inline-block; width: 120px }
131 131  </style>
132 -<star-rating stars=5 rating="$average.get().averageVote" rid="test" bgcolor="white" nocolor="lightgrey" color="gold" onclick="rated.call(this)"></star-rating>
162 +<star-rating stars=5 rating="$average" bgcolor="white" nocolor="lightgrey" color="gold" onclick="event"></star-rating>
133 133  {{/html}}
134 134  {{/velocity}}
135 135  
136 -{{html clean="false"}}
137 -<script>
138 - function rated() {
139 - console.log(XWiki.currentDocument.space + ".WebHome")
140 - console.log(this.getAttribute("rating"));
141 - sendRate(this.getAttribute("rid"), parseInt(this.getAttribute("rating")));
142 - }
143 - var sendRate = function (rid, vote) {
144 - fetch(new XWiki.Document('WebHome', 'Macros.Aufgabenbewertung').getURL('get') + "?outputSyntax=plain", {
145 - method: "POST",
146 - headers: { "Content-Type": "application/json"},
147 - body: JSON.stringify({
148 - vote: vote,
149 - doc: XWiki.currentDocument.space + ".WebHome",
150 - id: rid,
151 - form_token: document.documentElement.getAttribute("data-xwiki-form-token")
152 - })
153 - }).then(data => {
154 - console.log(data.json())
155 - });
156 - }
157 -</script>
158 -{{/html}}
166 +