import 'dart:math';

import 'package:bus_infotainment/pages/display.dart';
import 'package:bus_infotainment/pages/home.dart';
import 'package:bus_infotainment/pages/routes.dart';
import 'package:bus_infotainment/pages/settings.dart';
import 'package:bus_infotainment/backend/live_information.dart';
import 'package:bus_infotainment/tfl_datasets.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:text_scroll/text_scroll.dart';
import 'package:window_manager/window_manager.dart';

import 'components/ibus_display.dart';

class TfL_Dataset_Test extends StatefulWidget {

  @override
  State<TfL_Dataset_Test> createState() => TfL_Dataset_TestState();
}

class TfL_Dataset_TestState extends State<TfL_Dataset_Test> {

  int _selectedIndex = 1;

  bool hideUI = false;
  bool shouldCurve = false;
  bool rotated = false;

  late final List<Widget> Pages;

  TfL_Dataset_TestState() {
    Pages = [
      pages_Home(),
      pages_Routes(),
      pages_Display(this),
      pages_Settings(),
    ];
  }

  ibus_display _ibus_display = ibus_display();

  @override
  Widget build(BuildContext context) {

    LiveInformation liveInformation = LiveInformation();

    _selectedIndex = min(_selectedIndex, Pages.length - 1);
    _selectedIndex = max(_selectedIndex, 0);

    hideUI = _selectedIndex == 2 ? hideUI : false;

    // print the window size

    if (defaultTargetPlatform == TargetPlatform.android) {
      shouldCurve = true;
    } else {
      rotated = _selectedIndex == 2;

      print("Window size: ${MediaQuery.of(context).size}");

      windowManager.getSize().then((value) {
        double aspectRatio = value.width / value.height;
        double targetAspectRatio = rotated ? 850.3 / 411.4 : 411.4 / 850.3;

        if ((aspectRatio - targetAspectRatio).abs() > 0.01) { // Add a tolerance value
          if (aspectRatio != targetAspectRatio) {
            windowManager.setSize(Size(value.height * targetAspectRatio, value.height));
          }
        }
      });
    }


    return Scaffold(

      // appBar: !hideUI ? AppBar(
      //
      //   surfaceTintColor: Colors.transparent,
      //
      //   title: Container(
      //
      //     child: Column(
      //
      //       crossAxisAlignment: CrossAxisAlignment.start,
      //
      //       children: [
      //
      //         Text(
      //           "Bus Infotainment",
      //           style: GoogleFonts.teko(
      //             fontSize: 25,
      //             fontWeight: FontWeight.bold,
      //             color: Colors.white,
      //             height: 1,
      //           ),
      //         ),
      //
      //         Row(
      //
      //           children: [
      //
      //             Text(
      //               "Selected: ",
      //               style: GoogleFonts.teko(
      //                 fontSize: 20,
      //                 fontWeight: FontWeight.w600,
      //                 color: Colors.white,
      //                 height: 1,
      //               ),
      //             ),
      //
      //             if (liveInformation.getRouteVariant() != null)
      //               Container(
      //
      //                 decoration: BoxDecoration(
      //                   color: Colors.black,
      //                 ),
      //
      //                 padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 2),
      //
      //                 child: Text(
      //                   "${liveInformation.getRouteVariant()!.busRoute.routeNumber} to ${liveInformation.getRouteVariant()!.busStops.last.formattedStopName}",
      //                   style: GoogleFonts.montserrat(
      //                     fontSize: 20,
      //                     fontWeight: FontWeight.w500,
      //                     color: Colors.orange.shade900,
      //                   ),
      //                 ),
      //
      //               )
      //             else
      //               Text(
      //                 "None",
      //                 style: GoogleFonts.teko(
      //                   fontSize: 20,
      //                   fontWeight: FontWeight.w500,
      //                   color: Colors.white,
      //                 ),
      //               ),
      //           ],
      //
      //         )
      //
      //       ],
      //
      //     ),
      //   ),
      // ) : null,
      body: Container(

        width: double.infinity,
        height: double.infinity,

        child: RotatedBox(
          quarterTurns: rotated ? 3 : 0,
          child: FittedBox(

            alignment: Alignment.topCenter,
            fit: BoxFit.fitWidth,

            child: Container(

              constraints: const BoxConstraints(
                maxWidth: 411.4,
                maxHeight: 850.3,
              ),

              child: Container(

                decoration: BoxDecoration(
                  borderRadius: shouldCurve ? const BorderRadius.only(
                    bottomLeft: Radius.circular(15),
                    bottomRight: Radius.circular(15),
                  ) : null,
                  border: Border.all(
                    color: Colors.white70,
                    width: 2,
                  ),
                  color: Colors.grey.shade900,
                ),

                margin: const EdgeInsets.all(6),


                child: Column(

                  children: [

                    if (!hideUI)
                    Container(

                      margin: const EdgeInsets.all(6),

                      child: _ibus_display,
                    ),

                    if (!hideUI)
                    Container(
                      width: double.infinity,
                      height: 2,
                      color: Colors.white70,
                    ),

                    Expanded(
                      child: Container(

                        margin: const EdgeInsets.all(8),

                        decoration: BoxDecoration(
                          border: Border.all(
                            color: Colors.white70,
                            width: 2,
                          ),
                          color: Colors.grey.shade900,
                          borderRadius: hideUI && shouldCurve ? const BorderRadius.only(
                            bottomLeft: Radius.circular(7),
                            bottomRight: Radius.circular(7),
                          ) : null,
                        ),

                        child: ClipRRect(

                          // curved corners
                          borderRadius: BorderRadius.only(
                            bottomLeft: Radius.circular(7),
                            bottomRight: Radius.circular(7),
                          ),

                          child: Pages[_selectedIndex],
                        )
                      ),
                    ),

                    if (!hideUI)
                    Container(
                      width: double.infinity,
                      height: 2,
                      color: Colors.white70,
                    ),

                    if (!hideUI)
                    Container(
                      height: 50,

                      child: Row(

                        children: [

                          Expanded(
                            child: Stack(
                              children: [
                                Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.all(10),
                                    child: Text(
                                      "Home",
                                      style: GoogleFonts.teko(
                                        color: Colors.white70,
                                        fontSize: 20,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    )
                                ),
                                Positioned.fill(
                                  child: ElevatedButton(
                                      onPressed: () {
                                        setState(() {
                                          _selectedIndex = 0;
                                        });
                                      },

                                      style: ElevatedButton.styleFrom(
                                        backgroundColor: Colors.transparent,
                                        shadowColor: Colors.transparent,
                                        surfaceTintColor: Colors.transparent,
                                        foregroundColor: Colors.transparent,

                                        shape: RoundedRectangleBorder(
                                          borderRadius: BorderRadius.circular(0),
                                        ),

                                      ),

                                      child: Container()
                                  ),
                                )
                              ],
                            ),
                          ),

                          Container(
                            width: 2,
                            height: double.infinity,
                            color: Colors.white70,
                          ),

                          Expanded(
                            child: Stack(
                              children: [
                                Container(
                                  alignment: Alignment.center,
                                  margin: const EdgeInsets.all(10),
                                  child: Text(
                                    "Routes",
                                    style: GoogleFonts.teko(
                                      color: Colors.white70,
                                      fontSize: 20,
                                      fontWeight: FontWeight.bold,
                                    ),
                                  )
                                ),
                                Positioned.fill(
                                  child: ElevatedButton(
                                      onPressed: () {
                                        setState(() {
                                          _selectedIndex = 1;
                                        });
                                      },

                                      style: ElevatedButton.styleFrom(
                                        backgroundColor: Colors.transparent,
                                        shadowColor: Colors.transparent,
                                        surfaceTintColor: Colors.transparent,
                                        foregroundColor: Colors.transparent,

                                        shape: RoundedRectangleBorder(
                                          borderRadius: BorderRadius.circular(0),
                                        ),

                                      ),

                                      child: Container()
                                  ),
                                )
                              ],
                            ),
                          ),

                          Container(
                            width: 2,
                            height: double.infinity,
                            color: Colors.white70,
                          ),

                          Expanded(
                            child: Stack(
                              children: [
                                Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.all(10),
                                    child: Text(
                                      "Display",
                                      style: GoogleFonts.teko(
                                        color: Colors.white70,
                                        fontSize: 20,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    )
                                ),
                                Positioned.fill(
                                  child: ElevatedButton(
                                      onPressed: () {
                                        setState(() {
                                          _selectedIndex = 2;
                                        });
                                      },

                                      style: ElevatedButton.styleFrom(
                                        backgroundColor: Colors.transparent,
                                        shadowColor: Colors.transparent,
                                        surfaceTintColor: Colors.transparent,
                                        foregroundColor: Colors.transparent,

                                        shape: RoundedRectangleBorder(
                                          borderRadius: BorderRadius.circular(0),
                                        ),

                                      ),

                                      child: Container()
                                  ),
                                )
                              ],
                            ),
                          ),

                          Container(
                            width: 2,
                            height: double.infinity,
                            color: Colors.white70,
                          ),

                          Expanded(
                            child: Stack(
                              children: [
                                Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.all(10),
                                    child: Text(
                                      "Settings",
                                      style: GoogleFonts.teko(
                                        color: Colors.white70,
                                        fontSize: 20,
                                        fontWeight: FontWeight.bold,
                                      ),
                                    )
                                ),
                                Positioned.fill(
                                  child: ElevatedButton(
                                      onPressed: () {
                                        setState(() {
                                          _selectedIndex = 3;
                                        });
                                      },

                                      style: ElevatedButton.styleFrom(
                                        backgroundColor: Colors.transparent,
                                        shadowColor: Colors.transparent,
                                        surfaceTintColor: Colors.transparent,
                                        foregroundColor: Colors.transparent,

                                        shape: RoundedRectangleBorder(
                                          borderRadius: BorderRadius.circular(0),
                                        ),

                                      ),

                                      child: Container()
                                  ),
                                )
                              ],
                            ),
                          ),


                        ],

                      ),
                    )

                  ],

                )
              ),
            ),
          ),
        ),
      ),


      // bottomNavigationBar: !hideUI ? NavigationBar(
      //   selectedIndex: _selectedIndex,
      //   destinations: const [
      //     NavigationDestination(
      //       icon: Icon(Icons.home),
      //       label: "Home",
      //     ),
      //     NavigationDestination(
      //       icon: Icon(Icons.bus_alert),
      //       label: "Routes",
      //     ),
      //     NavigationDestination(
      //       icon: Icon(Icons.tv),
      //       label: "Display",
      //     ),
      //     NavigationDestination(
      //       icon: Icon(Icons.settings),
      //       label: "Settings",
      //     ),
      //   ],
      //   onDestinationSelected: (int index) {
      //     setState(() {
      //       _selectedIndex = index;
      //     });
      //   },
      //
      // ) : null,
    );
  }
}