import 'package:trackoffical_app/screen.dart';
import 'widget_point.dart';
import '../../../model/game_person_data.dart';
import '../layer/layer_controller.dart';
import '../layer/layer_trace.dart';
import 'guardian_controller.dart';


class LayerUnderGuardian extends GetView<LayerController> {
  LayerUnderGuardian(this.pointColorList, {super.key});

  final pointWidth = 43.0.wp;
  final pointHeight = 29.0.wp;
  final List<Color> pointColorList;

  @override
  Widget build(BuildContext context) {
    final c = controller;
    if(c is! GuardianControllerMock){
      return const SizedBox();
    }

    return Obx((){
      final children = <Widget>[
        SizedBox(width: context.width, height: context.height)
      ];

      var i = 0;


      for(var person in c.instance.gamePersonData){
        var p = person.myPositionOnMap;

        if(p != null){
          p = c.mapOffsetToScreen(p);
          children.add(Positioned(
              left: p.dx - pointWidth/2,
              top: p.dy - pointHeight,
              child:  wPoint(pointColorList[i], person, (){
                c.setUserById(person.userId);
              })));
        }

        i++;
        if(i> pointColorList.length-1){
          i=pointColorList.length-1;
        }
      }


      return Stack(
        children: children,
      );
    });
  }

  Widget wPoint(Color color, GamePersonData data, VoidCallback onClick){
    final nextWantCP = data.nextWantPoint;
    var text = '';
    if(nextWantCP!= null){
      text = '正前往${nextWantCP.snString}点';
    }

    return GestureDetector(
      onTap: onClick,
      child: SizedBox(
        width: pointWidth,
        height: pointHeight,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Container(
              height: 5.85.wp,
              width: pointWidth,
              decoration: BoxDecoration(color: color, borderRadius: BorderRadius.circular(3.0.wp)),
              padding: EdgeInsets.fromLTRB(2.6.wp, 0, 2.6.wp, 0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  SizedBox(width: 13.0.wp,
                      child: Text(
                          data.userName,
                          style: TextStyle(fontSize: 3.5.wp, color: Colors.white),
                        overflow: TextOverflow.clip,
                      )),
                  Text(text, style: TextStyle(fontSize: 3.5.wp, color: Colors.black)),
                  Icon(Icons.arrow_forward_ios_rounded, size: 3.0.wp, color: Colors.white)
                ],
              ),
            ),
            WidgetPoint(width: 14.68.wp, height: 21.57.wp, color: color, imageBytes: data.userHead.value.data)
          ],
        ),
      ),
    );
  }

}