import 'dart:io';
import 'dart:math';

import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart';
import 'package:flutter_map_polywidget/flutter_map_polywidget.dart';
import 'package:get/get.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';
import 'package:rive/rive.dart';
import 'package:terepi_seged/pages/navigation/presentation/controllers/navigation_controller.dart';
import 'package:terepi_seged/pages/navigation/presentation/views/settings_dialog.dart';
import 'package:terepi_seged/utils/rive_utils.dart';

class NavigationView extends GetView<NavigationViewController> {
  const NavigationView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    late SMIBool gpsTrigger;

    return Scaffold(
      resizeToAvoidBottomInset: false,
      extendBody: true,
      appBar: AppBar(
        title: const Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text('Navigáció'),
            Text(
              "Mérés: Zalaegerszeg",
              style: TextStyle(fontSize: 12.0),
            )
          ],
        ),
        actions: [
          Padding(
            padding: const EdgeInsets.only(right: 20.0),
            child: Obx(
              () => GestureDetector(
                onTap: () {
                  if (controller.gpsIsConnected.value) {
                    controller.disconnectFromGps();
                  } else {
                    controller.connectToGps();
                  }
                },
                child: Icon(Icons.gps_fixed,
                    size: 26.0,
                    color: controller.gpsIsConnected.value
                        ? Colors.green
                        : Colors.red),
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(right: 20.0),
            child: Obx(
              () => GestureDetector(
                onTap: () {
                  if (controller.ntripIsConnected.value) {
                    controller.disconnectFromNtripServer();
                  } else {
                    controller.connectToNtripServer();
                  }
                },
                child: Icon(
                  Icons.assistant,
                  size: 26.0,
                  color: controller.ntripIsConnected.value
                      ? Colors.green
                      : Colors.red,
                ),
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(right: 20.0),
            child: GestureDetector(
              onTap: () {
                controller.ReadPointsFromFile();
              },
              child:
                  const Icon(Icons.file_open, size: 26.0, color: Colors.blue),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(right: 20.0),
            child: GestureDetector(
              onTap: () {
                controller.ReadPathFromFile();
              },
              child: const Icon(Icons.line_weight_rounded,
                  size: 26.0, color: Colors.blue),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(right: 20.0),
            child: GestureDetector(
              onTap: () => Get.to(() => SettingsDialog(),
                  transition: Transition.downToUp),
              child: const Icon(
                Icons.more_vert,
                size: 26.0,
              ),
            ),
          )
        ],
      ),
      body: Column(
        children: [
          Obx(
            () => controller.gpsIsConnected.value
                ? Padding(
                    padding: const EdgeInsets.all(4.0),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                            width: 170.0,
                            // height: 160.0,
                            decoration: BoxDecoration(
                                border: Border.all(
                                    width: 2.0,
                                    color: const Color.fromARGB(
                                        130, 255, 255, 255)),
                                color:
                                    const Color.fromARGB(130, 255, 255, 255)),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.start,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text(
                                  "${controller.gpsDateTime} (UTC)",
                                  style: const TextStyle(fontSize: 10.0),
                                ),
                                const Divider(
                                  height: 5.0,
                                  color: Colors.black,
                                ),
                                Text(
                                    "EovX: ${controller.formatEov.format(controller.eov.value.Y)}"),
                                Text(
                                    "EovY: ${controller.formatEov.format(controller.eov.value.X)}"),
                                Text("Alt: ${controller.gpsAltitude} (m)"),
                                const Divider(
                                  height: 5.0,
                                  color: Colors.black,
                                ),
                                Text(
                                  "Hor. error: ${max(controller.gpsLatitudeError.value, controller.gpsLongitudeError.value)} (m)",
                                  style: const TextStyle(fontSize: 14.0),
                                ),
                                Text(
                                  "Vert. error: ${controller.gpsAltitudeError} (m)",
                                  style: const TextStyle(fontSize: 14.0),
                                ),
                                const Divider(
                                  height: 5.0,
                                  color: Colors.black,
                                ),
                                Text(
                                  "GPS quality -> ${controller.getGpsQualityIndicator(quality: controller.gpsQuality.value)} ",
                                  style: const TextStyle(fontSize: 8.0),
                                ),
                                controller.ntripIsConnected.value
                                    ? Column(
                                        crossAxisAlignment:
                                            CrossAxisAlignment.start,
                                        children: [
                                          const Divider(
                                            height: 5.0,
                                            color: Colors.black,
                                          ),
                                          Text(
                                            "Ntrip ${controller.ntripReceivedData} byte(s) (${controller.ntripDataPacketNumbers})",
                                            style:
                                                const TextStyle(fontSize: 10.0),
                                          ),
                                          Text(
                                            "GGA last send: ${controller.ggaSendLastTimeStr} (${controller.ggaSenDataPacketNumber})",
                                            style:
                                                const TextStyle(fontSize: 10.0),
                                          ),
                                        ],
                                      )
                                    : const SizedBox(
                                        width: 0.0,
                                        height: 0.0,
                                      )
                              ],
                            )),
                        Padding(
                          padding: const EdgeInsets.only(left: 8.0),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: [
                              DropdownButton(
                                onChanged: (int? newValue) {
                                  controller
                                      .pointsToMeasureSelectedValueChanged(
                                          newValue!);
                                },
                                items:
                                    controller.pointsToMeasureDropDownMenuItem,
                                value: controller
                                    .pointsToMeasureSelectedValue.value,
                              ),
                              const SizedBox(height: 10),
                              FittedBox(
                                child: Text(
                                  'Távolság: ${(controller.distance * 1000).toStringAsFixed(3)} m',
                                  style: const TextStyle(
                                      fontWeight: FontWeight.bold,
                                      fontSize: 12.0),
                                ),
                              )
                            ],
                          ),
                        )
                      ],
                    ),
                  )
                : const SizedBox(),
          ),
          Expanded(
            child: Stack(
              children: [
                Obx(
                  () => controller.mapIsInitialized.value
                      ? FlutterMap(
                          mapController: controller.mapController,
                          options: MapOptions(
                            initialCenter: LatLng(
                                controller.currentLatitude.value,
                                controller.currentLongitude.value),
                            maxZoom: 25,
                            initialZoom: controller.currentZoom.value,
                          ),
                          children: [
                            TileLayer(
                              urlTemplate:
                                  'http://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}',
                              subdomains: const ['mt0', 'mt1', 'mt2', 'mt3'],
                              maxNativeZoom: 18,
                              // urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
                              // userAgentPackageName: 'hu.app_dev.terepi_seged',
                            ),
                            MarkerLayer(
                              markers: controller.pointNotesMarker,
                            ),
                            MarkerLayer(
                                markers: controller.currentLocationMarker),
                            MarkerLayer(markers: controller.parser.markers),
                            PolylineLayer(polylines: controller.pathLayer),
                            MarkerLayer(
                                markers: controller.pointsToMeasureMarker),
                            // PolylineLayer(
                            //     polylines: controller.parser.polylines),
                            PolyWidgetLayer(
                                polyWidgets: controller.pointsToMeasureLabel),
                          ],
                        )
                      : const Center(child: CircularProgressIndicator()),
                ),
                // Obx(
                //   () => controller.gpsIsConnected.value
                //       ? Positioned(
                //           left: 4.0,
                //           top: 4.0,
                //           child: Container(
                //               width: 170.0,
                //               // height: 160.0,
                //               decoration: BoxDecoration(
                //                   border: Border.all(
                //                       width: 2.0,
                //                       color: const Color.fromARGB(
                //                           130, 255, 255, 255)),
                //                   color:
                //                       const Color.fromARGB(130, 255, 255, 255)),
                //               child: Column(
                //                 mainAxisAlignment: MainAxisAlignment.start,
                //                 crossAxisAlignment: CrossAxisAlignment.start,
                //                 children: [
                //                   Text(
                //                     "${controller.gpsDateTime} (UTC)",
                //                     style: const TextStyle(fontSize: 10.0),
                //                   ),
                //                   const Divider(
                //                     height: 5.0,
                //                     color: Colors.black,
                //                   ),
                //                   Text(
                //                       "EovX: ${controller.formatEov.format(controller.eov.value.Y)}"),
                //                   Text(
                //                       "EovY: ${controller.formatEov.format(controller.eov.value.X)}"),
                //                   Text("Alt: ${controller.gpsAltitude} (m)"),
                //                   const Divider(
                //                     height: 5.0,
                //                     color: Colors.black,
                //                   ),
                //                   Text(
                //                     "Hor. error: ${max(controller.gpsLatitudeError.value, controller.gpsLongitudeError.value)} (m)",
                //                     style: const TextStyle(fontSize: 14.0),
                //                   ),
                //                   Text(
                //                     "Vert. error: ${controller.gpsAltitudeError} (m)",
                //                     style: const TextStyle(fontSize: 14.0),
                //                   ),
                //                   const Divider(
                //                     height: 5.0,
                //                     color: Colors.black,
                //                   ),
                //                   Text(
                //                     "GPS quality -> ${controller.getGpsQualityIndicator(quality: controller.gpsQuality.value)} ",
                //                     style: const TextStyle(fontSize: 8.0),
                //                   ),
                //                   controller.ntripIsConnected.value
                //                       ? Column(
                //                           crossAxisAlignment:
                //                               CrossAxisAlignment.start,
                //                           children: [
                //                             const Divider(
                //                               height: 5.0,
                //                               color: Colors.black,
                //                             ),
                //                             Text(
                //                               "Ntrip ${controller.ntripReceivedData} byte(s) (${controller.ntripDataPacketNumbers})",
                //                               style: const TextStyle(
                //                                   fontSize: 10.0),
                //                             ),
                //                             Text(
                //                               "GGA last send: ${controller.ggaSendLastTimeStr} (${controller.ggaSenDataPacketNumber})",
                //                               style: const TextStyle(
                //                                   fontSize: 10.0),
                //                             ),
                //                           ],
                //                         )
                //                       : const SizedBox(
                //                           width: 0.0,
                //                           height: 0.0,
                //                         )
                //                 ],
                //               )),
                //         )
                //       : const Positioned(
                //           child: SizedBox(
                //           width: 0.0,
                //           height: 0.0,
                //         )),
                // )
              ],
            ),
          ),
        ],
      ),
      // bottomNavigationBar: Container(
      //   padding: const EdgeInsets.all(12),
      //   margin: const EdgeInsets.symmetric(horizontal: 24),
      //   decoration: BoxDecoration(
      //       color: Colors.black.withOpacity(0.5),
      //       borderRadius: const BorderRadius.all(Radius.circular(24))),
      //   child: Row(
      //     children: [
      //       GestureDetector(
      //         onTap: () {
      //           gpsTrigger.change(true);
      //           Future.delayed(const Duration(seconds: 1), () {
      //             gpsTrigger.change(false);
      //           });
      //           // controller.onBottomNavigationBarTap(0);
      //           Get.to(() => const MapAddPointDialog(),
      //               fullscreenDialog: true,
      //               transition: Transition.downToUp,
      //               duration: const Duration(milliseconds: 600));
      //         },
      //         child: SizedBox(
      //           height: 36,
      //           width: 36,
      //           child: RiveAnimation.asset(
      //               "assets/RiveAssets/travel_icons_pack.riv",
      //               artboard: "GPS", onInit: (artboard) {
      //             StateMachineController controllerRive =
      //                 RiveUtils.getRiveController(artboard,
      //                     stateMachineName: "gps_interactivity");
      //             gpsTrigger = controllerRive.findSMI("active") as SMIBool;
      //           }),
      //         ),
      //       )
      //     ],
      //   ),
      // ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
      floatingActionButton: Wrap(
        direction: Axis.horizontal,
        children: [
          FloatingActionButton(
            onPressed: () {
              controller.mapZoomOut();
            },
            heroTag: 'ZoomOut',
            tooltip: 'Zoom out',
            child: const Icon(Icons.remove_circle_outline_rounded),
          ),
          const SizedBox(
            width: 15,
          ),
          FloatingActionButton(
            onPressed: () {
              controller.mapZoomIn();
            },
            heroTag: 'ZoomIn',
            tooltip: 'Zoom in',
            child: const Icon(Icons.add_circle_outline_rounded),
          ),
          const SizedBox(width: 15.0),
          FloatingActionButton(
            onPressed: () {
              // controller.isMapMoveToCenter();
              controller.setIsMapMoveToCenter();
            },
            heroTag: 'Center map',
            tooltip: 'Center map',
            child: Obx(
              () => Icon(Icons.center_focus_strong,
                  color: controller.isMapMoveToCenter.value
                      ? Colors.green
                      : Colors.red),
            ),
          ),
          const SizedBox(
            width: 15.0,
          ),
        ],
      ),
    );
  }
}