import 'dart:async';

import 'package:Tripz/constant/colors.dart';
import 'package:Tripz/constant/style.dart';
import 'package:Tripz/controller/home/map_passenger_controller.dart';
import 'package:Tripz/views/widgets/elevated_btn.dart';
import 'package:Tripz/views/widgets/my_textField.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

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

  @override
  Widget build(BuildContext context) {
    return GetBuilder<MapPassengerController>(
      builder: (mapPassengerController) {
        return mapPassengerController.isSearchingWindow
            ? Positioned(
                bottom: 34,
                left: 0,
                right: 0,
                child: Container(
                  padding: const EdgeInsets.all(16),
                  decoration: BoxDecoration(
                    color: Theme.of(context)
                        .scaffoldBackgroundColor, // Use theme color
                    borderRadius: const BorderRadius.only(
                      topLeft: Radius.circular(20),
                      topRight: Radius.circular(20),
                    ),
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black.withOpacity(0.1),
                        blurRadius: 10,
                        offset: const Offset(0, -5),
                      ),
                    ],
                  ),
                  child: Column(
                    mainAxisSize: MainAxisSize.min, // Fit content
                    children: [
                      Text(
                        mapPassengerController.driversStatusForSearchWindow,
                        style: AppStyle.title.copyWith(
                          fontSize: 18,
                          fontWeight: FontWeight.w600,
                        ),
                        textAlign: TextAlign.center,
                      ),
                      const SizedBox(height: 12),
                      Text(
                        '${'We are searching for the nearest driver to you'.tr}...', // Add ellipsis
                        style: AppStyle.subtitle.copyWith(
                          color: Colors.grey.shade600,
                        ),
                        textAlign: TextAlign.center,
                      ),
                      const SizedBox(height: 16),
                      SizedBox(
                        width: Get.width * 0.8,
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(8),
                          child: LinearProgressIndicator(
                            minHeight: 8,
                            backgroundColor:
                                AppColor.accentColor.withOpacity(0.3),
                            color: AppColor.primaryColor,
                            valueColor: const AlwaysStoppedAnimation<Color>(
                                AppColor.primaryColor),
                          ),
                        ),
                      ),
                      const SizedBox(height: 16),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          const Icon(Icons.timer_outlined,
                              size: 16, color: Colors.grey),
                          const SizedBox(width: 4),
                          buildTimerForIncrease(mapPassengerController),
                        ],
                      ),
                      // const SizedBox(height: 8),
                      // ElevatedButton(
                      //   onPressed: () {
                      //     // Add logic to cancel the search if needed
                      //     // mapPassengerController.cancelSearch();
                      //     Get.back(); // Example: go back to the previous screen
                      //   },
                      //   style: ElevatedButton.styleFrom(
                      //     backgroundColor: Colors.grey.shade300,
                      //     foregroundColor: Colors.black87,
                      //     elevation: 0,
                      //     shape: RoundedRectangleBorder(
                      //       borderRadius: BorderRadius.circular(8),
                      //     ),
                      //   ),
                      //   child: Text('Cancel Search'.tr),
                      // ),
                    ],
                  ),
                ),
              )
            : const SizedBox();
      },
    );
  }
}

// Widget _buildTimer(MapPassengerController mapPassengerController) {
//   return Obx(() {
//     final remainingSeconds = mapPassengerController.searchingDuration.value;
//     final minutes = (remainingSeconds ~/ 60).toString().padLeft(2, '0');
//     final seconds = (remainingSeconds % 60).toString().padLeft(2, '0');
//     return Text(
//       '$minutes:$seconds',
//       style: const TextStyle(
//         fontSize: 16,
//         fontWeight: FontWeight.w500,
//         color: Colors.grey,
//       ),
//     );
//   });
// }

Widget buildTimerForIncrease(MapPassengerController mapPassengerController) {
  // Start timer at 0
  Timer? timer;

  return StreamBuilder<int>(
    // Use StreamBuilder for timer updates
    stream: Stream.periodic(const Duration(seconds: 1))
        .map((_) => ++mapPassengerController.currentTimeSearchingCaptainWindow),
    initialData: 0,
    builder: (context, snapshot) {
      if (snapshot.hasData && snapshot.data! > 30) {
        timer?.cancel(); // Cancel timer after 60 seconds
        return GestureDetector(
          onTap: () {
            Get.defaultDialog(
              barrierDismissible: false,
              title: "Increase Your Trip Fee (Optional)".tr,
              titleStyle: AppStyle.title,
              content: Column(
                children: [
                  Text(
                    "We haven't found any drivers yet. Consider increasing your trip fee to make your offer more attractive to drivers."
                        .tr,
                    style: AppStyle.title,
                    textAlign: TextAlign.center,
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      IconButton(
                        onPressed: () {
                          mapPassengerController.increasFeeFromPassenger.text =
                              (mapPassengerController.totalPassenger + 3)
                                  .toStringAsFixed(1);
                          // mapPassengerController.increasFeeFromPassenger.text =
                          //     mapPassengerController.totalPassenger
                          //         .toStringAsFixed(1);
                          mapPassengerController.update();
                        },
                        icon: Column(
                          children: [
                            Text(
                              '3',
                              style: AppStyle.number,
                            ),
                            Container(
                              decoration: const BoxDecoration(
                                  shape: BoxShape.circle,
                                  color: AppColor.greenColor),
                              child: const Icon(
                                Icons.arrow_circle_up,
                                size: 30,
                                color: AppColor.secondaryColor,
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(
                        width: 100,
                        child: Form(
                          key: mapPassengerController.increaseFeeFormKey,
                          child: MyTextForm(
                              controller: mapPassengerController
                                  .increasFeeFromPassenger,
                              label: mapPassengerController.totalPassenger
                                  .toStringAsFixed(2),
                              hint: mapPassengerController.totalPassenger
                                  .toStringAsFixed(2),
                              type: TextInputType.number),
                        ),
                      ),
                      IconButton(
                        onPressed: () {
                          // if ((double.parse(mapPassengerController
                          //         .increasFeeFromPassenger.text) >
                          //     totalPassenger)) {}
                          mapPassengerController.increasFeeFromPassenger.text =
                              (mapPassengerController.totalPassenger - 3)
                                  .toStringAsFixed(1);
                          // mapPassengerController.increasFeeFromPassenger.text =
                          //     mapPassengerController.totalPassenger
                          //         .toStringAsFixed(1);
                          mapPassengerController.update();
                        },
                        icon: Column(
                          children: [
                            Text(
                              '3',
                              style: AppStyle.number,
                            ),
                            Container(
                              decoration: const BoxDecoration(
                                  shape: BoxShape.circle,
                                  color: AppColor.redColor),
                              child: const Icon(
                                Icons.arrow_drop_down_circle_outlined,
                                size: 30,
                                color: AppColor.secondaryColor,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ],
                  )
                ],
              ),
              actions: [
                MyElevatedButton(
                    title: "No, thanks",
                    onPressed: () {
                      Get.back();
                      mapPassengerController.cancelRide();
                    }),
                MyElevatedButton(
                    title: "Increase Fee".tr,
                    kolor: AppColor.greenColor,
                    onPressed: () {
                      mapPassengerController.increaseFeeByPassengerAndReOrder();
                    })
              ],
            );
          },
          child: Text(
            "No accepted orders? Try raising your trip fee to attract riders."
                .tr,
            style: AppStyle.title.copyWith(color: AppColor.blueColor),
          ),
        );
      }

      // Update progress for circular indicator (0.0 to 1.0)
      final double progress =
          snapshot.data!.toDouble() / 30.0; // Normalize progress

      return Stack(
        children: [
          SizedBox(
            height: 35,
            width: 35,
            child: Center(
              child: CircularProgressIndicator(
                value: progress, // Use calculated progress
                color: AppColor.blueColor,
                backgroundColor: AppColor.yellowColor,
              ),
            ),
          ),
          SizedBox(
            height: 35,
            width: 35,
            child: Center(
              child: Text(
                '${snapshot.data} ', // Display elapsed time
                style: AppStyle.title.copyWith(
                    color: AppColor.greenColor), // Adjust color for timer
              ),
            ),
          )
        ],
      );
    },
  );
}