import 'package:flutter/material.dart';
import 'package:maplibre_gl/maplibre_gl.dart';

// ─────────────────────────────────────────────────────────
//  Intaleq Vector Map Widget (Professional Setup)
//  Uses MapLibre GL for High Performance Vector Tiles (.pbf)
// ─────────────────────────────────────────────────────────
class IntaleqMapWidget extends StatefulWidget {
  const IntaleqMapWidget({super.key});

  @override
  State<IntaleqMapWidget> createState() => _IntaleqMapWidgetState();
}

class _IntaleqMapWidgetState extends State<IntaleqMapWidget> {
  MaplibreMapController? mapController;

  void _onMapCreated(MaplibreMapController controller) {
    mapController = controller;
  }

  // Example: Downloading an offline region for caching
  Future<void> _downloadOfflineRegion() async {
    final bounds = LatLngBounds(
      southwest: const LatLng(33.4, 36.1), // Southwest corner of Damascus
      northeast: const LatLng(33.6, 36.4), // Northeast corner of Damascus
    );

    // Mapbox/MapLibre has built-in offline caching for vector tiles! 
    // It caches the vectors very efficiently.
    await downloadOfflineRegion(
      OfflineRegionDefinition(
        bounds: bounds,
        mapStyleUrl: 'https://app.intaleqapp.com/style-mobile.json', // Your custom style linking to .pbf
        minZoom: 10.0,
        maxZoom: 16.0,
      ),
      metadata: {
        'name': 'Damascus Region',
      },
    );
    print('✅ Offline region downloaded and cached successfully!');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: MaplibreMap(
        onMapCreated: _onMapCreated,
        initialCameraPosition: const CameraPosition(
          target: LatLng(33.5138, 36.2765), // Damascus / دمشق
          zoom: 13.0,
        ),
        // The style URL points to a JSON file on your server.
        // This JSON defines colors, line widths, and the tile source (Martin .pbf URLs)
        styleString: 'https://app.intaleqapp.com/style-mobile.json', 
        
        // Optimizations for smooth vector rendering
        minMaxZoomPreference: const MinMaxZoomPreference(5, 18),
        myLocationEnabled: true,
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _downloadOfflineRegion,
        tooltip: 'Download Offline Map',
        child: const Icon(Icons.download),
      ),
    );
  }
}