Änderungen von Dokument Sandbox
Zuletzt geändert von Holger Engels am 2024/01/26 15:58
Von Version 13.1
bearbeitet von Holger Engels
am 2023/11/10 10:06
am 2023/11/10 10:06
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Auf Version 19.1
bearbeitet von Holger Engels
am 2023/11/13 21:36
am 2023/11/13 21:36
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Zusammenfassung
-
Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)
Details
- Seiteneigenschaften
-
- Inhalt
-
... ... @@ -119,46 +119,36 @@ 119 119 120 120 == Rating Tests == 121 121 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 - 155 155 {{velocity}} 156 -#set($average = $services.ratings.aufgaben.getAverageRating($doc.space + " 123 +#set($average = $services.ratings.aufgaben.getAverageRating($doc.space + "^" + "test")) 157 157 158 158 {{html clean="false" wiki="true"}} 159 159 <style> 160 160 star-rating { display: inline-block; width: 120px } 161 161 </style> 162 -<star-rating stars=5 rating="$average" bgcolor="white" nocolor="lightgrey" color="gold" onclick="e vent"></star-rating>129 +<star-rating stars=5 rating="$average.get().averageVote" bgcolor="white" nocolor="lightgrey" color="gold" onclick="rated.call(this)"></star-rating> 163 163 {{/html}} 164 164 {{/velocity}} 132 + 133 +{{html clean="false"}} 134 +<script> 135 + function rated() { 136 + console.log(this.getAttribute("rating")) 137 + } 138 + var setVote = function (vote) { 139 + fetch(new XWiki.Document('WebHome', 'Macros.Aufgabenbewertung').getURL('get') + "?outputSyntax=plain", { 140 + method: "POST", 141 + headers: { "Content-Type": "application/json"}, 142 + body: JSON.stringify({ 143 + vote: vote, 144 + doc: XWiki.currentDocument.space, 145 + id: "test", 146 + form_token: document.documentElement.getAttribute("data-xwiki-form-token") 147 + }) 148 + }).then(data => { 149 + console.log(data.json()) 150 + }); 151 + } 152 + setVote(4) 153 +</script> 154 +{{/html}}