Popup fixes

client/src/services/adsb.ts

@@ -10,11 +10,10 @@ import { Vector as VectorLayer } from 'ol/layer'
 import { Vector as VectorSource } from 'ol/source'
 import { adjustedInterval } from '@ztimson/utils'
 import AircraftPopup from '@/components/Aircraft.vue'
+import { bringToFront } from './zindex'
 
 const API = BASE + '/api'
 
-let highestZIndex = 1000
-
 function getAltColor(alt: number): [number, number, number] {
 	const a = Math.max(0, alt)
 	if (a < 10)    return [0, 0, 0]
@@ -51,8 +50,6 @@ export class AirTrafficLayer {
 
 	constructor(map: Map) { this.map = map }
 
-	// ── Public ──────────────────────────────────────────────────────────────────
-
 	async show() {
 		if (this.visible) return
 		this.visible = true
@@ -84,8 +81,6 @@ export class AirTrafficLayer {
 		this.traceSegs   = {}
 	}
 
-	// ── Private ──────────────────────────────────────────────────────────────────
-
 	private async _fetch() {
 		const j = await fetch(`${API}/adsb`).then(r => r.json())
 		this.data = (j || []).map((a: any) => ({
@@ -184,10 +179,7 @@ export class AirTrafficLayer {
 			plane:          planeRef.value,
 			position:       mobile ? {x: window.innerWidth / 2 - 180, y: window.innerHeight - 380 - 16} : {x: window.innerWidth - 360 - 16, y: 16},
 			onClose:        () => this._closePopup(icao),
-			onBringToFront: () => {
-				highestZIndex++
-				container.style.zIndex = String(highestZIndex)
-			},
+			onBringToFront: () => bringToFront(container),
 		})
 
 		app.mount(container)
@@ -215,7 +207,6 @@ export class AirTrafficLayer {
 			const plane = this.data.find(p => p.icao === icao)
 			if (!plane) { this._closePopup(icao); continue }
 			this.popups[icao].planeRef.value = plane
-			// Don't reposition — user may have dragged it 🎯
 			this._fetchTrace(plane)
 		}
 	}