1 files changed, 52 insertions, 1 deletions
diff --git a/src/modules/firingArc.js b/src/modules/firingArc.js
index 109e04f..5e5d84a 100644
--- a/src/modules/firingArc.js
+++ b/src/modules/firingArc.js
@@ -165,11 +165,16 @@ function position(e) {
 }
 
 export default class FiringArc {
+  #firingArcVisibility = {
+    davion: false,
+    liao: false
+  };
+
   constructor(svg) {
     this.svg = svg;
   }
 
-  set(size, allegiance, number, { x, y }) {
+  set(size, { dataset: { allegiance, number }}, { x, y }) {
     const svgns = "http://www.w3.org/2000/svg";
 
     let existingArcs = this.svg.querySelectorAll(
@@ -246,4 +251,50 @@ export default class FiringArc {
     firingArc.addEventListener('click', firingArcPlacementListener);
     firingArc.addEventListener('contextmenu', cancelFiringArcPlacement);
   }
+
+  clear(allegiance) {
+    const selector = `#firing-arcs [data-allegiance="${allegiance}"]`;
+    this.svg.querySelectorAll(selector).forEach(el => el.remove());
+  }
+
+  get({ dataset: { allegiance, number }}) {
+    return this.svg.querySelectorAll(`#firing-arcs polygon[data-number="${number}"][data-allegiance="${allegiance}"]`);
+  }
+
+  getUnclipped() {
+    return this.svg.querySelectorAll('#firing-arcs polygon:not([clip-path])');
+  }
+
+  toggleVisibility(allegiance) {
+    const vis = this.#firingArcVisibility[allegiance],
+      clipPaths = this.svg.querySelectorAll(`clipPath[data-allegiance="${allegiance}"]`);
+
+    clipPaths.forEach(cp => cp.style.display = !vis ? 'none' : '');
+    this.#firingArcVisibility[allegiance] = !vis;
+  }
+
+  toggleCounterVisibility({ dataset: { number, allegiance }}, vis) {
+    const cp = this.svg.querySelector(`#clip-path-${allegiance}-${number}`),
+      display = vis ? 'none' : '';
+
+    if (cp) {
+      cp.style.display = this.#firingArcVisibility[allegiance] ? 'none' : display;
+    }
+  }
+
+  clipAll() {
+    let unclipped = this.getUnclipped();
+
+    unclipped.forEach(el => {
+      const { number, allegiance } = el.dataset,
+        clipPathId = `clip-path-${allegiance}-${number}`,
+        isVisible = this.#firingArcVisibility[allegiance];
+
+      if (isVisible) {
+        this.svg.querySelector(`#${clipPathId}`).style.display = 'none';
+      }
+
+      el.setAttributeNS(null, 'clip-path', `url(#${clipPathId})`);
+    });
+  }
 }