diff -r f81fe8250ed9 -r 20adaa127663 misc/hats_js_anim.xhtml --- a/misc/hats_js_anim.xhtml Thu Aug 24 20:12:28 2023 +0200 +++ b/misc/hats_js_anim.xhtml Thu Aug 24 20:15:40 2023 +0200 @@ -69,8 +69,8 @@ </style> <script type="application/ecmascript"> //<![CDATA[ -var IS_LOCAL=false; // set to true to fetch hats locally. Useful for testing. -var masks; +let IS_LOCAL=false; // set to true to fetch graves locally. Useful for testing. +let masks; if (IS_LOCAL) { /* JavaScript version of a sprite sheet - this could be pretty trivially done in pure HTML, but maintenance would be easier with a server-side portion. list of sprites could be gotten from server, but would require XSS whitelisting */ @@ -86,7 +86,7 @@ masks = []; } -var themes = { +let themes = { // Last updated: 1.0.0 "Art":1, "Beach":1, @@ -121,16 +121,16 @@ "Snow":1, "Stage":1, "Underwater":1}; -var girder; -var animationInterval; +let girder; +let animationInterval; -var staticMasks = []; +let staticMasks = []; on_xml_loaded = function(ex) { - var resp = this.responseText; - var r = />([^<]*).png</g; - var x; + let resp = this.responseText; + let r = />([^<]*).png</g; + let x; while(x = r.exec(resp)) { masks.push(x[1]); @@ -140,7 +140,7 @@ on_xml_error = function() { - var p = document.createElement("p"); + let p = document.createElement("p"); p.appendChild(document.createTextNode("ERROR: List of hats could not be fetched from the server!")); document.body.appendChild(p); } @@ -150,7 +150,7 @@ // Load list of hats if (!IS_LOCAL) { // Request list of hats from repository URL - var xml=new XMLHttpRequest(); + let xml=new XMLHttpRequest(); xml.open("GET", "//hg.hedgewars.org/hedgewars/file/tip/share/hedgewars/Data/Graphics/Hats/"); xml.addEventListener("error", on_xml_error); xml.onload = on_xml_loaded; @@ -166,7 +166,7 @@ { // Exclude NoHat as uninteresting. Exclude team hats as we can't properly display them yet // TODO: Add support for team hats - var disallowedMasks = { + let disallowedMasks = { "NoHat":true, "hair_team":true, "cap_team":true, @@ -174,15 +174,15 @@ }; // Render girders - var s = document.styleSheets[0].cssRules; - for(var i=0;i<s.length;i++) + let s = document.styleSheets[0].cssRules; + for(let i=0;i<s.length;i++) { if (s[i].selectorText.toLowerCase() === ".girder") girder = s[i]; } - var a = document.createElement("a"); - var g = document.createElement("div"); + let a = document.createElement("a"); + let g = document.createElement("div"); g.className="girder"; if (IS_LOCAL) { a.className="hatLocal"; @@ -193,18 +193,18 @@ a.lastChild.appendChild(document.createTextNode("")); // Render hats - var missingMasks = []; - var img; - var j = 0; - var toDelete = []; - for (var i=0;i<masks.length;i++) + let missingMasks = []; + let img; + let j = 0; + let toDelete = []; + for (let i=0;i<masks.length;i++) { if (disallowedMasks[masks[i]] === true) { missingMasks.push(masks[i]); toDelete.push(i); continue; } - var h = document.body.appendChild(a.cloneNode(true)); + let h = document.body.appendChild(a.cloneNode(true)); if (IS_LOCAL) h.href = "../share/hedgewars/Data/Graphics/Hats/"+masks[i]+".png"; else @@ -212,7 +212,7 @@ img = new Image(); img.onload = function() { - var name = this.id.substr(7); + let name = this.id.substr(7); if (this.height === 32) { staticMasks[name] = true; } @@ -229,19 +229,19 @@ j++; } // Cleanup masks array - for (var i=0; i<toDelete.length; i++) + for (let i=0; i<toDelete.length; i++) masks.splice(toDelete[i], 1); // List missing hats if (missingMasks.length > 0) { - var pm = document.createElement("p"); + let pm = document.createElement("p"); pm.appendChild(document.createTextNode("Other hats: ")); - for (var i=0; i<missingMasks.length; i++) + for (let i=0; i<missingMasks.length; i++) { if (missingMasks[i] === "NoHat") continue; - var link = document.createElement("a"); + let link = document.createElement("a"); if (IS_LOCAL) link.href = "../share/hedgewars/Data/Graphics/Hats/"+missingMasks[i]+".png"; else @@ -259,20 +259,20 @@ animationInterval = setInterval(animateHogs, 128); // Theme selection drop-down list - var form = document.body.appendChild(document.createElement("form")); + let form = document.body.appendChild(document.createElement("form")); - var opt = document.createElement("option"); + let opt = document.createElement("option"); opt.appendChild(document.createTextNode("")); - var label = document.createElement("label"); + let label = document.createElement("label"); label.htmlFor = "theme_select"; label.appendChild(document.createTextNode("Theme: ")); form.appendChild(label); - var sel = form.appendChild(document.createElement("select")); + let sel = form.appendChild(document.createElement("select")); sel.id = "theme_select"; sel.onchange = switchTheme; - for(var theme in themes) + for(let theme in themes) { sel.appendChild(opt.cloneNode(true)); sel.lastChild.value = theme; @@ -283,7 +283,7 @@ form.appendChild(document.createElement("br")); // Checkbox: Switch animation - var chk = document.createElement("input"); + let chk = document.createElement("input"); chk.id = "anim"; chk.type = "checkbox"; chk.onclick = switchAnim; @@ -315,8 +315,8 @@ function animateHogs() { - var a = document.getElementsByTagName("a"); - for (var i=0;i<a.length;i++) + let a = document.getElementsByTagName("a"); + for (let i=0;i<a.length;i++) { if (a[i].className !== "hat" && a[i].className !== "hatLocal") continue; @@ -325,7 +325,7 @@ // Hedgehog a[i].style.backgroundPosition=Math.floor(a[i].idle/16)*-32+"px "+(a[i].idle%16)*-32+"px"; - var maskName = a[i].title; + let maskName = a[i].title; // Hat if (staticMasks[maskName] === true) { // Hat offset for static hats @@ -365,8 +365,8 @@ // Turn on or off girders function hideGirders() { - var g = document.getElementsByClassName("girder"); - for(var i=0;i<g.length;i++) + let g = document.getElementsByClassName("girder"); + for(let i=0;i<g.length;i++) if (this.checked) g[i].className = "girder"; else @@ -377,12 +377,12 @@ // Select theme according to drop-down list value function switchTheme() { - var prefix; + let prefix; if (!IS_LOCAL) prefix = "//hg.hedgewars.org/hedgewars/raw-file/tip"; else prefix = ".."; - var theme = this.value || "Nature"; + let theme = this.value || "Nature"; document.body.style.backgroundImage='url("'+prefix+'/share/hedgewars/Data/Themes/'+theme+'/Sky.png")'; if (themes[theme]) girder.style.backgroundImage='url("'+prefix+'/share/hedgewars/Data/Themes/'+theme+'/Girder.png")';