import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:geolocator/geolocator.dart';
import 'package:get/get.dart';
import 'package:latlong2/latlong.dart';
import 'package:rogapp/pages/destination/destination_controller.dart';
import 'package:rogapp/pages/destination_map/destination_map_page.dart';
import 'package:rogapp/pages/drawer/drawer_page.dart';
import 'package:rogapp/pages/index/index_controller.dart';
import 'package:rogapp/routes/app_pages.dart';
import 'package:rogapp/widgets/destination_widget.dart';
import 'package:timeline_tile/timeline_tile.dart';

class DestnationPage extends StatelessWidget {
  DestnationPage({Key? key}) : super(key: key);

  final DestinationController destinationController = Get.find<DestinationController>();

  final IndexController indexController = Get.find<IndexController>();

  final List<int> _items = List<int>.generate(50, (int index) => index);

  Future<void> showCurrentPosition() async {
    LocationPermission permission = await Geolocator.checkPermission();
    if (permission != LocationPermission.whileInUse ||
        permission != LocationPermission.always) {
      permission = await Geolocator.requestPermission();
    }
    Position position = await Geolocator.getCurrentPosition(
        desiredAccuracy: LocationAccuracy.high);
    indexController.rogMapController?.move(LatLng(position.latitude, position.longitude), 14);
  }

  Image getImage(int index){
    if(destinationController.destinations[index].photos == null || destinationController.destinations[index].photos == ""){
      return Image(image: AssetImage('assets/images/empty_image.png'));
    }
    else{
      return Image(image: NetworkImage(destinationController.destinations[index].photos!));
    }
  }

  Widget getRoutingImage(int route){
    switch (route) {
      case 0:
        return Image(image: AssetImage('assets/images/p4_9_man.png'), width: 35.0,);
      case 1:
        return Image(image: AssetImage('assets/images/p4_8_car.png'), width: 35.0,);
      case 2:
        return Image(image: AssetImage('assets/images/p4_10_train.png'), width: 35.0,);
      default:
        return Image(image: AssetImage('assets/images/p4_9_man.png'), width: 35.0,);
    }
  }

@override
  Widget build(BuildContext context) {
    final ColorScheme colorScheme = Theme.of(context).colorScheme;
    final Color oddItemColor = colorScheme.primary.withOpacity(0.05);
    final Color evenItemColor = colorScheme.primary.withOpacity(0.15);
    return WillPopScope(
      onWillPop: () async {
        indexController.switchPage(AppPages.INITIAL);
        return false;
      },
      child: Scaffold(
        drawer: DrawerPage(),
        bottomNavigationBar: BottomAppBar(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Padding(
                padding: const EdgeInsets.only(left:13.0),
                child: InkWell(
                  child: Obx((() => getRoutingImage(destinationController.travelMode.value))),
                  onTap: (){
                    Get.bottomSheet(
                        Obx(() => 
                          ListView(
                            children: [
                              Padding(
                                padding: const EdgeInsets.only(top:30.0, bottom: 30),
                                child: Center(child: Text("select_travel_mode".tr, style: TextStyle(fontSize: 22.0, color:Colors.red, fontWeight:FontWeight.bold),),),
                              ),
                              ListTile(
                                selected: destinationController.travelMode == 0 ? true : false,
                                selectedTileColor: Colors.amber.shade200,
                                leading: Image(image: AssetImage('assets/images/p4_9_man.png'),),
                                title: Text("walking".tr),
                                onTap:(){
                                  destinationController.travelMode.value = 0;
                                  destinationController.PopulateDestinations();
                                  Get.back();
                                },
                                ),
                              ListTile(
                                selected: destinationController.travelMode == 1 ? true : false,
                                selectedTileColor: Colors.amber.shade200,
                                leading: Image(image: AssetImage('assets/images/p4_8_car.png'),),
                                title: Text("driving".tr),
                                onTap:(){
                                  destinationController.travelMode.value = 1;
                                  destinationController.PopulateDestinations();
                                  Get.back();
                                },
                                ),
                              ListTile(
                                selected: destinationController.travelMode == 2 ? true : false,
                                selectedTileColor: Colors.amber.shade200,
                                leading: Image(image: AssetImage('assets/images/p4_10_train.png'),),
                                title: Text("transit".tr),
                                onTap:(){
                                  destinationController.travelMode.value = 2;
                                  destinationController.PopulateDestinations();
                                  Get.back();
                                },
                                ),
                            ],
                            
                          ),
                        ),
                        isScrollControlled:false,
                        backgroundColor: Colors.white,
                      ); 
                      //destinationController.PopulateDestinations();
                    }
                  ),
              )
              ,
                IconButton(
                  icon: const Icon(Icons.travel_explore, size: 35,), 
                    onPressed: (){
                      indexController.switchPage(AppPages.INITIAL);
                    }
                ),
            ],
          ),
        ),
        floatingActionButton: FloatingActionButton(
            onPressed: (){
              //print("######");
              indexController.toggleDestinationMode();
            },
            tooltip: 'Increment',
            child: Obx(() => 
              indexController.desination_mode == 1 ?
              Image(image: AssetImage('assets/images/list2.png'))
              :
              Image(image: AssetImage('assets/images/map.png'))
            ),
            elevation: 4.0,
          ),
          floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
        appBar:AppBar(
          automaticallyImplyLeading: true,
          title: Text("app_title".tr),
          actions: [
            Obx(() => 
             ToggleButtons(
                  disabledColor: Colors.grey.shade200,
                  selectedColor: Colors.red,
                children: <Widget>[
                  Icon(Icons.explore, size: 35.0,
                )],
                onPressed: (int index) {
                  destinationController.isSelected.value = !destinationController.isSelected.value;
                },
                isSelected: [destinationController.isSelected.value],
              ),
            ),
            // IconButton(onPressed: (){
            //   showCurrentPosition();
            // },
            // icon: Icon(Icons.location_on_outlined))
          ],
        ),
        body: Obx(() => 
          indexController.desination_mode.value == 0 ?
                  DestinationWidget():
                  DestinationMapPage()
        )
      ),
    );
    
  }
}


// class DestinationPage extends StatefulWidget {
//   DestinationPage({ Key? key }) : super(key: key);

//   @override
//   State<DestinationPage> createState() => _DestinationPageState();
// }

// class DestinationPage extends State<DestinationPage> {
//   final DestinationController destinationController = Get.find<DestinationController>();

//   final IndexController indexController = Get.find<IndexController>();

//   final List<int> _items = List<int>.generate(50, (int index) => index);

//   DestinationWidget dest = DestinationWidget();
//   DestinationMapPage destMap = DestinationMapPage();

//   Future<void> showCurrentPosition() async {
//     LocationPermission permission = await Geolocator.checkPermission();
//     if (permission != LocationPermission.whileInUse ||
//         permission != LocationPermission.always) {
//       permission = await Geolocator.requestPermission();
//     }
//     Position position = await Geolocator.getCurrentPosition(
//         desiredAccuracy: LocationAccuracy.high);
//     indexController.rogMapController?.move(LatLng(position.latitude, position.longitude), 14);
//   }

//   Image getImage(int index){
//     if(destinationController.destinations[index].photos == null || destinationController.destinations[index].photos == ""){
//       return Image(image: AssetImage('assets/images/empty_image.png'));
//     }
//     else{
//       return Image(image: NetworkImage(destinationController.destinations[index].photos!));
//     }
//   }

//   Widget getRoutingImage(int route){
//     switch (route) {
//       case 0:
//         return Image(image: AssetImage('assets/images/p4_9_man.png'), width: 27.0,);
//       case 1:
//         return Image(image: AssetImage('assets/images/p4_8_car.png'), width: 27.0,);
//       case 2:
//         return Image(image: AssetImage('assets/images/p4_10_train.png'), width: 27.0,);
//       default:
//         return Image(image: AssetImage('assets/images/p4_9_man.png'), width: 27.0,);
//     }
//   }

//   @override
//   void initState() {
//     //destinationController.context = context;
//     //destinationController.PopulateDestinations();
//     super.initState();
//   }

//   @override
//   Widget build(BuildContext context) {
//     final ColorScheme colorScheme = Theme.of(context).colorScheme;
//     final Color oddItemColor = colorScheme.primary.withOpacity(0.05);
//     final Color evenItemColor = colorScheme.primary.withOpacity(0.15);
//     return WillPopScope(
//       onWillPop: () async {
//         indexController.switchPage(AppPages.INITIAL);
//         return false;
//       },
//       child: Scaffold(
//         drawer: DrawerPage(),
//         bottomNavigationBar: BottomAppBar(
//           child: Row(
//             mainAxisAlignment: MainAxisAlignment.spaceBetween,
//             children: <Widget>[
//               Padding(
//                 padding: const EdgeInsets.only(left:13.0),
//                 child: InkWell(
//                   child: Obx((() => getRoutingImage(destinationController.travelMode.value))),
//                   onTap: (){
//                     Get.bottomSheet(
//                         Obx(() => 
//                           ListView(
//                             children: [
//                               Padding(
//                                 padding: const EdgeInsets.only(top:30.0, bottom: 30),
//                                 child: Center(child: Text("select_travel_mode".tr, style: TextStyle(fontSize: 22.0, color:Colors.red, fontWeight:FontWeight.bold),),),
//                               ),
//                               ListTile(
//                                 selected: destinationController.travelMode == 0 ? true : false,
//                                 selectedTileColor: Colors.amber.shade200,
//                                 leading: Image(image: AssetImage('assets/images/p4_9_man.png'),),
//                                 title: Text("walking".tr),
//                                 onTap:(){
//                                   destinationController.travelMode.value = 0;
//                                   Get.back();
//                                 },
//                                 ),
//                               ListTile(
//                                 selected: destinationController.travelMode == 1 ? true : false,
//                                 selectedTileColor: Colors.amber.shade200,
//                                 leading: Image(image: AssetImage('assets/images/p4_8_car.png'),),
//                                 title: Text("driving".tr),
//                                 onTap:(){
//                                   destinationController.travelMode.value = 1;
//                                   Get.back();
//                                 },
//                                 ),
//                               ListTile(
//                                 selected: destinationController.travelMode == 2 ? true : false,
//                                 selectedTileColor: Colors.amber.shade200,
//                                 leading: Image(image: AssetImage('assets/images/p4_10_train.png'),),
//                                 title: Text("transit".tr),
//                                 onTap:(){
//                                   destinationController.travelMode.value = 2;
//                                   Get.back();
//                                 },
//                                 ),
//                             ],
                            
//                           ),
//                         ),
//                         isScrollControlled:false,
//                         backgroundColor: Colors.white,
//                       );
//                       destinationController.PopulateDestinations();
//                       destMap.
//                     }
//                   ),
//               )
//               ,
//                 IconButton(
//                   icon: const Icon(Icons.travel_explore), 
//                     onPressed: (){
//                       indexController.switchPage(AppPages.INITIAL);
//                     }
//                 ),
//             ],
//           ),
//         ),
//         floatingActionButton: FloatingActionButton(
//             onPressed: (){
//               //print("######");
//               indexController.toggleDestinationMode();
//             },
//             tooltip: 'Increment',
//             child: Obx(() => 
//               indexController.desination_mode == 1 ?
//               Image(image: AssetImage('assets/images/list2.png'))
//               :
//               Image(image: AssetImage('assets/images/map.png'))
//             ),
//             elevation: 4.0,
//           ),
//           floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
//         appBar:AppBar(
//           automaticallyImplyLeading: true,
//           title: Text("app_title".tr),
//           actions: [
//             //Obx(() => 
//              ToggleButtons(
//                   disabledColor: Colors.grey.shade200,
//                   selectedColor: Colors.red,
//                 children: <Widget>[
//                   Icon(Icons.explore
//                 )],
//                 onPressed: (int index) {
//                   setState(() {
//                     destinationController.isSelected[index] = !destinationController.isSelected[index];
//                   });
//                 },
//                 isSelected: destinationController.isSelected,
//               ),
//             //),
//             // IconButton(onPressed: (){
//             //   showCurrentPosition();
//             // },
//             // icon: Icon(Icons.location_on_outlined))
//           ],
//         ),
//         body: Obx(() => 
//           indexController.desination_mode.value == 0 ?
//                   dest:
//                   destMap
//         )
//       ),
//     );
    
//   }
// }