2026-04-05-maplibra succsess for all and add navigation paage

lib/controller/home/map_passenger_controller.dart

@@ -137,6 +137,7 @@ class MapPassengerController extends GetxController {
   late LatLng newPointLocation3 = const LatLng(32.115295, 36.064773);
   late LatLng newPointLocation4 = const LatLng(32.115295, 36.064773);
   late LatLng myDestination;
+  LatLngBounds? lastComputedBounds;
   List<LatLng> polylineCoordinates = [];
   List<LatLng> polylineCoordinates0 = [];
   List<LatLng> polylineCoordinates1 = [];
@@ -5872,13 +5873,25 @@ Intaleq Team''';
   void onStyleLoaded() async {
     Log.print('🗺️ MapLibre Style Loaded. Syncing markers and layers...');
     isStyleLoaded = true;
+
+    // Load icons and refresh existing elements if any
     await _loadMapIcons();
     await refreshMapElements();
 
-    // Initial camera set
-    mapController?.animateCamera(
-      CameraUpdate.newLatLng(passengerLocation),
-    );
+    // Smart Camera Reset logic:
+    // Only reset to passengerLocation if we aren't showing an active route
+    if (mapController != null) {
+      if (isMarkersShown && lastComputedBounds != null) {
+        mapController!.animateCamera(
+          CameraUpdate.newLatLngBounds(lastComputedBounds!,
+              left: 100, top: 100, right: 100, bottom: 100),
+        );
+      } else {
+        mapController!.animateCamera(
+          CameraUpdate.newLatLng(passengerLocation),
+        );
+      }
+    }
     update();
   }
 
@@ -5889,6 +5902,9 @@ Intaleq Team''';
     await _addMapImage(motoIcon, 'assets/images/moto.png');
     await _addMapImage(ladyIcon, 'assets/images/lady.png');
     await _addMapImage('picker_icon', 'assets/images/picker.png');
+    // Waypoint markers - use moto1 & lady1 as colored waypoint icons
+    await _addMapImage('orange_marker', 'assets/images/moto1.png');
+    await _addMapImage('violet_marker', 'assets/images/lady1.png');
   }
 
   Future<void> _addMapImage(String id, String path) async {
@@ -6568,6 +6584,8 @@ Intaleq Team''';
       markers.add(SymbolOptions(
         geometry: startLoc,
         iconImage: startIcon,
+        iconSize: 1.0,
+        iconAnchor: 'bottom',
         textField: 'start_point',
         textOpacity: 0,
       ));
@@ -6575,22 +6593,28 @@ Intaleq Team''';
       markers.add(SymbolOptions(
         geometry: endLoc,
         iconImage: endIcon,
+        iconSize: 1.0,
+        iconAnchor: 'bottom',
         textField: 'end_point',
         textOpacity: 0,
-        // snippet and distance text can be handled via symbols or separate UI
       ));
 
-      // 6b. Add waypoint markers
+      // 6b. Add waypoint markers (Stop 1 & Stop 2)
       for (int i = 0; i < activeMenuWaypointCount; i++) {
         final wp = menuWaypoints[i];
         if (wp != null) {
+          final bool isFirstWaypoint = i == 0;
           markers.add(SymbolOptions(
             geometry: wp,
-            iconImage: i == 0
-                ? 'orange_marker'
-                : 'violet_marker', // placeholders or specific icons
-            textField: 'waypoint_$i',
-            textOpacity: 0,
+            iconImage: isFirstWaypoint ? 'orange_marker' : 'violet_marker',
+            iconSize: 1.2,
+            iconAnchor: 'bottom',
+            textField: isFirstWaypoint ? 'Stop 1' : 'Stop 2',
+            textOffset: const Offset(0, 0.5),
+            textColor: isFirstWaypoint ? '#F59E0B' : '#7C3AED',
+            textHaloColor: '#FFFFFF',
+            textHaloWidth: 1.5,
+            textSize: 11,
           ));
         }
       }
@@ -6606,15 +6630,14 @@ Intaleq Team''';
       bottomSheet();
 
       // 8. Compute bounds from all polyline points
-      LatLngBounds? boundsData;
       if (minLat != null) {
-        boundsData = LatLngBounds(
+        lastComputedBounds = LatLngBounds(
             northeast: LatLng(maxLat!, maxLng!),
             southwest: LatLng(minLat!, minLng!));
       }
 
       // تشغيل الأنيميشن الخفيف لومضات المسار + fit camera after
-      _playRouteAnimation(polylineCoordinates, boundsData);
+      _playRouteAnimation(polylineCoordinates, lastComputedBounds);
     } catch (e, stackTrace) {
       // 🚨 هذا السطر سيفضح المشكلة الحقيقية! 🚨
       print('🚨 CRITICAL ERROR IN getDirectionMap: $e');
@@ -6629,7 +6652,7 @@ Intaleq Team''';
     }
   }
 
-  // --- دالة الأنيميشن مع ألوان مختلفة لكل قطعة ---
+  // --- رسم المسار النهائي مع تقسيم ملون حسب نقاط التوقف ---
   Future<void> _playRouteAnimation(
       List<LatLng> coords, LatLngBounds? bounds) async {
     // Segment colors matching UI dots: green → amber → purple → red
@@ -6640,32 +6663,10 @@ Intaleq Team''';
       Color(0xFFEF4444), // Red    (fallback)
     ];
 
-    // Loading animation (4 flashes)
-    Color lightColor = Colors.grey.shade400;
-    Color darkColor = Colors.grey.shade700;
-
-    for (int i = 0; i < 4; i++) {
-      polyLines = polyLines
-          .where((p) => p.lineOpacity != 0.99)
-          .toList(); // Simple filter for non-animated
-
-      polyLines.add(LineOptions(
-        geometry: coords,
-        lineColor: i.isEven ? '#BDBDBD' : '#616161',
-        lineWidth: 5,
-        lineOpacity: 0.99, // tag for removal
-      ));
-
-      refreshMapElements();
-      update();
-      await Future.delayed(const Duration(milliseconds: 250));
-    }
-
-    // After animation: draw coloured segments
-    polyLines = polyLines.where((p) => p.lineOpacity != 0.99).toList();
+    // ── Build final polyline segments ───────────────────────────────────
+    polyLines.clear();
 
     if (activeMenuWaypointCount > 0) {
-      // ... split indices logic remains valid as it is math-based ...
       List<int> splitIndices = [];
       for (int w = 0; w < activeMenuWaypointCount; w++) {
         final wp = menuWaypoints[w];
@@ -6710,13 +6711,17 @@ Intaleq Team''';
       ));
     }
 
-    refreshMapElements();
-    update();
+    // ── Ensure icons are loaded on the CURRENT mapController ────────────
+    // (handles the case where update() triggered a map rebuild)
+    await _loadMapIcons();
+
+    // ── Draw everything at once ────────────────────────────────────────
+    await refreshMapElements();
     update();
 
-    // Fit camera to full route bounds AFTER polylines are drawn
+    // ── Fit camera to full route bounds ────────────────────────────────
     if (bounds != null) {
-      await Future.delayed(const Duration(milliseconds: 500));
+      await Future.delayed(const Duration(milliseconds: 400));
       try {
         mapController?.animateCamera(CameraUpdate.newLatLngBounds(bounds,
             left: 100, top: 100, right: 100, bottom: 100));