fix: external icons - battle screen

Author: Azgaar

index.html

@@ -8151,7 +8151,7 @@
     <script defer src="modules/ui/regiments-overview.js?v=1.107.0"></script>
     <script defer src="modules/ui/markers-overview.js?v=1.107.0"></script>
     <script defer src="modules/ui/regiment-editor.js?v=1.107.0"></script>
-    <script defer src="modules/ui/battle-screen.js?v=1.99.00"></script>
+    <script defer src="modules/ui/battle-screen.js?v=1.107.2"></script>
     <script defer src="modules/ui/emblems-editor.js?v=1.99.00"></script>
     <script defer src="modules/ui/markers-editor.js?v=1.107.0"></script>
     <script defer src="modules/ui/3d.js?v=1.99.00"></script>

modules/ui/battle-screen.js

@@ -131,7 +131,9 @@ class Battle {
 
     for (const u of options.military) {
       const label = capitalize(u.name.replace(/_/g, " "));
-      headers += `<th data-tip="${label}">${u.icon}</th>`;
+      const isExternal = u.icon.startsWith("http");
+      const iconHTML = isExternal ? `<img src="${u.icon}" width="15" height="15">` : u.icon;
+      headers += `<th data-tip="${label}">${iconHTML}</th>`;
     }
 
     headers += "<th data-tip='Total military''>Total</th></tr></thead>";
@@ -145,9 +147,13 @@ class Battle {
     const state = pack.states[regiment.state];
     const distance = (Math.hypot(this.y - regiment.by, this.x - regiment.bx) * distanceScale) | 0; // distance between regiment and its base
     const color = state.color[0] === "#" ? state.color : "#999";
+
+    const isExternal = regiment.icon.startsWith("http");
+    const iconHtml = isExternal
+      ? `<image href="${regiment.icon}" x="0.1em" y="0.1em" width="1.2em" height="1.2em"></image>`
+      : `<text x="50%" y="1em" style="text-anchor: middle">${regiment.icon}</text>`;
     const icon = `<svg width="1.4em" height="1.4em" style="margin-bottom: -.6em; stroke: #333">
-      <rect x="0" y="0" width="100%" height="100%" fill="${color}"></rect>
-      <text x="0" y="1.04em" style="">${regiment.icon}</text></svg>`;
+      <rect x="0" y="0" width="100%" height="100%" fill="${color}"></rect>${iconHtml}</svg>`;
     const body = `<tbody id="battle${state.i}-${regiment.i}">`;
 
     let initial = `<tr class="battleInitial"><td>${icon}</td><td class="regiment" data-tip="${

versioning.js

@@ -13,7 +13,7 @@
  * Example: 1.102.2 -> Major version 1, Minor version 102, Patch version 2
  */
 
-const VERSION = "1.107.1";
+const VERSION = "1.107.2";
 if (parseMapVersion(VERSION) !== VERSION) alert("versioning.js: Invalid format or parsing function");
 
 {