import 'package:employee_selfservice_mobile/Screens/Menu/EventCalendar/meeting_provider.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:provider/provider.dart';
import 'package:syncfusion_flutter_calendar/calendar.dart';
import '../SlipGaji/background.dart';
import 'meeting.dart';
import 'meeting_data_source.dart';

class EventCalendarScreen extends StatefulWidget {
  const EventCalendarScreen({super.key});

  @override
  State<EventCalendarScreen> createState() => _EventCalendarScreen();
}

class _EventCalendarScreen extends State<EventCalendarScreen> {

  List<Meeting> _getDataSource() {
    final List<Meeting> meetings = <Meeting>[];
    final DateTime today = DateTime.now();
    final DateTime startTime = DateTime(today.year, today.month, today.day, 7);
    final DateTime endTime = startTime.add(const Duration(hours: 2));
    meetings.add(Meeting('Conference', startTime, endTime, const Color(0xFF0F8644), false));
    meetings.add(Meeting('Conference', startTime, endTime, const Color(0xFF0F8644), false));
    meetings.add(Meeting('Conference', startTime, endTime, const Color(0xFF0F8644), false));
    meetings.add(Meeting('Conference', startTime, endTime, const Color(0xFF0F8644), false));
    meetings.add(Meeting('Conference', startTime, endTime, const Color(0xFF0F8644), false));
    return meetings;
  }

  CalendarView calendarView = CalendarView.month;
  CalendarController calendarController = CalendarController();

  @override
  Widget build(BuildContext context) {
    //final provider = Provider.of<MeetingProvider>(context);

    return Scaffold(
        body: Stack(
          children: [
            WavyHeader(),
            Container(
                margin: EdgeInsets.only(top: MediaQuery
                    .of(context)
                    .size
                    .height / 6 - 20),
                padding: EdgeInsets.fromLTRB(20, 5, 25, 5),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.end,
                  crossAxisAlignment: CrossAxisAlignment.end,
                  children: [
                    Text(
                      'Event Calendar\t\t',
                      maxLines: 2,
                      style: GoogleFonts.luckiestGuy(
                        fontSize: 28,
                        color: Color(0xFF4858A7),
                        fontStyle: FontStyle.italic,
                      ),
                    ),
                    Image.asset(
                      "assets/icons/menu/ic_eventcalendar_2.png",
                      width: 40,
                      height: 40,
                    ),
                  ],
                )),
            SafeArea(
              child: Container(
                width: MediaQuery.of(context).size.width,
                height: MediaQuery.of(context).size.height,
                margin: EdgeInsets.only(top: MediaQuery.of(context).size.height / 5, left: 10, right: 10, bottom : 10,),
                padding: EdgeInsets.all(5),
                child:  Card(
                  elevation: 5,
                  child: Column(
                    children: [
                      Container(
                        margin: EdgeInsets.only(top: 10),
                      ),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                        children: [
                          OutlinedButton(onPressed: () {
                            setState(() {
                              calendarView = CalendarView.month;
                              calendarController.view = calendarView;
                            });
                          }, child: Text("Month View")),
                          OutlinedButton(onPressed: () {
                            setState(() {
                              calendarView = CalendarView.week;
                              calendarController.view = calendarView;
                            });
                          }, child: Text("Week View")),
                          OutlinedButton(onPressed: () {
                            setState(() {
                              calendarView = CalendarView.day;
                              calendarController.view = calendarView;
                            });
                          }, child: Text("Day View")),
                        ],
                      ),
                      Container(
                        height: (MediaQuery.of(context).size.height * 0.65),
                        child: SfCalendar(
                          view: calendarView,
                          controller: calendarController,
                          initialSelectedDate: DateTime.now(),
                          dataSource: MeetingDataSource(_getDataSource()),
                          //dataSource: MeetingDataSource(provider.meetings),
                          monthViewSettings: MonthViewSettings(appointmentDisplayMode: MonthAppointmentDisplayMode.indicator, showAgenda: true),
                          cellBorderColor: Colors.black45,
                          //cellBorderColor: Colors.transparent,
                          /*blackoutDates: [
                                  DateTime.now().subtract(Duration(hours: 48)),
                                  DateTime.now().subtract(Duration(hours: 24)),
                                ],*/
                          selectionDecoration: BoxDecoration(
                              color: Colors.transparent,
                              border: Border.all(
                                  color: Colors.red, width: 2),
                              borderRadius: BorderRadius.all(
                                  Radius.circular(4)),
                              shape: BoxShape.rectangle
                          ),
                        ),
                      )
                    ],
                  ),
                )
              ),
            ),
          ],
        )
    );
  }
}