feat: small change to flak mode miss on purpose

frontend/react/src/map/map.ts

@@ -68,6 +68,7 @@ import {
 import { ContextActionSet } from "../unit/contextactionset";
 import { SmokeMarker } from "./markers/smokemarker";
 import { Measure } from "./measure";
+import { FlakMarker } from "./markers/flakmarker";
 
 /* Register the handler for the box selection */
 L.Map.addInitHook("addHandler", "boxSelect", BoxSelect);
@@ -762,6 +763,12 @@ export class Map extends L.Map {
     return explosionMarker;
   }
 
+  addFlakMarker(latlng: L.LatLng) {
+    const explosionMarker = new FlakMarker(latlng, 10);
+    explosionMarker.addTo(this);
+    return explosionMarker;
+  }
+
   addSmokeMarker(latlng: L.LatLng, color: string) {
     const smokeMarker = new SmokeMarker(latlng, color);
     smokeMarker.addTo(this);

frontend/react/src/map/markers/flakmarker.ts

@@ -0,0 +1,39 @@
+import { CustomMarker } from "./custommarker";
+import { DivIcon, LatLng } from "leaflet";
+import { SVGInjector } from "@tanem/svg-injector";
+import { getApp } from "../../olympusapp";
+
+export class FlakMarker extends CustomMarker {
+  #timer: number = 0;
+  #timeout: number = 0;
+
+  constructor(latlng: LatLng, timeout?: number) {
+    super(latlng, { interactive: false });
+
+    if (timeout) {
+      this.#timeout = timeout;
+
+      this.#timer = window.setTimeout(() => {
+        this.removeFrom(getApp().getMap());
+      }, timeout * 1000);
+    }
+  }
+
+  createIcon() {
+    /* Set the icon */
+    this.setIcon(
+      new DivIcon({
+        iconSize: [52, 52],
+        iconAnchor: [26, 26],
+        className: "leaflet-flak-marker",
+      })
+    );
+    var el = document.createElement("div");
+    el.classList.add("ol-flak-icon");
+    var img = document.createElement("img");
+    img.src = "images/markers/flak.svg";
+    img.onload = () => SVGInjector(img);
+    el.appendChild(img);
+    this.getElement()?.appendChild(el);
+  }
+}

frontend/react/src/weapon/weapon.ts

@@ -112,6 +112,9 @@ export abstract class Weapon extends CustomMarker {
   }
   
   setAlive(newAlive: boolean) {
+    if (this.#alive && !newAlive) {
+      getApp().getMap().addFlakMarker(this.getLatLng());
+    }
     this.#alive = newAlive;
   }