import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:skillcourt/pages/play_setup/play_setup.dart';

class PlaySetUpItem {
  String? name;
  int? id;
  int? padLightUp;
  int? padLightDelay;
  String? gameRepeats;
  var padSequence;
  int? minutes;
  int? seconds;
  int? numOfHits;
  String? gameLength;

  PlaySetUpItem(this.id,
      {required this.padLightUp,
      required this.padLightDelay,
      required this.gameRepeats,
      required this.gameLength,
      this.padSequence,
      this.minutes,
      this.seconds,
      this.numOfHits,
      this.name});

  Map<String, dynamic> toMap() {
    return {
      'id': id,
      'session_name': name,
      'pad_light_up': padLightUp,
      'pad_light_delay': padLightDelay,
      'game_repeats': gameRepeats,
      'minutes': minutes,
      'seconds': seconds,
      'num_of_hits': numOfHits,
      'game_length': gameLength,
      'pad_sequence': padSequence as String
    };
  }

  bool validateSetUp() {
    return padLightUp != null &&
        padLightDelay != null &&
        padSequence != null &&
        gameRepeats != null &&
        ((minutes != null && seconds != null) || numOfHits != null);
  }

  Widget gameSessionDisplay(
      {String? name, Function()? onDelete, Function()? onSelected}) {
    // bool isCardOpen = false;
    return GameSessionDisplay(
      playSetUpItem: this,
      name: name,
      onDelete: onDelete,
      onSelected: onSelected,
    );
  }

  static Widget playSetUpParameter(
      {required IconData icon, required String selection}) {
    return Flexible(
      fit: FlexFit.tight,
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [Icon(icon), Text(selection)],
        ),
      ),
    );
  }
}

class EditMenu extends StatefulWidget {
  const EditMenu({
    Key? key,
    required this.title,
    required this.description,
    required this.icon,
    required this.currentSelection,
    required this.carouselController,
    required this.items,
    required this.itemSelected,
    this.onTapPlaySettingButton,
    this.playItemParameter,
    required this.unit,
  }) : super(key: key);
  final playItemParameter;
  final String title;
  final String description;
  final String unit;
  final IconData icon;
  final int currentSelection;
  final CarouselController carouselController;
  final List<Widget> items;
  final Function(int) itemSelected;
  final Function()? onTapPlaySettingButton;

  @override
  State<EditMenu> createState() => _EditMenuState();
}

class _EditMenuState extends State<EditMenu> {
  late CarouselController _carouselController;
  late int _currentSelection;

  @override
  void initState() {
    super.initState();
    _carouselController = widget.carouselController;
    _currentSelection = widget.currentSelection;
  }

  @override
  Widget build(BuildContext context) {
    return Column(children: [
      Header(
          icon: Icons.restart_alt_outlined,
          onPressed: () {
            setState(() {
              _carouselController.jumpToPage(0);
              widget.itemSelected(0);
            });
          }),
      Align(
        alignment: Alignment.centerLeft,
        child: Padding(
          padding: EdgeInsets.all(8.0),
          child: Text(widget.description),
        ),
      ),
      PlaySettingButton(
        title: widget.title,
        icon: widget.icon,
        selection: 'Set',
        unit: widget.playItemParameter == null ? null : '',
        onTap: widget.playItemParameter != null
            ? widget.onTapPlaySettingButton
            : null,
      ),
      const Divider(),
      SizedBox(
        height: 100,
        child: CarouselSlider(
          carouselController: _carouselController,
          items: widget.items,
          options: CarouselOptions(
              initialPage: _currentSelection,
              enlargeCenterPage: true,
              aspectRatio: 3,
              viewportFraction: 0.3,
              onPageChanged: (index, carousel) {
                widget.itemSelected(index);
              }),
        ),
      ),
      const Divider(),
      Text(widget.unit),
    ]);
  }
}

class GameSessionDisplay extends StatefulWidget {
  const GameSessionDisplay(
      {super.key,
      this.name,
      required this.playSetUpItem,
      this.onDelete,
      this.onSelected});

  final PlaySetUpItem playSetUpItem;
  final String? name;
  final Function()? onDelete;
  final Function()? onSelected;

  @override
  State<GameSessionDisplay> createState() => _GameSessionDisplayState();
}

class _GameSessionDisplayState extends State<GameSessionDisplay> {
  double _cardPosition = 0.0;

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        // Menu
        Positioned(
          top: 0,
          bottom: 0,
          right: 0,
          child: Container(
            width: 100, // Adjust the width as needed
            color: Color(0xFFF5F5F5),
            child: Center(
              child: IconButton(
                  icon: Icon(
                    Icons.cancel,
                    color: Colors.red,
                    size: 35,
                  ),
                  onPressed: widget.onDelete),
            ),
          ),
        ),
        GestureDetector(
          onHorizontalDragUpdate: (details) {
            setState(() {
              _cardPosition += details.primaryDelta!;
              // Adjust the sensitivity as needed
              if (_cardPosition < -100) {
                _cardPosition = -100;
              } else if (_cardPosition > 0) {
                _cardPosition = 0;
              }
            });
          },
          onTap: widget.onSelected,
          child: Transform.translate(
            offset: Offset(_cardPosition, 0),
            child: Card(
              shape: const RoundedRectangleBorder(
                side: BorderSide(
                  color: Colors.grey,
                ),
                borderRadius: BorderRadius.all(Radius.circular(5)),
              ),
              elevation: 0,
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Column(
                  children: [
                    Text(widget.name ?? ''),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: [
                        PlaySetUpItem.playSetUpParameter(
                            icon: Icons.wb_sunny_outlined,
                            selection:
                                '${widget.playSetUpItem.padLightUp} Sec'),
                        PlaySetUpItem.playSetUpParameter(
                            icon: Icons.compare_arrows,
                            selection:
                                '${widget.playSetUpItem.gameRepeats}\t\t\t\t\t\t\t\t'),
                      ],
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        PlaySetUpItem.playSetUpParameter(
                            icon: Icons.access_alarm,
                            selection:
                                '${widget.playSetUpItem.padLightDelay} Sec'),
                        PlaySetUpItem.playSetUpParameter(
                            icon: Icons.border_all, selection: 'Custom'),
                      ],
                    ),
                    SizedBox(
                      width: 150,
                      child: Flex(
                          direction: Axis.horizontal,
                          mainAxisSize: MainAxisSize.min,
                          children: [
                            PlaySetUpItem.playSetUpParameter(
                                icon: Icons.timer_sharp,
                                selection: widget.playSetUpItem.gameLength!),
                          ]),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),
      ],
    );
  }
}
