import 'package:flutter/material.dart';

import 'wind_arrow_icon.dart';

/// Breite des Marker-Rahmens fuer [WindMarkerPill] bei gegebener
/// Windgeschwindigkeit - geteilt zwischen Plan- und Fly-Modus, die beide
/// eigene Wind-Marker auf der Karte platzieren (MissionMap.windMarkers).
/// Haengt von der Ziffernzahl der gerundeten Geschwindigkeit ab, damit z.B.
/// "12 m/s" genauso wenig abgeschnitten wird wie "5 m/s".
double windMarkerWidth(double speedMs) {
  final digits = speedMs.round().abs().toString().length;
  // +1px Puffer: MarkerLayer rendert ueber eine eigene Transform-/
  // OverflowBox-Kette, die im echten Baum minimal (< 1px) anders rundet als
  // eine isolierte Messung - ohne Puffer fuehrte das zu einem
  // 0.25px-Overflow.
  return 81.0 + digits * 11.0;
}

/// Kleine Wind-Anzeige direkt an einem Wegpunkt auf der Karte (HTML-
/// Demonstrator: divIcon in redrawMapLayers(), sichtbar wenn
/// showPerWaypointWind aktiv ist und fuer den Wegpunkt Wind geladen wurde).
class WindMarkerPill extends StatelessWidget {
  const WindMarkerPill({
    super.key,
    required this.speedMs,
    required this.dirFromDeg,
  });

  final double speedMs;
  final double dirFromDeg;

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 7, vertical: 2),
      decoration: BoxDecoration(
        color: Colors.black.withValues(alpha: 0.82),
        borderRadius: BorderRadius.circular(10),
        border: Border.all(color: Colors.white.withValues(alpha: 0.4)),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          WindArrowIcon(dirFromDeg: dirFromDeg, size: 15),
          const SizedBox(width: 4),
          Text(
            '${speedMs.round()} m/s',
            style: const TextStyle(color: Colors.white, fontSize: 11),
          ),
        ],
      ),
    );
  }
}