From 8bdc2696093db826158076b194284d64c6aa4fc5 Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Mon, 25 Mar 2024 13:26:03 -0700
Subject: Add line of sight
---
index.js | 31 +++++++++++++++++++++++++++++++
1 file changed, 31 insertions(+)
(limited to 'index.js')
diff --git a/index.js b/index.js
index deef03b..aabc692 100644
--- a/index.js
+++ b/index.js
@@ -164,6 +164,37 @@ POINTS.forEach((row, index) => row.forEach(([x, y]) => {
).forEach(el => el.remove());
});
+ counter.addEventListener('mouseenter', e => {
+ let selectedSoldier = document.querySelector('.soldier-record.selected');
+
+ if (selectedSoldier) {
+ let {troopNumber, troopAllegiance} = selectedSoldier.dataset,
+ source = document.querySelector(
+ `circle.counter[data-troop-number="${troopNumber}"][data-troop-allegiance="${troopAllegiance}"]`
+ ),
+ sourceAndTargetAreNotTheSame = [
+ troopNumber != e.target.dataset.troopNumber,
+ troopAllegiance != e.target.dataset.troopAllegiance
+ ].some(el => el);
+
+ if (source && sourceAndTargetAreNotTheSame) {
+ let sightLine = document.createElementNS(svgns, 'line');
+
+ sightLine.classList.add('sight-line');
+ sightLine.setAttributeNS(null, 'x1', source.getAttribute('cx'));
+ sightLine.setAttributeNS(null, 'y1', source.getAttribute('cy'));
+ sightLine.setAttributeNS(null, 'x2', e.target.getAttribute('cx'));
+ sightLine.setAttributeNS(null, 'y2', e.target.getAttribute('cy'));
+
+ svg.appendChild(sightLine);
+ }
+ }
+ });
+
+ counter.addEventListener('mouseleave', e => {
+ document.querySelectorAll('.sight-line').forEach(el => el.remove());
+ });
+
svg.appendChild(counter);
svg.appendChild(text);
}
--
cgit v1.2.3