import 'dart:async';

import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';

class LineChartPainter extends StatefulWidget {
  const LineChartPainter({
    super.key,
    required this.value1,
    required this.colorValue1,
    required this.titleValue1,
    this.value2,
    this.colorValue2,
    this.titleValue2,
    this.value3,
    this.colorValue3,
    this.titleValue3,
    this.minY,
  });

  final double value1;
  final Color colorValue1;
  final String titleValue1;

  final double? value2;
  final Color? colorValue2;
  final String? titleValue2;

  final double? value3;
  final Color? colorValue3;
  final String? titleValue3;

  final double? minY;

  @override
  State<LineChartPainter> createState() => _LineChartPainterState();
}

class _LineChartPainterState extends State<LineChartPainter> {
  List<Color> gradientColors = [
    Colors.cyan,
    Colors.blue,
  ];

  final limitCount = 1000;
  final line1Points = <FlSpot>[];
  final line2Points = <FlSpot>[];
  final line3Points = <FlSpot>[];

  double xValue = 0;
  double step = 0.05;

  late Timer timer;

  bool showAvg = false;

  @override
  void initState() {
    super.initState();
    timer = Timer.periodic(const Duration(milliseconds: 40), (timer) {
      while (line1Points.length > limitCount) {
        line1Points.removeAt(0);
        if (widget.value2 != null) line2Points.removeAt(0);
        if (widget.value3 != null) line3Points.removeAt(0);
      }
      setState(() {
        line1Points.add(FlSpot(xValue, widget.value1));
        if (widget.value2 != null) {
          line2Points.add(FlSpot(xValue, widget.value2!));
        }
        if (widget.value3 != null) {
          line3Points.add(FlSpot(xValue, widget.value3!));
        }
      });
      xValue += step;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(
          '${widget.titleValue1}: ${widget.value1}',
          style: TextStyle(
            color: widget.colorValue1,
            fontSize: 14,
            // fontWeight: FontWeight.bold,
          ),
        ),
        if (widget.value2 != null)
          Text(
            '${widget.titleValue2}: ${widget.value2}',
            style: TextStyle(
              color: widget.colorValue2,
              fontSize: 14,
              // fontWeight: FontWeight.bold,
            ),
          ),
        if (widget.value3 != null)
          Text(
            '${widget.titleValue3}: ${widget.value3}',
            style: TextStyle(
              color: widget.colorValue3,
              fontSize: 14,
              // fontWeight: FontWeight.bold,
            ),
          ),
        const SizedBox(
          height: 12,
        ),
        Container(
          height: 200,
          width: 400,
          decoration:
              BoxDecoration(border: Border.all(width: 1, color: Colors.white)),
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: line1Points.isNotEmpty
                ? LineChart(
                    LineChartData(
                      minY: widget.minY,
                      minX: line1Points.first.x,
                      maxX: line1Points.last.x,
                      lineTouchData: const LineTouchData(
                        enabled: true,
                        touchSpotThreshold: 10,
                      ),
                      clipData: const FlClipData.all(),
                      gridData: const FlGridData(
                        show: true,
                        drawVerticalLine: false,
                      ),
                      borderData: FlBorderData(show: false),
                      lineBarsData: [
                        line1(line1Points),
                        line2(line2Points),
                        line3(line3Points),
                      ],
                      titlesData: const FlTitlesData(show: false),
                    ),
                    duration: Duration.zero,
                  )
                : Container(),
          ),
        ),
      ],
    );
  }

  LineChartBarData line1(List<FlSpot> points) {
    return LineChartBarData(
      spots: points,
      dotData: const FlDotData(
        show: false,
      ),
      color: widget.colorValue1,
      barWidth: 2,
      isCurved: false,
    );
  }

  LineChartBarData line2(List<FlSpot> points) {
    return LineChartBarData(
      spots: points,
      dotData: const FlDotData(
        show: false,
      ),
      color: widget.colorValue2,
      barWidth: 2,
      isCurved: false,
    );
  }

  LineChartBarData line3(List<FlSpot> points) {
    return LineChartBarData(
      spots: points,
      dotData: const FlDotData(
        show: false,
      ),
      color: widget.colorValue3,
      barWidth: 2,
      isCurved: false,
    );
  }

  @override
  void dispose() {
    timer.cancel();
    super.dispose();
  }
}
