import 'package:aitrainer_app/bloc/training_log/training_log_bloc.dart';
import 'package:aitrainer_app/model/training_result.dart';
import 'package:aitrainer_app/util/common.dart';
import 'package:aitrainer_app/util/trans.dart';
import 'package:aitrainer_app/widgets/app_bar.dart';
import 'package:aitrainer_app/widgets/bottom_nav.dart';
import 'package:aitrainer_app/widgets/menu_search_bar.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:modal_progress_hud_nsn/modal_progress_hud_nsn.dart';
import 'package:syncfusion_flutter_calendar/calendar.dart';
import 'package:syncfusion_flutter_core/theme.dart';

// ignore: must_be_immutable
class MyDevelopmentLog extends StatelessWidget with Trans, Common {
  MyDevelopmentLog({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    setContext(context);
    return BlocProvider(
        create: (context) => TrainingLogBloc()..add(TrainingLogLoad()),
        child: BlocConsumer<TrainingLogBloc, TrainingLogState>(listener: (context, state) {
          if (state is TrainingLogError) {
            ScaffoldMessenger.of(context).showSnackBar(
                SnackBar(backgroundColor: Colors.orange, content: Text(state.message, style: TextStyle(color: Colors.white))));
          }
        }, builder: (context, state) {
          final exerciseBloc = BlocProvider.of<TrainingLogBloc>(context);
          return ModalProgressHUD(
            child: getTrainingLog(exerciseBloc),
            inAsyncCall: state is TrainingLogLoading,
            opacity: 0.5,
            color: Colors.black54,
            progressIndicator: CircularProgressIndicator(),
          );
        }));
  }

  Widget getTrainingLog(TrainingLogBloc bloc) {
    return Scaffold(
      appBar: AppBarNav(depth: 1),
      body: Container(
          height: double.infinity,
          width: double.infinity,
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage('asset/image/WT_plainblack_background.jpg'),
              fit: BoxFit.cover,
              alignment: Alignment.center,
            ),
          ),
          child: Container(
            padding: EdgeInsets.only(left: 10, right: 10),
            child: Column(children: [
              getHeader(),
              getCalendar(bloc),
            ]),
          )),
      bottomNavigationBar: BottomNavigator(bottomNavIndex: 1),
    );
  }

  Widget getSearchBar() {
    return MenuSearchBar(
      listItems: [],
      onFind: (value) {},
    );
  }

  Widget getCalendar(TrainingLogBloc bloc) {
    return Expanded(
        child: SfCalendarTheme(
      data: SfCalendarThemeData(brightness: Brightness.dark, backgroundColor: Colors.transparent),
      child: SfCalendar(
          dataSource: TrainingDataSource(bloc.getTrainingResults()),
          view: CalendarView.month,
          allowedViews: [
            CalendarView.day,
            CalendarView.week,
            CalendarView.month,
          ],
          monthViewSettings: MonthViewSettings(
            showAgenda: true,
            appointmentDisplayMode: MonthAppointmentDisplayMode.appointment,
            showTrailingAndLeadingDates: true,
          ),
          appointmentTimeTextFormat: 'HH:mm',
          headerDateFormat: "y MMMM",
          firstDayOfWeek: 1, // Monday
          selectionDecoration: BoxDecoration(
            color: Colors.transparent,
            border: Border.all(color: Colors.red, width: 2),
            borderRadius: const BorderRadius.all(Radius.circular(4)),
            shape: BoxShape.rectangle,
          ),
          todayHighlightColor: Color(0xffb4f500),
          showNavigationArrow: true,
          showDatePickerButton: true,
          allowViewNavigation: true,
          onTap: (detail) => {
                print("${detail.appointments}"),
              },
          appointmentBuilder: (BuildContext context, CalendarAppointmentDetails details) {
            final TrainingResult result = details.appointments.first;
            return Container(
                padding: EdgeInsets.only(left: 8, top: 5, right: 5, bottom: 5),
                height: 70,
                color: result.isTest ? Colors.blue : Colors.orange,
                child: Row(mainAxisAlignment: MainAxisAlignment.start, children: [
                  Flexible(
                    fit: FlexFit.tight,
                    flex: 30,
                    child: Text(result.eventName, style: GoogleFonts.inter(fontSize: 14, color: Colors.white, fontWeight: FontWeight.bold)),
                  ),
                  Flexible(
                      fit: FlexFit.tight,
                      flex: 25,
                      child: Text(
                        result.summary == null ? "" : result.summary!,
                        style: TextStyle(fontSize: 12, color: Colors.white),
                      )),
                  IconButton(
                    padding: EdgeInsets.zero,
                    icon: Icon(Icons.info_outline, color: Color(0xffb4f500)),
                    onPressed: () {},
                  ),
                  IconButton(
                    padding: EdgeInsets.zero,
                    icon: Icon(Icons.delete, color: Colors.black12),
                    onPressed: () {},
                  )
                ]));
          }),
    ));
  }

  Widget getHeader() {
    return Card(
        color: Colors.white60,
        child: Container(
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage('asset/image/WT_plainblack_background.jpg'),
              fit: BoxFit.cover,
              alignment: Alignment.center,
            ),
          ),
          padding: EdgeInsets.only(left: 10, right: 5, top: 12, bottom: 8),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              Icon(
                Icons.info,
                color: Colors.orangeAccent,
              ),
              Text("  "),
              Text(
                t("My Exercise Logs"),
                style: GoogleFonts.inter(
                  fontSize: 16,
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                ),
              ),
              Divider(),
              Flexible(
                fit: FlexFit.tight,
                flex: 5,
                child: getSearchBar(),
              )
            ],
          ),
        ));
  }
}