Replace 'var' with 'let' in flag/grave/hat XHTML previews
authorWuzzy <Wuzzy@disroot.org>
Thu, 24 Aug 2023 20:15:40 +0200
changeset 15978 20adaa127663
parent 15977 f81fe8250ed9
child 15979 1635ce22b214
child 16008 72c71c385579
Replace 'var' with 'let' in flag/grave/hat XHTML previews
misc/flags_js.xhtml
misc/graves_js_anim.xhtml
misc/hats_js_anim.xhtml
--- a/misc/flags_js.xhtml	Thu Aug 24 20:12:28 2023 +0200
+++ b/misc/flags_js.xhtml	Thu Aug 24 20:15:40 2023 +0200
@@ -56,8 +56,8 @@
     <script type="application/ecmascript">
 //<![CDATA[
 "use strict";
-var IS_LOCAL=false; // set to true to fetch flags locally. Useful for testing.
-var flags;
+let IS_LOCAL=false; // set to true to fetch flags locally. Useful for testing.
+let flags;
 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 */
@@ -98,11 +98,11 @@
 flags = [];
 }
 
-var on_xml_loaded = function(ex)
+let 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))
     {
         flags.push(x[1]);
@@ -110,21 +110,21 @@
     on_flags_loaded();
 }
 
-var on_xml_error = function()
+let on_xml_error = function()
 {
-    var p = document.createElement("p");
+    let p = document.createElement("p");
     p.appendChild(document.createTextNode("ERROR: List of flags could not be fetched from the server!"));
     document.body.appendChild(p);
 }
 
-var on_flags_loaded;
+let on_flags_loaded;
 
 window.onload = function()
 {
     // Load list of flags
     if (!IS_LOCAL) {
         // Request list of flags from repository URL
-        var xml=new XMLHttpRequest();
+        let xml=new XMLHttpRequest();
         xml.open("GET", "//hg.hedgewars.org/hedgewars/file/tip/share/hedgewars/Data/Graphics/Flags/");
         xml.addEventListener("error", on_xml_error);
         xml.onload = on_xml_loaded;
@@ -139,7 +139,7 @@
 on_flags_loaded = function()
 {
     // Sort flags
-    var flag_compare = function(a, b)
+    let flag_compare = function(a, b)
     {
         if (a === "hedgewars")
             return -1;
@@ -160,24 +160,24 @@
     flags.sort(flag_compare);
 
     // Render flags
-    var img;
-    var j = 0;
-    var toDelete = [];
-    var a = document.createElement("a");
+    let img;
+    let j = 0;
+    let toDelete = [];
+    let a = document.createElement("a");
     a.className="flag";
     a.appendChild(document.createElement("div"));
     a.lastChild.appendChild(document.createTextNode(""));
 
-    var flagState = 0; // 0 = hedgewars, 1 = country flag, 2 = community flag ("cm_")
+    let flagState = 0; // 0 = hedgewars, 1 = country flag, 2 = community flag ("cm_")
 
-    for (var i=0;i<flags.length;i++)
+    for (let i=0;i<flags.length;i++)
     {
-        var flag = flags[i];
+        let flag = flags[i];
         // Skip CPU flags
         if (flag === "cpu" || flag === "cpu_plain")
             continue;
 
-        var oldFlagState = flagState;
+        let oldFlagState = flagState;
         if (flagState === 0 && flag !== "hedgewars")
             flagState++;
         else if (flagState === 1 && flag.startsWith("cm_"))
@@ -190,7 +190,7 @@
             document.body.appendChild(document.createElement("br"));
         }
 
-        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/Flags/"+flag+".png";
         else
@@ -198,7 +198,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;
             }
--- a/misc/graves_js_anim.xhtml	Thu Aug 24 20:12:28 2023 +0200
+++ b/misc/graves_js_anim.xhtml	Thu Aug 24 20:15:40 2023 +0200
@@ -61,8 +61,8 @@
     </style>
     <script type="application/ecmascript">
 //<![CDATA[
-var IS_LOCAL=false; // set to true to fetch graves locally. Useful for testing.
-var graves;
+let IS_LOCAL=false; // set to true to fetch flags locally. Useful for testing.
+let graves;
 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 */
@@ -78,7 +78,7 @@
 graves = [];
 }
 
-var themes = {
+let themes = {
 // Last updated: 1.0.0
 "Art":1,
 "Beach":1,
@@ -113,14 +113,14 @@
 "Snow":1,
 "Stage":1,
 "Underwater":1};
-var girder;
-var animationInterval;
+let girder;
+let animationInterval;
 
 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))
     {
         graves.push(x[1]);
@@ -130,7 +130,7 @@
 
 on_xml_error = function()
 {
-    var p = document.createElement("p");
+    let p = document.createElement("p");
     p.appendChild(document.createTextNode("ERROR: List of graves could not be fetched from the server!"));
     document.body.appendChild(p);
 }
@@ -140,7 +140,7 @@
     // Load list of graves
     if (!IS_LOCAL) {
         // Request list of graves from repository URL
-        var xml=new XMLHttpRequest();
+        let xml=new XMLHttpRequest();
         xml.open("GET", "//hg.hedgewars.org/hedgewars/file/tip/share/hedgewars/Data/Graphics/Graves/");
         xml.addEventListener("error", on_xml_error);
         xml.onload = on_xml_loaded;
@@ -155,28 +155,28 @@
 on_graves_loaded = function()
 {
     // 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";
     a.className="grave";
     a.appendChild(document.createElement("div"));
     a.lastChild.appendChild(document.createTextNode(""));
 
     // Render graves
-    var missingGraves = [];
-    var img;
-    var j = 0;
-    var toDelete = [];
-    for (var i=0;i<graves.length;i++)
+    let missingGraves = [];
+    let img;
+    let j = 0;
+    let toDelete = [];
+    for (let i=0;i<graves.length;i++)
     {
-        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/Graves/"+graves[i]+".png";
         else
@@ -194,20 +194,20 @@
     animationInterval = setInterval(animateGraves, 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;
@@ -218,7 +218,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;
@@ -250,14 +250,14 @@
 
 function animateGraves()
 {
-    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 !== "grave")
             continue;
         // Cycle thru animation frames
 
-        var maskName = a[i].title;
+        let maskName = a[i].title;
         // Grave
         a[i].firstChild.style.backgroundPosition=Math.floor(a[i].idle/16)*-32+"px "+(a[i].idle%16)*-32+"px";
 
@@ -282,8 +282,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
@@ -294,12 +294,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")';
--- 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")';