1 files changed, 57 insertions, 94 deletions
diff --git a/index.js b/index.js
index f9e4ba8..6332ee5 100644
--- a/index.js
+++ b/index.js
@@ -61,7 +61,6 @@ let getPointCoords = (x, y) => {
 
 const svgns = "http://www.w3.org/2000/svg",
       svg = document.querySelector('svg'),
-      map = document.querySelector('rect#map'),
       hex = document.getElementById('point'),
       ptGrp = document.getElementById('points'),
       cntrGrp = document.getElementById('counters'),
@@ -361,67 +360,6 @@ POINTS.forEach((row, index) => row.forEach(([x, y]) => {
   // ptGrp.appendChild(text);
 }));
 
-(function debug() {
-  function drawLine(x1, y1, x2, y2) {
-    let start = ptGrp.querySelector(`[data-x="${x1}"][data-y="${y1}"]`);
-    let end = ptGrp.querySelector(`[data-x="${x2}"][data-y="${y2}"]`);
-    let [startX, startY] = [start.x.baseVal.value, start.y.baseVal.value];
-    let [endX, endY] = [end.x.baseVal.value, end.y.baseVal.value];
-
-    let startP = new DOMPoint(startX, startY);
-    let endP = new DOMPoint(endX, endY);
-
-    let tStart = startP.matrixTransform(mtx);
-    let tEnd = endP.matrixTransform(mtx);
-
-    let line = document.createElementNS(svgns, 'line');
-    line.setAttributeNS(null, 'x1', tStart.x);
-    line.setAttributeNS(null, 'y1', tStart.y);
-    line.setAttributeNS(null, 'x2', tEnd.x);
-    line.setAttributeNS(null, 'y2', tEnd.y);
-    line.classList.add('debug');
-
-    line.setAttributeNS(null, 'stroke', 'gold');
-    line.setAttributeNS(null, 'stroke-width', 2);
-    svg.appendChild(line);
-
-    return line;
-  }
-
-  let transProp = getComputedStyle(ptGrp).transform.match(/-?\d+\.?\d*/g),
-      mtx = new DOMMatrix(transProp || ''),
-      circR = (new DOMPoint(0, 3 * CIRCUMRADIUS / 2)).matrixTransform(mtx).y * 2 / 3;
-
-  // let l1 = drawLine(1, 1, 1, 2);
-
-  // drawLine(0, 0, 5, 4);
-  // let coords = [0, 0, 14, 9];
-
-  // drawLine(...coords);
-  // linedraw(0, 0, 14, 9).forEach(([x, y]) => {
-  //   document.querySelector(`[data-x="${x}"][data-y="${y}"]`).style.opacity = 1;
-  // });
-
-  // linedraw(0, 4, 14, 13).forEach(([x, y]) => {
-  // linedraw(14, 13, 0, 4).forEach(([x, y]) => {
-  //   document.querySelector(`[data-x="${x}"][data-y="${y}"]`).style.opacity = 1;
-  // });
-
-  // linedraw(14, 9, 0, 0).forEach(([x, y]) => {
-  //   document.querySelector(`[data-x="${x}"][data-y="${y}"]`).style.opacity = 1;
-  // });
-
-  // let pt = l1.getPointAtLength(circR);
-
-  // let c = document.createElementNS(svgns, 'circle');
-  // c.setAttributeNS(null, 'cx', pt.x);
-  // c.setAttributeNS(null, 'cy', pt.y);
-  // c.setAttributeNS(null, 'r', 20);
-  // c.setAttributeNS(null, 'fill', 'red');
-  // c.setAttributeNS(null, 'opacity', '0.2');
-  // svg.appendChild(c);
-})();
-
 function evenr_to_axial(x, y) {
   return {q: x - (y + (y & 1)) / 2, r: y};
 }
@@ -687,14 +625,6 @@ document.querySelectorAll('.set-firing-arc').forEach(el => el.addEventListener('
   }
 }));
 
-document.querySelectorAll('.clear-firing-arcs').forEach(el =>
-  el.addEventListener('click', ({target: {dataset: {allegiance}}}) =>
-    document
-      .querySelectorAll(`.firing-arc[data-troop-allegiance="${allegiance}"]`)
-      .forEach(el => el.remove())
-  )
-);
-
 svg.addEventListener('wheel', e => {
   e.preventDefault();
 
@@ -718,28 +648,6 @@ svg.addEventListener('wheel', e => {
       newY = parseInt(e.deltaY < 0 ? y + yChange : y - yChange),
       newHeight = parseInt(e.deltaY < 0 ? height - yChange - heightChange : height + yChange + heightChange);
 
-  // console.log('VIEWBOX_X', 'VIEWBOX_Y', VIEWBOX_X, VIEWBOX_Y);
-  // console.log('VIEWBOX_WIDTH', 'VIEWBOX_HEIGHT', VIEWBOX_WIDTH, VIEWBOX_HEIGHT);
-
-  // if (newWidth + newX > VIEWBOX_WIDTH + VIEWBOX_X && newX < VIEWBOX_X) {
-  //   newWidth = VIEWBOX_WIDTH;
-  //   newX = VIEWBOX_X;
-  // } else if (newWidth + newX > VIEWBOX_WIDTH + VIEWBOX_X) {
-  //   let diff = newWidth + newX - VIEWBOX_WIDTH - VIEWBOX_X;
-  //   newX = newX - diff;
-  // }
-
-  // if (newHeight + newY > VIEWBOX_HEIGHT + VIEWBOX_Y && newY < VIEWBOX_Y) {
-  //   newHeight = VIEWBOX_HEIGHT;
-  //   newY = VIEWBOX_Y;
-  // } else if (newHeight + newY > VIEWBOX_HEIGHT + VIEWBOX_Y) {
-  //   let diff = newHeight + newY - VIEWBOX_HEIGHT - VIEWBOX_Y;
-  //   newY = newY - diff;
-  // }
-
-  // newX = newX < VIEWBOX_X ? VIEWBOX_X : newX;
-  // newY = newY < VIEWBOX_Y ? VIEWBOX_Y : newY;
-
   let vb = `${newX} ${newY} ${newWidth} ${newHeight}`
 
   localStorage.setItem('viewBox', vb);
@@ -821,11 +729,66 @@ recordSheetVisibility.addEventListener('input', e => {
   localStorage.setItem('recordsVisibility', recordSheetVisibility.checked);
 });
 
-document.querySelector('.end-move').addEventListener('click', e => {
+document.querySelectorAll('.end-move').forEach(el => el.addEventListener('click', e => {
   let selectedSoldier = document.querySelector('.soldier-record.selected');
 
   if (selectedSoldier) {
     selectedSoldier.classList.toggle('selected');
     selectedSoldier.classList.toggle('movement-ended');
   }
-});
-\ No newline at end of file
+}));
+
+let endTurnButtons = document.querySelectorAll('.end-turn');
+let [al1, al2] = Array.from(endTurnButtons).map(el => el.dataset.allegiance);
+
+endTurnButtons.forEach(el =>
+  el.addEventListener('click', ({target: {dataset: {allegiance}}}) => {
+    let al = allegiance == al1 ? al2 : al1;
+
+    qA(`.firing-arc[data-troop-allegiance="${al}"]`).forEach(el => el.remove());
+
+    qA(`.soldier-record[data-troop-allegiance="${al}"]`).forEach(el =>
+      el.classList.remove('movement-ended')
+    );
+
+    let selected = q(`.soldier-record.selected`);
+
+    if (selected) {
+      selected.classList.remove('selected');
+    }
+
+    q(`.soldier-record[data-troop-allegiance="${al}"]`).classList.add('selected');
+  })
+);
+
+(function debug() {
+  function drawLine(x1, y1, x2, y2) {
+    let start = ptGrp.querySelector(`[data-x="${x1}"][data-y="${y1}"]`);
+    let end = ptGrp.querySelector(`[data-x="${x2}"][data-y="${y2}"]`);
+    let [startX, startY] = [start.x.baseVal.value, start.y.baseVal.value];
+    let [endX, endY] = [end.x.baseVal.value, end.y.baseVal.value];
+
+    let startP = new DOMPoint(startX, startY);
+    let endP = new DOMPoint(endX, endY);
+
+    let tStart = startP.matrixTransform(mtx);
+    let tEnd = endP.matrixTransform(mtx);
+
+    let line = document.createElementNS(svgns, 'line');
+    line.setAttributeNS(null, 'x1', tStart.x);
+    line.setAttributeNS(null, 'y1', tStart.y);
+    line.setAttributeNS(null, 'x2', tEnd.x);
+    line.setAttributeNS(null, 'y2', tEnd.y);
+    line.classList.add('debug');
+
+    line.setAttributeNS(null, 'stroke', 'gold');
+    line.setAttributeNS(null, 'stroke-width', 2);
+    svg.appendChild(line);
+
+    return line;
+  }
+
+  let transProp = getComputedStyle(ptGrp).transform.match(/-?\d+\.?\d*/g),
+      mtx = new DOMMatrix(transProp || ''),
+      circR = (new DOMPoint(0, 3 * CIRCUMRADIUS / 2)).matrixTransform(mtx).y * 2 / 3;
+})();
+\ No newline at end of file