import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:get/get.dart';
import 'package:latlong2/latlong.dart';

import '../../../../controller/functions/location_controller.dart';
import '../../../../controller/home/captin/home_captain_controller.dart';
// هذه ويدجت بديلة للـ _MapView في الكود الخاص بك
// V3 - MapView Replacement using flutter_map

class OsmMapView extends StatelessWidget {
  const OsmMapView({super.key});

  @override
  Widget build(BuildContext context) {
    // افترض أنك تحصل على الموقع والاتجاه بنفس الطريقة من الكونترولر
    final LocationController locationController =
        Get.find<LocationController>();
    final HomeCaptainController homeCaptainController =
        Get.find<HomeCaptainController>();

    // يمكنك استخدام GetBuilder لمراقبة التغييرات في الموقع
    return Obx(() {
      final LatLng currentLocation = LatLng(
          locationController.myLocation.latitude,
          locationController.myLocation.longitude);
      final double currentHeading = locationController.heading;

      return FlutterMap(
        // يمكنك ربط هذا بـ MapController الخاص بـ flutter_map
        // mapController: homeCaptainController.flutterMapController,
        options: MapOptions(
          initialCenter: currentLocation,
          initialZoom: 15,
          maxZoom: 18,
          minZoom: 6,
          // تدوير الخريطة (اختياري)
          initialRotation: currentHeading,
        ),
        children: [
          // 1. طبقة الخريطة الأساسية (Tiles)
          // هذا هو الرابط لخرائط OSM الأساسية
          TileLayer(
            urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
            subdomains: ['a', 'b', 'c'],
            userAgentPackageName:
                'com.example.app', // استبدل باسم الباكج الخاص بك

            // لاستخدام الخرائط الأوفلاين (بعد إعداد flutter_map_tile_caching)
            // tileProvider: CachedTileProvider(),
          ),

          // 2. طبقة العلامات (Markers)
          MarkerLayer(
            markers: [
              Marker(
                width: 80.0,
                height: 80.0,
                point: currentLocation,
                child: Transform.rotate(
                  angle: currentHeading *
                      (3.1415926535 / 180), // تحويل من درجات إلى راديان
                  child: Image.asset(
                    'assets/images/car_icon.png', // تأكد أن لديك أيقونة السيارة
                    // يمكنك استخدام نفس الـ carIcon من الكونترولر
                    // icon: homeCaptainController.carIcon, (ملاحظة: flutter_map تستخدم ويدجت)
                  ),
                ),
              ),
            ],
          ),

          // يمكنك إضافة طبقات أخرى هنا (مثل الخطوط Polylines أو المضلعات Polygons)
        ],
      );
    });
  }
}

// ملاحظة: ستحتاج إلى تعديل بسيط في HomeCaptainController
// لإنشاء MapController الخاص بـ flutter_map بدلاً من GoogleMapController
// import 'package:flutter_map/flutter_map.dart';
// MapController flutterMapController = MapController();
