Rename some files

src/index.js

@@ -1,6 +1,6 @@
-import * as panzoom from './modules/panzoom.js';
-import * as game from './modules/game.js';
-import * as recordSheet from './modules/recordSheet.js';
+import * as panzoom from './modules/pan-zoom.js';
+import * as gameboard from './modules/gameboard.js';
+import * as recordSheet from './modules/record_sheet.js';
 
 globalThis.svgns = "http://www.w3.org/2000/svg";
 
@@ -16,7 +16,7 @@ document.querySelector('object').addEventListener('load', function () {
 document
   .querySelector('#content input[type="checkbox"].visible')
   .addEventListener('input', function () {
-    let divs = document.querySelectorAll('#content div');
+    const divs = document.querySelectorAll('#content div');
 
     divs.forEach(d => {
       if (this.checked) {
@@ -30,32 +30,32 @@ document
 window.addEventListener('load', () => {
   const svg = document.querySelector('object').contentDocument.querySelector('svg');
 
-  game.start(svg);
+  gameboard.start(svg);
   panzoom.start(svg);
 
-  game.setDistanceCallback((count = '-') => {
+  gameboard.setDistanceCallback((count = '-') => {
     distanceOutput.querySelector('#hex-count').textContent = count;
     distanceOutput.style.display = count === '-' ? 'none' : 'block';
   });
 
-  game.setProneFlagCallback(checked => proneToggle.checked = checked);
-  game.setSelectCallback(data => recordSheet.select(data));
+  gameboard.setProneFlagCallback(checked => proneToggle.checked = checked);
+  gameboard.setSelectCallback(data => recordSheet.select(data));
 
   document.querySelectorAll('.soldier-record').forEach(el =>
     el.addEventListener('click', () => {
       if (el.classList.contains('selected')) {
         el.classList.remove('selected');
-        game.unSelect();
+        gameboard.unSelect();
         recordSheet.unSelect();
       } else {
-        game.select(el);
+        gameboard.select(el);
       }
     })
   );
 
   document.querySelectorAll('.end-move').forEach(el => el.addEventListener('click', () => {
     recordSheet.endMove();
-    game.endMove();
+    gameboard.endMove();
   }));
 
   document.querySelectorAll('.end-turn').forEach(el =>
@@ -82,23 +82,23 @@ window.addEventListener('load', () => {
         .sort((el1, el2) => el1.dataset.number > el2.dataset.number)
         .forEach(el => el.classList.remove('movement-ended'));
 
-      game.endTurn(allegiance);
-      game.select(records.at(0));
+      gameboard.endTurn(allegiance);
+      gameboard.select(records.at(0));
     })
   );
 
   document.querySelectorAll('.set-firing-arc').forEach(el =>
-    el.addEventListener('click', game.setFiringArc)
+    el.addEventListener('click', gameboard.setFiringArc)
   );
 
-  document.querySelector('.set-grenade').addEventListener('click', game.setGrenade);
+  document.querySelector('.set-grenade').addEventListener('click', gameboard.setGrenade);
 
   document.querySelectorAll('#toggle-firing-arc-vis input').forEach(el =>
-    el.addEventListener('input', game.toggleFiringArcVisibility)
+    el.addEventListener('input', gameboard.toggleFiringArcVisibility)
   );
 
   document.getElementById('toggle-prone-counter').addEventListener('input', function () {
     const selected = recordSheet.getSelected();
-    selected && game.toggleProne();
+    selected && gameboard.toggleProne();
   });
 });

src/modules/game/sight_line.js

@@ -83,6 +83,7 @@ let sightLine, lockTarget,
 
 export function create({ x: x1, y: y1 }, { x: x2, y: y2 }) {
   const line = document.createElementNS(svgns, 'line');
+  sightLine = line;
 
   line.classList.add('sight-line');
   line.classList.add(activeClassName);
@@ -91,8 +92,6 @@ export function create({ x: x1, y: y1 }, { x: x2, y: y2 }) {
   line.setAttributeNS(null, 'x2', x2);
   line.setAttributeNS(null, 'y2', y2);
 
-  sightLine = line;
-
   return line;
 }
 

src/modules/gameboard.js

@@ -1,6 +1,6 @@
-import * as firingArc from './game/firingArc.js';
-import * as sightLine from './game/sightLine.js';
-import * as counterMod from './game/counter.js';
+import * as firingArc from './game/firing_arc.js';
+import * as sightLine from './game/sight_line.js';
+import * as soldier from './game/soldier.js';
 
 function getCellContents(cell) {
   return cell.querySelectorAll('*:not(use[href="#hex"])');
@@ -141,7 +141,7 @@ export function start(el) {
       if (isGrenade(toPlace)) {
         state.hex.after(toPlace);
       } else if (toPlace && !state.occupant) {
-        counterMod.place(svg, toPlace, cell);
+        soldier.place(svg, toPlace, cell);
         placing.push(toPlace);
         const lockedSl = getLockedSightLine(svg);
 
@@ -153,11 +153,11 @@ export function start(el) {
       } else if (toPlace && state.occupant) {
         if (toPlace === state.occupant) {
           if ('previous' in toPlace.dataset) {
-            const trace = counterMod.getTrace(svg, toPlace);
+            const trace = soldier.getTrace(svg, toPlace);
             toPlace.remove();
             toPlace = getCounterAtGridIndex(...toPlace.dataset.previous.split(','));
             toPlace.classList.remove('clone');
-            toPlace.classList.add(counterMod.getSelectedClass());
+            toPlace.classList.add(soldier.getSelectedClass());
             if (!('previous' in toPlace.dataset)) {
               trace.remove();
             } else {
@@ -182,11 +182,11 @@ export function start(el) {
           if (isClone(state.occupant).of(toPlace)) {
             if (!('previous' in state.occupant.dataset)) {
               state.occupant.classList.remove('clone');
-              state.occupant.classList.add(counterMod.getSelectedClass());
+              state.occupant.classList.add(soldier.getSelectedClass());
               toPlace.remove();
               toPlace = state.occupant;
-              counterMod.removeClones(svg, toPlace);
-              counterMod.getTrace(svg, toPlace).remove();
+              soldier.removeClones(svg, toPlace);
+              soldier.getTrace(svg, toPlace).remove();
               const lockedSl = getLockedSightLine(svg);
 
               if (!lockedSl) {
@@ -196,7 +196,7 @@ export function start(el) {
               }
             } else {
               const index = getGridIndex(state.occupant),
-                trace = counterMod.getTrace(svg, toPlace),
+                trace = soldier.getTrace(svg, toPlace),
                 pos = getCellPosition(cell),
                 points = trace.getAttribute('points').split(' ').filter(p => p != `${pos.x},${pos.y}`).join(' ');;
 
@@ -277,20 +277,20 @@ export function start(el) {
   });
 
   // debug
-  const c = counterMod.getCounter(svg, { dataset: { allegiance: 'davion', number: '1' }});
-  counterMod.place(svg, c, getCell(17, 25));
+  const c = soldier.getCounter(svg, { dataset: { allegiance: 'davion', number: '1' }});
+  soldier.place(svg, c, getCell(17, 25));
   select(c);
 }
 
 export function select(selected) {
-  const counter = counterMod.getCounter(svg, selected);
+  const counter = soldier.getCounter(svg, selected);
 
   if (counter) {
     unSelect();
     placing.push(counter);
-    counter.classList.add(counterMod.getSelectedClass());
+    counter.classList.add(soldier.getSelectedClass());
     firingArc.get(svg, counter).forEach(el => el.removeAttribute('clip-path'));
-    selectCallback && selectCallback({ prone: counterMod.hasProne(counter), ...counter.dataset });
+    selectCallback && selectCallback({ prone: soldier.hasProne(counter), ...counter.dataset });
   }
 }
 
@@ -299,7 +299,7 @@ export function unSelect() {
 
   if (selected) {
     placing = [];
-    getSelected().classList.remove(counterMod.getSelectedClass());
+    getSelected().classList.remove(soldier.getSelectedClass());
     clearSightLine();
     firingArc.clipAll(svg);
   }
@@ -309,7 +309,7 @@ export function endMove() {
   const selected = getSelected();
 
   if (selected) {
-    counterMod.endMove(svg, selected);
+    soldier.endMove(svg, selected);
     unSelect();
   }
 }
@@ -323,7 +323,7 @@ export function toggleProne() {
     isOnBoard = selected && selected.parentElement.hasAttribute('data-x');
 
   if (selected && isOnBoard) {
-    counterMod.toggleProne(selected);
+    soldier.toggleProne(selected);
   }
 }