import 'package:fis_measure/interfaces/process/visuals/visual_area.dart';
import 'package:fis_measure/interfaces/process/workspace/application.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:vid/us/vid_us_visual_area_type.dart';

class MeasureAreaIndicator extends StatefulWidget {
  const MeasureAreaIndicator({super.key});

  @override
  State<MeasureAreaIndicator> createState() => _MeasureAreaIndicatorState();
}

class _MeasureAreaIndicatorState extends State<MeasureAreaIndicator> {
  late IApplication application = Get.find<IApplication>();

  /// 高度百分比
  double regionHeight = 0;

  /// 宽度百分比
  double regionWidth = 0;

  /// Top百分比
  double regionTop = 0;

  /// Left百分比
  double regionLeft = 0;

  @override
  void initState() {
    super.initState();
    application.visualAreaChanged.addListener(_visualAreaChanged);
    _initVisualArea(application.currentVisualArea);
  }

  @override
  void dispose() {
    super.dispose();
    application.visualAreaChanged.removeListener(_visualAreaChanged);
  }

  void _visualAreaChanged(sender, IVisualArea e) {
    if (mounted) {
      _setMeasureArea(e);
    }
  }

  void _setMeasureArea(IVisualArea e) {
    if (e.visualAreaType == VidUsVisualAreaType.TissueTimeMotion ||
        e.visualAreaType == VidUsVisualAreaType.Doppler) {
      regionHeight = (1 - e.displayRegion.top) * context.size!.height;
      regionWidth = context.size!.width;
      regionTop = e.displayRegion.top * context.size!.height;
      regionLeft = 0;
    } else {
      regionHeight = e.displayRegion.height * context.size!.height;
      regionWidth = e.displayRegion.width * context.size!.width;
      regionTop = e.displayRegion.top * context.size!.height;
      regionLeft = e.displayRegion.left * context.size!.width;
    }
    setState(() {});
  }

  void _initVisualArea(IVisualArea e) {
    WidgetsBinding.instance.addPostFrameCallback((_) {
      _setMeasureArea(e);
    });
  }

  @override
  Widget build(BuildContext context) {
    return IgnorePointer(
      child: Stack(
        children: [
          Positioned(
            top: regionTop,
            left: regionLeft,
            child: Container(
              width: regionWidth,
              height: regionHeight,
              decoration: BoxDecoration(
                border: Border.all(
                  strokeAlign: BorderSide.strokeAlignCenter,
                  color: Colors.grey.withOpacity(0.5),
                  width: 1,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}