rog_app/lib/pages/destination_map/destination_map_page.dart

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_map/plugin_api.dart';
import 'package:flutter_map_location_marker/flutter_map_location_marker.dart';
import 'package:flutter_map_marker_popup/flutter_map_marker_popup.dart';
import 'package:flutter_polyline_points/flutter_polyline_points.dart';
import 'package:geojson/geojson.dart';
import 'package:geolocator/geolocator.dart';
import 'package:get/get.dart';
import 'package:latlong2/latlong.dart';
import 'package:rogapp/model/destination.dart';
import 'package:rogapp/pages/destination/destination_controller.dart';
//import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:rogapp/pages/index/index_controller.dart';
import 'package:rogapp/services/destination_service.dart';
import 'package:rogapp/widgets/bottom_sheet_new.dart';
import 'package:rogapp/widgets/bottom_sheet_widget.dart';
import 'package:rogapp/widgets/bread_crum_widget.dart';

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


  @override
  State<DestinationMapPage> createState() => _DestinationMapPageState();
}

class _DestinationMapPageState extends State<DestinationMapPage> {
  final IndexController indexController = Get.find<IndexController>();

  final DestinationController destinationController = Get.find<DestinationController>();
  StreamSubscription? subscription;
  final PopupController _popupLayerController = PopupController();

    List<LatLng>? getPoints(){
      //print("##### --- route point ${indexController.routePoints.length}");
      List<LatLng> pts = [];
      for(PointLatLng p in indexController.routePoints){
        LatLng l = LatLng(p.latitude, p.longitude);
        pts.add(l);
      }
      return pts;
    }

    String getDisplaytext(Destination dp){
      String txt = "";
      if(dp.cp! > 0){
        txt = "${dp.cp}";
        if(dp.checkin_point != null && dp.checkin_point! > 0){
          txt = txt + "{${dp.checkin_point}}";
        }
        if(dp.buy_point != null && dp.buy_point! > 0){
          txt = txt + "[${dp.buy_point}]";
        }
      }
      return txt;
    }

    List<Marker>? getMarkers() {
      List<Marker> pts = [];
      int index = -1;
      for (int i = 0; i < destinationController.destinations.length; i++) {
        Destination d = destinationController.destinations[i];
      //for(Destination d in destinationController.destinations){
        //print("-----lat ${lat}, ----- lon ${lan}");
        Marker m = Marker(
          point: LatLng(d.lat!, d.lon!),
          anchorPos: AnchorPos.align(AnchorAlign.center),
          builder:(cts){

            return InkWell(
              onTap: (){
                  print("-- Destination is --- ${d.name} ------");
                  if(d != null){
                    if(indexController.currentDestinationFeature.length > 0) {
                      indexController.currentDestinationFeature.clear();
                    }
                    indexController.currentDestinationFeature.add(d);
                    //indexController.getAction();
            
                    showModalBottomSheet(context: context, isScrollControlled: true, 
                     //builder:((context) => BottomSheetWidget())
                     builder:((context) => BottomSheetNew())
                    );
                  }
              },
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Container(
                      width:20,
                      height:20,
                    decoration:  BoxDecoration(
                      color: Colors.red,
                      shape: BoxShape.circle,
                      border: new Border.all(
                        color: Colors.white,
                        width: d.checkin_radious != null ? d.checkin_radious! : 1,
                      ),
                    ),
                    child: new Center(
                      child: new Text(
                        (i + 1).toString(),
                        style: TextStyle(color: Colors.white),
                      ),
                    ),
                  ),
                  Container( color: Colors.yellow, child: Text(getDisplaytext(d), style: TextStyle(fontSize: 15.0, fontWeight: FontWeight.bold, overflow: TextOverflow.visible),)),
                ],
              ),
            );

          //return Icon(Icons.pin_drop);
          // return IconButton(
          //   onPressed: ()async {
          //         Destination? fs = await destinationController.getDEstinationForLatLong(d.lat!, d.lon!);
          //         print("-- Destination is --- ${fs!.name} ------");
          //         if(fs != null){
          //           if(indexController.currentDestinationFeature.length > 0) {
          //             indexController.currentDestinationFeature.clear();
          //           }
          //           indexController.currentDestinationFeature.add(fs);
          //           //indexController.getAction();
            
          //           showModalBottomSheet(context: context, isScrollControlled: true, 
          //            //builder:((context) => BottomSheetWidget())
          //            builder:((context) => BottomSheetNew())
          //           );
          //         }
          //     },
          //     icon: Container(
          //       width: 60,
          //       height: 60,
          //       decoration: BoxDecoration(
          //         borderRadius: BorderRadius.circular(d.checkin_radious ?? 0),
          //         color: Colors.transparent,
          //         border: BoxBorder()
          //       ),
          //         child: Icon(Icons.pin_drop)
          //         )
          //       );
          
        });
        
        pts.add(m);
      }
      return pts;
    }

  @override
  void initState() {

    DestinationService.getDestinationLine(destinationController.destinations)?.then((value){
      //print("---- loading destination points ------ ${value}");
      indexController.routePoints.clear();
      setState(() {
        indexController.routePoints = value;
      });
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Obx((() => 
      Stack(
        children: [
          indexController.is_rog_mapcontroller_loaded.value == false ? 
            Center(child: CircularProgressIndicator())
          :
          BreadCrumbWidget(mapController:indexController.rogMapController),
          Padding(
            padding: const EdgeInsets.only(top:50.0),
            //child: TravelMap(),
            child: 
              TravelMap(),
          ),
          // Positioned(
          //   bottom: 200,
          //   left: 10,
          //   child: Container(
          //     color: Colors.white,
          //     child: Row(
          //       children: [
          //         Text(destinationController.gps[0]),
          //         Text(destinationController.locationPermission[0])
          //       ],
          //     ),
          //   )
          // ),
        ],
      )
    ));
  }

  FlutterMap TravelMap() {
    return FlutterMap(
    options: MapOptions(
      onMapCreated: (c){
        indexController.rogMapController = c;
        indexController.rogMapController!.onReady.then((_) {
            indexController.is_rog_mapcontroller_loaded.value = true;
            subscription = indexController.rogMapController!.mapEventStream.listen((MapEvent mapEvent) {
            if (mapEvent is MapEventMoveStart) {
                                //print(DateTime.now().toString() + ' [MapEventMoveStart] START');
                                // do something
            }
            if (mapEvent is MapEventMoveEnd) {
              destinationController.isSelected.clear();
              destinationController.isSelected.add(false);
                                //print(DateTime.now().toString() + ' [MapEventMoveStart] END');
              //indexController.loadLocationsBound();
            }
          });
        });
      } ,
      bounds: indexController.currentBound.length > 0 ? indexController.currentBound[0]: LatLngBounds.fromPoints([LatLng(35.03999881162295, 136.40587119778962), LatLng(36.642756778706904, 137.95226720406063)]),
      zoom: 1,
      maxZoom: 42,
      interactiveFlags: InteractiveFlag.pinchZoom | InteractiveFlag.drag,
      //plugins: [LocationMarkerPlugin(),]
    ),
    children: [
      TileLayerWidget(
        options: TileLayerOptions(
          urlTemplate: 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png',
          subdomains: ['a', 'b', 'c'],
        ),
      ),
      //Obx(() =>
      indexController.routePoints.length > 0 ?
        PolylineLayerWidget(
          options: PolylineLayerOptions(
            polylines: [
              Polyline(
                points: getPoints()!,
                  strokeWidth: 6.0,
                    color: Colors.indigo),
            ],
          ),
        )
        :
        Container(),
      //),
      // PopupMarkerLayerWidget(
      //   options: PopupMarkerLayerOptions(
      //     popupController: _popupLayerController,
      //     markers: _markers,
      //     markerRotateAlignment:
      //         PopupMarkerLayerOptions.rotationAlignmentFor(AnchorAlign.top),
      //     popupBuilder: (BuildContext context, Marker marker) =>
            
      //         examplePopup(marker),
      //   ),
      // ),
      LocationMarkerLayerWidget(), 
      MarkerLayerWidget(
        options: MarkerLayerOptions(
          markers: getMarkers()!
        ),
      ),
    ],
    
  );
  }
}