import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:rogapp/pages/destination/destination_controller.dart';
import 'package:rogapp/pages/index/index_controller.dart';
import 'package:timeline_tile/timeline_tile.dart';

class DestinationWidget extends StatelessWidget {
  DestinationWidget({ 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);

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

  @override
  Widget build(BuildContext context) {
    return 
        ReorderableListView.builder( 
        
        itemCount: destinationController.destinations.length, 
        onReorder: (int oldIndex, int newIndex){
          int action_id = destinationController.destinations[oldIndex]["id"] as int;
          //print(action_id);
          if(oldIndex > newIndex){
            destinationController.makeOrder(context, action_id, newIndex, "up");
          }
          else if(oldIndex < newIndex){
            destinationController.makeOrder(context, action_id, newIndex, "down");
          }
          
        },
        itemBuilder: (BuildContext context, int index) {
        return TimelineTile(
          alignment: TimelineAlign.manual,
          lineXY: 0.2,
          isFirst: index == 0 ? true : false,
          indicatorStyle: IndicatorStyle(
            color: index == 0 ? (Colors.red) : (Colors.grey[400])!
          ),
          key: Key(index.toString()),
          endChild: Card(
            child: Container(
              constraints: const BoxConstraints(
                minHeight: 80,
                  ),
              child: ListTile(
                onLongPress: (){
                  print("----- selected index ${index}");
                  var el = destinationController.destination_index_data.where((element) => 
                    element["index"] == index
                  );
                  if(el != null){
                    destinationController.destination_index_data.remove(el);
                  }
                  print("------${el}---- index ${index}");
                  Map<String, dynamic> indexed = {'index': index, 'selected':true};
                  destinationController.destination_index_data.add(indexed);
                },
                leading: getImage(index),
                title: Text(destinationController.destinations[index]["location"]["properties"]["location_name"]),
                subtitle: Text(destinationController.destinations[index]["location"]["properties"]["category"]),
              ),
            ),
            
          ),
          startChild: Column(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              Text(destinationController.matrix["rows"][0]["elements"][index]["distance"]["text"].toString()),
              Text(destinationController.matrix["rows"][0]["elements"][index]["duration"]["text"].toString())
            ],
          ),
        );
      }
    );
  }
}