Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorCatalin Mititiuc <webdevcat@proton.me>2024-08-08 13:46:10 -0700
committerCatalin Mititiuc <webdevcat@proton.me>2024-08-08 14:50:31 -0700
commit9e5e82ca17040d3bed971bbb692eebc787db756f (patch)
tree40aed82f80daa8d1a2fc2bd829a8a6e10a06caa3 /src/index.js
parent0b27586a7f3c45016cab169661d914154a4d81ef (diff)
DEBUG: map-center crosshair
Diffstat (limited to 'src/index.js')
-rw-r--r--src/index.js17
1 files changed, 17 insertions, 0 deletions
diff --git a/src/index.js b/src/index.js
index 88cfced..a8e0c4b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -84,6 +84,23 @@ async function buildScenario(req) {
// recordSheet.start(svg.querySelector('.start-locations'), gameboard.getUnits());
recordSheet.start(null, scenarioUnits);
+ const mapRect = mapResourceEl.getBoundingClientRect();
+
+ console.log('map viewport center', mapRect.width / 2, mapRect.height / 2, mapRect);
+
+ const [horz1, horz2] = document.querySelectorAll('.horz');
+ const [vert1, vert2] = document.querySelectorAll('.vert');
+
+ const hw = mapRect.width / 2 - 0.5;
+ const hh = mapRect.height - 1;
+ horz1.setAttributeNS(null, 'style', `top: ${0}px; left: ${mapRect.left}px; width: ${hw}px; height: ${hh}px;`);
+ horz2.setAttributeNS(null, 'style', `bottom: ${1}px; right: ${window.innerWidth - mapRect.right}px; width: ${hw}px; height: ${hh}px`);
+
+ const vw = mapRect.width;
+ const vh = mapRect.height / 2 - 1;
+ vert1.setAttributeNS(null, 'style', `top: ${0}px; left: ${0}px; width: ${vw}px; height: ${vh}px`);
+ vert2.setAttributeNS(null, 'style', `bottom: ${1}px; right: ${window.innerWidth - mapRect.right}px; width: ${vw}px; height: ${vh}px`);
+
//const [_, trooper] = gameboard.getUnits();
//Observable.notify('select', trooper);
//gameboard.setCounter('prone');