From e7d95924e034ea2c0a530e8e770d64a43ae5698c Mon Sep 17 00:00:00 2001
From: Azgaar <maxganiev@yandex.ru>
Date: Mon, 11 Oct 2021 16:47:32 +0300
Subject: [PATCH] limit military units - skip removed data

---
 index.css                       |  3 +++
 modules/ui/military-overview.js | 11 ++++++-----
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/index.css b/index.css
index 2d8dee7e..c2e10c4a 100644
--- a/index.css
+++ b/index.css
@@ -1310,16 +1310,19 @@ div.slider .ui-slider-handle {
   scrollbar-width: thin;
 }
 
+#alertMessage::-webkit-scrollbar,
 .table::-webkit-scrollbar {
   width: 6px;
   background-color: transparent;
 }
 
+#alertMessage::-webkit-scrollbar-thumb,
 .table::-webkit-scrollbar-thumb {
   background-color: #aaa;
   border-radius: 6px;
 }
 
+#alertMessage::-webkit-scrollbar-thumb:hover,
 .table::-webkit-scrollbar-thumb:hover {
   background: #666;
 }
diff --git a/modules/ui/military-overview.js b/modules/ui/military-overview.js
index 913ae335..3c6d3d85 100644
--- a/modules/ui/military-overview.js
+++ b/modules/ui/military-overview.js
@@ -319,14 +319,15 @@ function overviewMilitary() {
       const value = el.dataset.value;
       const initial = value ? value.split(",").map(v => +v) : [];
 
-      const lines = data.slice(1).map(
+      const filtered = data.filter(datum => datum.i && !datum.removed);
+      const lines = filtered.map(
         ({i, name, fullName, color}) =>
           `<tr data-tip="${name}"><td><span style="color:${color}">⬤</span></td>
-            <td><input id="el${i}" type="checkbox" class="checkbox" ${!initial.length || initial.includes(i) ? "checked" : ""} >
+            <td><input data-i="${i}" id="el${i}" type="checkbox" class="checkbox" ${!initial.length || initial.includes(i) ? "checked" : ""} >
             <label for="el${i}" class="checkbox-label">${fullName || name}</label>
           </td></tr>`
       );
-      alertMessage.innerHTML = `<b>Limit unit by ${type}:</b><div style="margin-top:.3em" class="table"><table><tbody>${lines.join("")}</tbody></table></div>`;
+      alertMessage.innerHTML = `<b>Limit unit by ${type}:</b><table style="margin-top:.3em"><tbody>${lines.join("")}</tbody></table>`;
 
       $("#alert").dialog({
         width: fitContent(),
@@ -337,8 +338,8 @@ function overviewMilitary() {
           },
           Apply: function () {
             const inputs = Array.from(alertMessage.querySelectorAll("input"));
-            const selected = inputs.reduce((acc, input, index) => {
-              if (input.checked) acc.push(index + 1);
+            const selected = inputs.reduce((acc, input) => {
+              if (input.checked) acc.push(input.dataset.i);
               return acc;
             }, []);