import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:ride/constant/colors.dart';
import 'package:ride/constant/style.dart';
import 'package:ride/controller/home/map_passenger_controller.dart';
import 'package:ride/views/home/map_widget.dart/cancel_raide_page.dart';
import 'package:ride/views/home/map_widget.dart/ride_begin_passenger.dart';
import 'package:ride/views/widgets/elevated_btn.dart';
import 'package:ride/views/widgets/mycircular.dart';

import '../../controller/home/menu_controller.dart';
import 'map_widget.dart/buttom_sheet_map_show.dart';
import 'map_widget.dart/cash_confirm_bottom_page.dart';
import 'map_widget.dart/driver_card_from_passenger.dart';
import 'map_widget.dart/left_main_menu_icons.dart';
import 'map_widget.dart/main_bottom_Menu_map.dart';
import 'map_widget.dart/map_menu_widget.dart';
import 'map_widget.dart/menu_map_page.dart';
import 'map_widget.dart/payment_method.page.dart';
import 'map_widget.dart/timer_for_cancell_trip_from_passenger.dart';
import 'map_widget.dart/timer_to_passenger_from_driver.dart';

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

  @override
  Widget build(BuildContext context) {
    Get.put(MapPassengerController());
    Get.put(MyMenuController());
    return Scaffold(
      body: SafeArea(
        child: Stack(
          children: [
            GetBuilder<MapPassengerController>(
              builder: (controller) => controller.isLoading
                  ? const MyCircularProgressIndicator()
                  : GoogleMap(
                      onMapCreated: controller.onMapCreated,
                      cameraTargetBounds:
                          CameraTargetBounds(controller.boundsdata),
                      minMaxZoomPreference: const MinMaxZoomPreference(6, 18),
                      onLongPress: (argument) {
                        Get.defaultDialog(
                          title: 'Are you want to go to this site'.tr,
                          content: Column(
                            children: [
                              Text(
                                  '${argument.latitude},${argument.longitude}'),
                            ],
                          ),
                          confirm: MyElevatedButton(
                              title: 'Ok'.tr,
                              onPressed: () async {
                                controller.clearPolyline();
                                if (controller.dataCarsLocationByPassenger !=
                                    null) {
                                  await controller.getMap(
                                      '${controller.myLocation.latitude},${controller.myLocation.longitude}',
                                      '${argument.latitude.toString()},${argument.longitude.toString()}');

                                  Get.back();
                                  controller.bottomSheet();
                                  controller.showBottomSheet1();
                                } else {
                                  Get.back();
                                  Get.snackbar(
                                    'We Are Sorry That we dont have cars in your Location!'
                                        .tr,
                                    'message',
                                    colorText: AppColor.redColor,
                                    duration: const Duration(seconds: 11),
                                    instantInit: true,
                                    snackPosition: SnackPosition.TOP,
                                    titleText: Text(
                                      'Error'.tr,
                                      style: const TextStyle(
                                          color: AppColor.redColor),
                                    ),
                                    messageText: Text(
                                      'We Are Sorry That we dont have cars in your Location!'
                                          .tr,
                                      style: AppStyle.title,
                                    ),
                                    icon: const Icon(Icons.error),
                                    shouldIconPulse: true,
                                    maxWidth: double.infinity,
                                    margin: const EdgeInsets.all(16),
                                    padding: const EdgeInsets.all(16),
                                    borderRadius: 8,
                                    borderColor: AppColor.redColor,
                                    borderWidth: 2,
                                    backgroundColor: AppColor.secondaryColor,
                                    leftBarIndicatorColor: AppColor.redColor,
                                    boxShadows: [
                                      BoxShadow(
                                        color: Colors.black.withOpacity(0.25),
                                        blurRadius: 4,
                                        spreadRadius: 2,
                                        offset: const Offset(0, 4),
                                      ),
                                    ],
                                    backgroundGradient: const LinearGradient(
                                      colors: [
                                        AppColor.redColor,
                                        AppColor.accentColor
                                      ],
                                      begin: Alignment.topLeft,
                                      end: Alignment.bottomRight,
                                    ),
                                    // mainButton: TextButton(
                                    //   onPressed: () {
                                    //     controller.getCarsLocationByPassenger();
                                    //   },
                                    //   child: Text(
                                    //     'Try Again'.tr,
                                    //     style: const TextStyle(
                                    //         color: AppColor.secondaryColor),
                                    //   ),
                                    // ),
                                    onTap: (GetSnackBar snackBar) {
                                      // Do something when the snackbar is tapped.
                                    },
                                    isDismissible: true,
                                    showProgressIndicator: false,
                                    dismissDirection: DismissDirection.up,
                                    progressIndicatorController: null,
                                    progressIndicatorBackgroundColor:
                                        Colors.transparent,
                                    progressIndicatorValueColor: null,
                                    snackStyle: SnackStyle.GROUNDED,
                                    forwardAnimationCurve:
                                        Curves.easeInToLinear,
                                    reverseAnimationCurve: Curves.easeInOut,
                                    animationDuration:
                                        const Duration(milliseconds: 4000),
                                    barBlur: 8,
                                    overlayBlur: 0,
                                    snackbarStatus: null,
                                    overlayColor:
                                        AppColor.primaryColor.withOpacity(0.5),
                                    userInputForm: null,
                                  );
                                }

                                //
                              }),
                        );
                      },

                      onTap: (argument) {
                        controller.hidePlaces();

                        // controller.changeBottomSheetShown();
                        // controller.bottomSheet();
                      },
                      initialCameraPosition: CameraPosition(
                        target: controller.myLocation,
                        zoom: 15,
                      ),
                      markers: {
                        for (var carLocation
                            in controller.carsLocationByPassenger)
                          Marker(
                              // anchor: const Offset(4, 4),
                              position: carLocation,
                              icon: controller.carIcon,
                              markerId: MarkerId(carLocation.toString())),
                        for (var carLocation in controller
                            .driverCarsLocationToPassengerAfterApplied)
                          Marker(
                              // anchor: const Offset(4, 4),
                              position: carLocation,
                              icon: controller.carIcon,
                              markerId: MarkerId(carLocation.toString())),
                        Marker(
                          markerId: MarkerId('MyLocation'.tr),
                          position: controller.myLocation,
                          draggable: true,
                          icon: controller.markerIcon,
                          infoWindow: const InfoWindow(
                            title: 'Time',
                            // snippet: controller.durationFromDriverToPassenger
                            //     .toString(),
                          ),
                          onDragEnd: (value) {
                            print(value);
                          },
                          // infoWindow: InfoWindow(title: 'my location'.tr),
                        ),
                        // Marker(
                        //   markerId: MarkerId('Target'.tr),
                        //   position: controller.myDestination,
                        //   draggable: true,
                        //   onDragEnd: (v) {
                        //     print(v);
                        //   },
                        // ),
                      },
                      polylines: {
                        Polyline(
                          zIndex: 2,
                          consumeTapEvents: true,
                          geodesic: true,
                          endCap: Cap.buttCap,
                          startCap: Cap.buttCap,
                          visible: true,
                          polylineId: const PolylineId('route'),
                          points: controller.polylineCoordinates,
                          color: AppColor.primaryColor,
                          width: 5,
                        ),
                        // Polyline(
                        //   zIndex: 2,
                        //   consumeTapEvents: true,
                        //   geodesic: true,
                        //   endCap: Cap.buttCap,
                        //   startCap: Cap.buttCap,
                        //   visible: true,
                        //   polylineId: PolylineId('g'),
                        //   points: [
                        //     LatLng(controller.southwest.latitude,
                        //         controller.southwest.longitude),
                        //     LatLng(controller.northeast.latitude,
                        //         controller.northeast.longitude)
                        //   ],
                        //   color: AppColor.primaryColor,
                        //   width: 5,
                        // ),
                      },
                      // circles: {
                      //   Circle(
                      //       circleId: const CircleId('kk'),
                      //       center: controller.mylocation,
                      //       radius: 60,
                      //       fillColor: AppColor.primaryColor,)
                      // },

                      circles: <Circle>{
                        Circle(
                          circleId: const CircleId('circle_id'),
                          center: controller.myLocation,
                          radius: 100,
                          fillColor: Colors.blue.withOpacity(0.3),
                          strokeColor: Colors.blue,
                          strokeWidth: 2,
                        ),
                      },

                      mapType: controller.mapType
                          ? MapType.satellite
                          : MapType.normal,
                      myLocationButtonEnabled: true,
                      // liteModeEnabled: true, tiltGesturesEnabled: false,

                      // indoorViewEnabled: true,
                      trafficEnabled: controller.mapTrafficON,
                      buildingsEnabled: true,
                      mapToolbarEnabled: true,
                      onCameraMove: (position) {
                        controller.newMyLocation = position.target;
                        // print('my' + controller.mylocation.toString());
                        // print('new' + controller.newMylocation.toString());
                      },
                      myLocationEnabled: true,
                      // liteModeEnabled: true,
                    ),
            ),
            leftMainMenuIcons(),
            const PickerIconOnMap(),
            // PickerAnimtionContainerFormPlaces(),
            const MainBottomMenuMap(),
            const MapMenuWidget(),
            const MenuIconMapPageWidget(),
            buttomSheetMapPage(),
            hexagonClipper(),

            const CancelRidePageShow(),
            const CashConfirmPageShown(),
            const PaymentMethodPage(),
            timerForCancelTripFromPassenger(),
            // const DriverTimeArrivePassengerPage(),
            const TimerToPassengerFromDriver(),
            const RideBeginPassenger(),
            cancelRidePage(),
          ],
        ),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return GetBuilder<MapPassengerController>(
        builder: (controller) =>
            (controller.data.isNotEmpty && controller.remainingTime > 0)
                // ||
                //     controller.timeToPassengerFromDriverAfterApplied == 0
                ? Positioned.directional(
                    end: 10,
                    top: 55,
                    textDirection: TextDirection.ltr,
                    child: GestureDetector(
                      onTap: () {
                        controller.changeCancelRidePageShow();
                      },
                      child: Container(
                        decoration: BoxDecoration(
                            color: AppColor.redColor,
                            borderRadius: BorderRadius.circular(15)),
                        child: const Padding(
                          padding: EdgeInsets.all(3),
                          child: Icon(
                            Icons.clear,
                            size: 30,
                            color: AppColor.secondaryColor,
                          ),
                        ),
                      ),
                    ))
                : const SizedBox());
  }
}

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

  @override
  Widget build(BuildContext context) {
    return GetBuilder<MapPassengerController>(
        builder: (controller) => Positioned(
              bottom: 0,
              top: 0,
              left: 0,
              right: 0,
              child: controller.isPickerShown
                  ? const Icon(
                      Icons.add_location,
                      color: Colors.purple,
                    )
                  : const SizedBox(),
            ));
  }
}
