import { Component, OnInit, AfterViewInit, Input } from '@angular/core';
import { ModalController, NavParams } from '@ionic/angular';

import { Event } from '../../models/event.model';
import { EventsService } from 'src/app/services/events.service';
import { EventBody } from 'src/app/models/eventbody.model';
import { AttendeesPage } from 'src/app/pages/events/attendees/attendees.page';

import { AttendeeModalPage } from '../events/attendee-modal/attendee-modal.page';
import { EventPerson } from 'src/app/models/eventperson.model';
import { AlertService } from 'src/app/services/alert.service';
import { FormGroup, FormBuilder, Validators } from "@angular/forms";
import { identifierModuleUrl } from '@angular/compiler';

@Component({
  selector: 'app-cal-modal',
  templateUrl: './cal-modal.page.html',
  styleUrls: ['./cal-modal.page.scss'],
})
export class CalModalPage implements OnInit {

  calendar = {
    mode: 'month',
    currentDate: new Date()
  };

  eventAttendees: EventPerson[];
  segment:string = "true";
  selectedSegment: string;
  selectedDate: Date;

  viewTitle: string;
  postEvent: Event;
  eventBody: EventBody;
  modalReady = false;
  
  minDate: string;

  ionicForm: FormGroup;
  isSubmitted = false;

  formSubjectSatus: boolean = false;
  formDescriptionSatus: boolean = false;
  formLocationSatus: boolean = false;
  formEventTypeSatus: boolean = false;

  profile:string;

  constructor(
    public formBuilder: FormBuilder, 
    private modalCtrl: ModalController, 
    private eventService: EventsService, 
    private alertController:AlertService, 
    private navParams: NavParams
    ) 
    { 
      this.postEvent = new Event();
      this.eventBody = { BodyType : "1", Text : ""};
      this.postEvent.Body = this.eventBody;
      this.profile = this.navParams.get('profile');
    }

  ngOnInit() {

    
    this.selectedSegment = this.navParams.get('segment');
    this.selectedDate = this.navParams.get('eventSelectedDate');

    let selectedStartdDate = this.selectedDate;
    let selectedEndDate = new Date(this.selectedDate);
    /* Set + 30minutes to seleted datetime */
    selectedEndDate.setMinutes(this.selectedDate.getMinutes() + 30)
    
    this.minDate = this.selectedDate.toString();
    
    if(this.selectedSegment != "Combinada"){
      this.postEvent ={
        EventId: '',
        Subject: '',
        Body: this.eventBody,
        Location: '',
        CalendarId: '',
        CalendarName: this.selectedSegment,
        StartDate: selectedStartdDate,
        EndDate: new Date(selectedEndDate),
        EventType: 'Reunião',
        Attendees: null,
        IsMeeting: false,
        IsRecurring: false,
        AppointmentState: 0,
        TimeZone: '',
        Organizer: '',
        Categories: null,
        HasAttachments: false,
      };
    }
    else{
      this.postEvent ={
        EventId: '',
        Subject: '',
        Body: this.eventBody,
        Location: '',
        CalendarId: '',
        CalendarName: 'Oficial',
        StartDate: selectedStartdDate,
        EndDate: new Date(selectedEndDate),
        EventType: 'Reunião',
        Attendees: null,
        IsMeeting: false,
        IsRecurring: false,
        AppointmentState: 0,
        TimeZone: '',
        Organizer: '',
        Categories: null,
        HasAttachments: false,
      };
    }

    this.ionicForm = this.formBuilder.group({
      subject: ['', [Validators.required]],
      agenda: ['', [Validators.required]],
      startdate: ['', [Validators.required]],
      enddate: ['', [Validators.required]],
      description: ['', [Validators.required]],
      location: ['', [Validators.required]],
      eventtype: ['', [Validators.required]]
    }) 
  }

  get errorControl() {
    return this.ionicForm.controls;
  }

  ngAfterViewInit(): void {
    setTimeout(()=>{
      this.modalReady = true;
    }, 0);
  }

  save(){
    if (this.ionicForm.valid) {
      if(this.profile=='mdgpr'){
        this.eventService.postEventMd(this.postEvent, this.postEvent.CalendarName).subscribe();
        
      }
      else if(this.profile=='pr'){
        this.eventService.postEventPr(this.postEvent, this.postEvent.CalendarName).subscribe();
      }
      this.modalCtrl.dismiss(this.postEvent);
    }
    else{
      this.validateFormInputs();
    }
  }
  
  validateFormInputs(){
    let formSubject = this.postEvent.Subject.trim();
    let formDescription = this.postEvent.Body.Text.trim();
    let formLocation = this.postEvent.Location.trim();
  
    if (!this.postEvent.Subject &&  formSubject.length <= 0){
      this.formSubjectSatus=true;
    }
    else{
      this.formSubjectSatus=false;
      if(!this.postEvent.Body.Text &&  formDescription.length <= 0){
        this.formDescriptionSatus=true;
      }
      else{
        this.formDescriptionSatus=false;
        if (!this.postEvent.Location &&  formLocation.length <= 0){
          this.formLocationSatus=true;
        }
        else{
          this.formLocationSatus=false;
        }
      }
    }
    /* return (this.postEvent.Subject &&  formSubject.length > 0); */
  }

  onViewTitleChanged(title){
    this.viewTitle = title;
  }

  onTimeSelected(ev){
    /* this.postEvent.startTime = new Date(ev.selectedTime); */
    
  }

  close(){
    this.modalCtrl.dismiss();
    /* this.modalCtrl.dismiss(this.postEvent); */
  }

  async addAttendees()
  {
    const modal = await this.modalCtrl.create({
      component: AttendeeModalPage,
      componentProps: {
        eventPersons: this.postEvent.Attendees
      },
      cssClass: 'attendee-modal',
      backdropDismiss: false
    });

    await modal.present();

    modal.onDidDismiss().then((data) => {
      let newattendees: EventPerson[] = data['data'];
      
      
      if (newattendees != null)
      {
        newattendees.forEach(newattendee => {
          let att = {
            "EmailAddress": newattendee.EmailAddress,
            "Name": newattendee.Name,
            "IsRequired": (this.segment == "true")
          };
          if (this.eventAttendees == null)
          {
            this.eventAttendees = new Array();
          }
          this.eventAttendees.push(att);
          
        });
      }
      this.postEvent.Attendees = this.eventAttendees;
    });
  }

  showAlert(){
    this.alertController.presentAlert("Funcionalidade em desenvolvimento");
  }

  async openAttendees()
  {
    const modal = await this.modalCtrl.create({
      component: AttendeesPage,
       componentProps: {
        eventAttendees: this.postEvent.Attendees
      },
      cssClass: 'attendee',
      backdropDismiss: false
    });

    await modal.present();

    modal.onDidDismiss().then((data) => {
      if (data['data'] != null)
      { 
        let newattendees: EventPerson[] = data['data'];
        this.postEvent.Attendees = newattendees;
      }
    });
}


}