import 'package:flutter/material.dart';
import 'package:syncrow_web/utils/color_manager.dart';

class TimeWheelPicker extends StatefulWidget {
  final int initialHours;
  final int initialMinutes;
  final int initialSeconds;
  final Function(int, int, int) onTimeChanged;

  const TimeWheelPicker({
    super.key,
    required this.initialHours,
    required this.initialMinutes,
    required this.initialSeconds,
    required this.onTimeChanged,
  });

  @override
  State<TimeWheelPicker> createState() => _TimeWheelPickerState();
}

class _TimeWheelPickerState extends State<TimeWheelPicker> {
  late FixedExtentScrollController _hoursController;
  late FixedExtentScrollController _minutesController;
  late FixedExtentScrollController _secondsController;

  @override
  void initState() {
    super.initState();
    _hoursController =
        FixedExtentScrollController(initialItem: widget.initialHours);
    _minutesController =
        FixedExtentScrollController(initialItem: widget.initialMinutes);
    _secondsController =
        FixedExtentScrollController(initialItem: widget.initialSeconds);
  }

  @override
  void didUpdateWidget(TimeWheelPicker oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (oldWidget.initialHours != widget.initialHours) {
      _hoursController.jumpToItem(widget.initialHours);
    }
    if (oldWidget.initialMinutes != widget.initialMinutes) {
      _minutesController.jumpToItem(widget.initialMinutes);
    }
    if (oldWidget.initialSeconds != widget.initialSeconds) {
      _secondsController.jumpToItem(widget.initialSeconds);
    }
  }



  @override
  void dispose() {
    _hoursController.dispose();
    _minutesController.dispose();
    _secondsController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        _buildPickerColumn(
            label: 'h',
            controller: _hoursController,
            itemCount: 3,
            onChanged: (value) {
              _handleTimeChange(
                value,
                _minutesController.selectedItem,
                _secondsController.selectedItem,
              );
            }),
        const SizedBox(width: 5),
        _buildPickerColumn(
            label: 'm',
            controller: _minutesController,
            itemCount: 60,
            onChanged: (value) {
              _handleTimeChange(
                _hoursController.selectedItem,
                value,
                _secondsController.selectedItem,
              );
            }),
        const SizedBox(width: 5),
        _buildPickerColumn(
          label: 's',
          controller: _secondsController,
          itemCount: 60,
          onChanged: (value) => _handleTimeChange(
            _hoursController.selectedItem,
            _minutesController.selectedItem,
            value,
          ),
        ),
      ],
    );
  }

  void _handleTimeChange(int hours, int minutes, int seconds) {
    int total = hours * 3600 + minutes * 60 + seconds;
    if (total > 10000) {
      hours = 2;
      minutes = 46;
      seconds = 40;
      total = 10000;
      WidgetsBinding.instance.addPostFrameCallback((_) {
        _hoursController.jumpToItem(hours);
        _minutesController.jumpToItem(minutes);
        _secondsController.jumpToItem(seconds);
      });
    }

    widget.onTimeChanged(hours, minutes, seconds);
  }

  Widget _buildPickerColumn({
    required String label,
    required FixedExtentScrollController controller,
    required int itemCount,
    required Function(int) onChanged,
  }) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Container(
          height: 40,
          width: 40,
          padding: const EdgeInsets.symmetric(horizontal: 5),
          decoration: BoxDecoration(
            color: ColorsManager.boxColor,
            borderRadius: BorderRadius.circular(8),
          ),
          child: ListWheelScrollView.useDelegate(
            controller: controller,
            itemExtent: 40.0,
            physics: const FixedExtentScrollPhysics(),
            onSelectedItemChanged: onChanged,
            childDelegate: ListWheelChildBuilderDelegate(
              builder: (context, index) => Center(
                child: Text(
                  index.toString().padLeft(2),
                  style: const TextStyle(
                    fontSize: 18,
                    color: ColorsManager.blue1,
                  ),
                ),
              ),
              childCount: itemCount,
            ),
          ),
        ),
        const SizedBox(width: 5),
        Text(
          label,
          style: const TextStyle(
            color: ColorsManager.blackColor,
            fontSize: 18,
          ),
        ),
      ],
    );
  }
}
