
import 'package:bus_infotainment/backend/live_information.dart';
import 'package:bus_infotainment/pages/components/ibus_display.dart';
import 'package:bus_infotainment/tfl_datasets.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:text_scroll/text_scroll.dart';

class pages_Routes extends StatefulWidget {

  @override
  State<pages_Routes> createState() => _pages_RoutesState();
}

class _pages_RoutesState extends State<pages_Routes> {
  final TextEditingController _controller = TextEditingController(text: "");

  @override
  Widget build(BuildContext context) {

    LiveInformation liveInformation = LiveInformation();

    List<Widget> routes = [];
    // routes.add(Container(
    //   width: double.infinity,
    //   height: 16,
    //   decoration: BoxDecoration(
    //     color: Colors.grey.shade900,
    //     border: const Border.symmetric(
    //       horizontal: BorderSide(
    //         color: Colors.white70,
    //         width: 2,
    //       ),
    //     )
    //   ),
    // ));
    for (BusRoute route in liveInformation.busSequences!.routes.values) {

      if (!route.routeNumber.toLowerCase().contains(_controller.text.toLowerCase())) {
        continue;
      }

      routes.add(_Route(route, this));
      routes.add(Container(
        width: double.infinity,
        height: 16,
        decoration: BoxDecoration(
          color: Colors.grey.shade900,
          border: const Border.symmetric(
            horizontal: BorderSide(
              color: Colors.white70,
              width: 2,
            ),
          )
        ),
      ));
    }
    if(!routes.isEmpty){
      routes.removeLast();
    }

    return Container(

      decoration: BoxDecoration(
        color: Colors.grey.shade900,
      ),

      width: double.infinity,

      child: Column(

        children: [

          Container(

            margin: const EdgeInsets.all(10),

            child: TextField(
              controller: _controller,
              decoration: InputDecoration(
                hintText: ">",
              ),
              onChanged: (String value) {
                setState(() {});
              },
            ),
          ),

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

          if (routes.isNotEmpty)
            Expanded(
              child: ListView(
                children: routes,
              ),
            )
          else
            Expanded(
              child: Center(
                child: Text(
                  "No routes found",
                  style: GoogleFonts.teko(
                    fontSize: 50,
                    fontWeight: FontWeight.bold,
                    color: Colors.white70,
                    height: 1
                  ),
                ),
              ),
            )

        ],

      )
    );

  }
}

class _Route extends StatelessWidget {

  final BusRoute route;
  final _pages_RoutesState tfL_Dataset_TestState;

  const _Route(this.route, this.tfL_Dataset_TestState);

  @override
  Widget build(BuildContext context) {

    List<Widget> Variants = [];

    for (BusRouteVariant variant in route.routeVariants.values) {
      Variants.add(_Variant(route, variant, tfL_Dataset_TestState));

      if (route.routeVariants.values.last != variant) {
        Variants.add(Container(
          width: double.infinity,
          height: 2,
          color: Colors.white70,
        ));
      }

    }

    return Container(

      alignment: Alignment.center,

      color: Colors.grey.shade900,

      width: 100,

      child: Column(

        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.start,

        children: [



          Container(

            decoration: BoxDecoration(
              color: Colors.transparent,
              border: Border.all(
                color: Colors.white70,
                width: 2,
              ),
            ),

            padding: const EdgeInsets.all(8),
            margin: const EdgeInsets.all(4),

            child: Text(
              "Route: ${route.routeNumber}",
              style: GoogleFonts.teko(
                  fontSize: 25,
                  fontWeight: FontWeight.bold,
                  color: Colors.white70,
                  height: 1
              ),

            ),

          ),

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

          ),

          Container(

            decoration: BoxDecoration(
              color: Colors.transparent,
              border: Border.all(
                color: Colors.white70,
                width: 2,
              ),
            ),

            margin: const EdgeInsets.all(4),

            child: ListView(
              children: Variants,
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
            ),
          ),




        ],

      ),

    );
  }
}

class _Variant extends StatelessWidget {

  final BusRoute route;
  final BusRouteVariant variant;

  final _pages_RoutesState tfL_Dataset_TestState;

  const _Variant(this.route, this.variant, this.tfL_Dataset_TestState);

  @override
  Widget build(BuildContext context) {

    return Container(

        child: Stack(
          children: [

            Container(

                decoration: BoxDecoration(
                  color: Colors.transparent,
                  borderRadius: BorderRadius.circular(5),
                ),

                padding: const EdgeInsets.all(8),

                child: Column(

                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.start,

                  children: [

                    Row(
                      children: [
                        Text(
                          "Start:",
                          style: GoogleFonts.teko(
                            fontSize: 20,
                            fontWeight: FontWeight.bold,
                            color: Colors.white70,
                            height: 1,
                          ),
                        ),

                        SizedBox(width: 5),

                        Expanded(
                          child: TextScroll(
                            variant.busStops.first.formattedStopName,
                            mode: TextScrollMode.bouncing,
                            pauseBetween: const Duration(seconds: 2),
                            pauseOnBounce: const Duration(seconds: 2),
                            style: GoogleFonts.teko(
                              fontSize: 20,
                              fontWeight: FontWeight.normal,
                              color: Colors.white70,
                              height: 1,
                            ),
                          ),
                        ),

                      ],
                    ),

                    SizedBox(height: 5),

                    Row(
                      children: [
                        Text(
                          "End:",
                          style: GoogleFonts.teko(
                            fontSize: 20,
                            fontWeight: FontWeight.bold,
                            color: Colors.white70,
                            height: 1,
                          ),
                        ),

                        SizedBox(width: 5),

                        Expanded(
                          child: TextScroll(
                            "${variant.busStops.last.formattedStopName}",
                            mode: TextScrollMode.bouncing,
                            pauseBetween: const Duration(seconds: 2),
                            pauseOnBounce: const Duration(seconds: 2),
                            style: GoogleFonts.teko(
                              fontSize: 20,
                              fontWeight: FontWeight.normal,
                              color: Colors.white70,
                              height: 1,
                            ),
                          ),
                        ),

                      ],
                    ),



                  ],
                )
            ),

            Positioned.fill(
              child: ElevatedButton(
                  onPressed: () {
                    print("Variant: ${variant.routeVariant}");

                    // Open dialog
                    showDialog(
                        context: context,
                        builder: (BuildContext context) {
                          return AlertDialog(

                            contentPadding: const EdgeInsets.all(0),

                            // no curved corners
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(0),
                            ),

                            content: Container(

                              decoration: BoxDecoration(

                                color: Colors.grey.shade900,

                                border: Border.all(

                                  color: Colors.white70,
                                  width: 2,

                                )

                              ),

                              padding: const EdgeInsets.all(8),

                              child: Column(

                                mainAxisSize: MainAxisSize.min,
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [

                                  Text(
                                    "Select the following route?",
                                    style: GoogleFonts.montserrat(
                                      fontSize: 15,
                                      fontWeight: FontWeight.w700,
                                      color: Colors.white70,
                                      height: 1
                                    ),
                                  ),

                                  SizedBox(height: 4),

                                  Text(
                                    "${route.routeNumber} to ${variant.busStops.last.formattedStopName}",
                                    style: GoogleFonts.montserrat(
                                      fontSize: 15,
                                      fontWeight: FontWeight.w500,
                                      color: Colors.white70,
                                      height: 1
                                    ),
                                  ),

                                  SizedBox(height: 8),

                                  Row(

                                    children: [

                                      Container(

                                        decoration: BoxDecoration(
                                          color: Colors.transparent,
                                          border: Border.all(
                                            color: Colors.white70,
                                            width: 2,
                                          ),
                                        ),

                                        margin: const EdgeInsets.all(0),
                                        padding: const EdgeInsets.all(0),

                                        child: ElevatedButton(
                                          onPressed: () {
                                            Navigator.of(context).pop();
                                          },

                                          style: ElevatedButton.styleFrom(
                                            shape: RoundedRectangleBorder(
                                              borderRadius: BorderRadius.circular(5),
                                            ),
                                          ),

                                          child: const Text("Cancel"),
                                        ),
                                      ),

                                      SizedBox(width: 8),

                                      Container(

                                        decoration: BoxDecoration(
                                          color: Colors.transparent,
                                          border: Border.all(
                                            color: Colors.white70,
                                            width: 2,
                                          ),
                                        ),

                                        child: ElevatedButton(
                                          onPressed: () async {
                                            Navigator.of(context).pop();

                                            LiveInformation liveInformation = LiveInformation();
                                            await liveInformation.setRouteVariant(variant);

                                            liveInformation.announcementModule.queueAnnouncementByRouteVariant(
                                                routeVariant: variant,
                                                scheduledTime: liveInformation.syncedTimeModule.Now(),
                                                sendToServer: false
                                            );

                                            tfL_Dataset_TestState.setState(() {});
                                          },

                                          style: ElevatedButton.styleFrom(
                                            shape: RoundedRectangleBorder(
                                              borderRadius: BorderRadius.circular(5),
                                            ),
                                          ),

                                          child: const Text("Confirm"),
                                        ),
                                      ),

                                    ],

                                  )

                                ],

                              ),



                            ),

                            actionsPadding: EdgeInsets.all(0)
                          );
                        }
                    );

                  },

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

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

                  ),


                  child: Container()
              ),
            )

          ],
        )

    );

  }




}