import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_app/features/devices/bloc/three_gang_bloc/three_gang_bloc.dart';
import 'package:syncrow_app/features/devices/bloc/three_gang_bloc/three_gang_event.dart';
import 'package:syncrow_app/features/devices/bloc/three_gang_bloc/three_gang_state.dart';
import 'package:syncrow_app/features/devices/model/device_model.dart';
import 'package:syncrow_app/features/shared_widgets/create_schedule.dart';
import 'package:syncrow_app/features/shared_widgets/default_scaffold.dart';
import 'package:syncrow_app/features/shared_widgets/schedule_list.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_large.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_small.dart';
import 'package:syncrow_app/generated/assets.dart';
import 'package:syncrow_app/utils/context_extension.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';
import 'package:syncrow_app/utils/resource_manager/font_manager.dart';

class TimerScheduleScreen extends StatelessWidget {
  final DeviceModel device;
  final String deviceCode;
  final String switchCode;
  const TimerScheduleScreen(
      {required this.device,
      required this.deviceCode,
      required this.switchCode,
      super.key});

  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion(
      value: SystemUiOverlayStyle(
        statusBarColor: ColorsManager.primaryColor.withOpacity(0.5),
        statusBarIconBrightness: Brightness.light,
      ),
      child: BlocProvider(
        create: (context) => ThreeGangBloc(
            switchCode: switchCode, threeGangId: device.uuid ?? '')
          ..add(GetCounterEvent(deviceCode: deviceCode))
          ..add(GetScheduleEvent()),
        child: BlocBuilder<ThreeGangBloc, ThreeGangState>(
          builder: (context, state) {
            final threeGangBloc = BlocProvider.of<ThreeGangBloc>(context);
            Duration duration = Duration.zero;
            int countNum = 0;
            if (state is UpdateTimerState) {
              countNum = state.seconds;
            } else if (state is TimerRunInProgress) {
              countNum = state.remainingTime;
            } else if (state is TimerRunComplete) {
              countNum = 0;
            } else if (state is LoadingNewSate) {
              countNum = 0;
            }
            return PopScope(
                canPop: false,
                onPopInvoked: (didPop) {
                  if (!didPop) {
                    threeGangBloc.add(OnClose());
                    Navigator.pop(context);
                  }
                },
                child: DefaultTabController(
                    length: 2,
                    child: DefaultScaffold(
                      appBar: AppBar(
                        backgroundColor: Colors.transparent,
                        centerTitle: true,
                        title: const BodyLarge(
                          text: 'Schedule',
                          fontColor: ColorsManager.primaryColor,
                          fontWeight: FontsManager.bold,
                        ),
                        actions: [
                          threeGangBloc.createSchedule == true
                              ? TextButton(
                                  onPressed: () {
                                    threeGangBloc.add(ThreeGangSave());
                                  },
                                  child: const Text('Save'))
                              : threeGangBloc.selectedTabIndex == 1
                                  ? IconButton(
                                      onPressed: () {
                                        threeGangBloc.toggleCreateSchedule();
                                      },
                                      icon: const Icon(Icons.add),
                                    )
                                  : SizedBox(),
                        ],
                      ),
                      child: state is LoadingInitialState
                          ? const Center(child: CircularProgressIndicator())
                          : Column(
                              children: [
                                Container(
                                  width: MediaQuery.of(context).size.width,
                                  decoration: const ShapeDecoration(
                                    color: ColorsManager.onPrimaryColor,
                                    shape: RoundedRectangleBorder(
                                      borderRadius:
                                          BorderRadius.all(Radius.circular(30)),
                                    ),
                                  ),
                                  child: TabBar(
                                    onTap: (value) {
                                      if (value == 0) {
                                        if (threeGangBloc.createSchedule ==
                                            true) {
                                          threeGangBloc.toggleCreateSchedule();
                                        }
                                        threeGangBloc.toggleSelectedIndex(0);
                                      } else {
                                        threeGangBloc.toggleSelectedIndex(1);
                                      }
                                    },
                                    indicatorColor: Colors.white,
                                    dividerHeight: 0,
                                    indicatorSize: TabBarIndicatorSize.tab,
                                    indicator: const ShapeDecoration(
                                      color: ColorsManager.slidingBlueColor,
                                      shape: RoundedRectangleBorder(
                                        borderRadius: BorderRadius.all(
                                            Radius.circular(20)),
                                      ),
                                    ),
                                    tabs: [
                                      Tab(
                                        child: Container(
                                          padding: const EdgeInsets.symmetric(
                                              vertical: 10),
                                          child: BodySmall(
                                            text: 'Countdown',
                                            style: context.bodySmall.copyWith(
                                              color: ColorsManager.blackColor,
                                              fontSize: 12,
                                              fontWeight: FontWeight.w400,
                                            ),
                                          ),
                                        ),
                                      ),
                                      Tab(
                                        child: Container(
                                          padding: const EdgeInsets.symmetric(
                                              vertical: 10),
                                          child: Text(
                                            'Schedule',
                                            style: context.bodySmall.copyWith(
                                              color: ColorsManager.blackColor,
                                              fontSize: 12,
                                              fontWeight: FontWeight.w400,
                                            ),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Expanded(
                                  child: TabBarView(
                                    children: [
                                      Center(
                                        child: Container(
                                          child: Column(
                                            mainAxisAlignment:
                                                MainAxisAlignment.center,
                                            children: [
                                              countNum > 0
                                                  ? BodyLarge(
                                                      text: _formatDuration(
                                                          countNum),
                                                      fontColor: ColorsManager
                                                          .slidingBlueColor,
                                                      fontSize: 40,
                                                    )
                                                  : CupertinoTimerPicker(
                                                      mode:
                                                          CupertinoTimerPickerMode
                                                              .hm,
                                                      onTimerDurationChanged:
                                                          (Duration
                                                              newDuration) {
                                                        duration = newDuration;
                                                      },
                                                    ),
                                              GestureDetector(
                                                  onTap: () {
                                                    if (state
                                                        is LoadingNewSate) {
                                                      return;
                                                    }
                                                    if (countNum > 0) {
                                                      threeGangBloc.add(
                                                          SetCounterValue(
                                                              deviceCode:
                                                                  deviceCode,
                                                              duration: Duration
                                                                  .zero));
                                                    } else if (duration !=
                                                        Duration.zero) {
                                                      threeGangBloc.add(
                                                          SetCounterValue(
                                                              deviceCode:
                                                                  deviceCode,
                                                              duration:
                                                                  duration));
                                                    }
                                                  },
                                                  child: SvgPicture.asset(
                                                      countNum > 0
                                                          ? Assets.pauseIcon
                                                          : Assets.playIcon)),
                                            ],
                                          ),
                                        ),
                                      ),
                                      SizedBox(
                                        child: threeGangBloc.createSchedule ==
                                                true
                                            ? CreateSchedule(
                                                onToggleChanged: (bool isOn) {
                                                  threeGangBloc.toggleSchedule =
                                                      isOn;
                                                },
                                                onDateTimeChanged:
                                                    (DateTime dateTime) {
                                                  threeGangBloc.selectedTime =
                                                      dateTime;
                                                },
                                                days: threeGangBloc.days,
                                                selectDays: (List<String>
                                                    selectedDays) {
                                                  threeGangBloc.selectedDays =
                                                      selectedDays;
                                                },
                                              )
                                            : Padding(
                                                padding: const EdgeInsets.only(
                                                    top: 10),
                                                child: Column(
                                                  mainAxisAlignment:
                                                      MainAxisAlignment.start,
                                                  crossAxisAlignment:
                                                      CrossAxisAlignment.start,
                                                  children: [
                                                    Expanded(
                                                      child: ScheduleListView(
                                                        listSchedule: threeGangBloc
                                                            .listSchedule, // Pass the schedule list here
                                                        onDismissed:
                                                            (scheduleId) {
                                                          threeGangBloc
                                                              .listSchedule
                                                              .removeWhere(
                                                                  (schedule) =>
                                                                      schedule
                                                                          .scheduleId ==
                                                                      scheduleId);
                                                          threeGangBloc.add(
                                                              DeleteScheduleEvent(
                                                                  id: scheduleId));
                                                        },
                                                        onToggleSchedule:
                                                            (scheduleId,
                                                                isEnabled) {
                                                          threeGangBloc.add(
                                                              ToggleScheduleEvent(
                                                            id: scheduleId,
                                                            toggle: isEnabled,
                                                          ));
                                                        },
                                                      ),
                                                    ),
                                                  ],
                                                ),
                                              ),
                                      ),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                    )));
          },
        ),
      ),
    );
  }

  String _formatDuration(int seconds) {
    final hours = (seconds ~/ 3600).toString().padLeft(2, '0');
    final minutes = ((seconds % 3600) ~/ 60).toString().padLeft(2, '0');
    final secs = (seconds % 60).toString().padLeft(2, '0');
    return '$hours:$minutes:$secs';
  }
}