doneit-web/src/app/home/home.page.ts

///<reference path="../../../plugins/cordova-plugin-mfp/typings/worklight.d.ts" />
import { Component, OnInit, NgZone } from '@angular/core';
import { EventsService } from '../services/events.service';
import { Event } from '../models/event.model';
import { ProcessesService } from '../services/processes.service';
import { NotificationsService } from '../services/notifications.service';
import { ModalController, AlertController, AnimationController, Platform } from '@ionic/angular';
//import { AlertController } from 'ionic-angular';
/* import { Plugins, PushNotification, PushNotificationToken, PushNotificationActionPerformed, Modals } from '@capacitor/core'; */
import { Router } from '@angular/router';

import { FCM } from 'cordova-plugin-fcm-with-dependecy-updated/ionic/ngx';
import { ViewEventPage } from '../pages/agenda/view-event/view-event.page';
import { ExpedienteDetailPage } from '../pages/gabinete-digital/expediente/expediente-detail/expediente-detail.page';
import { PublicationDetailPage } from '../pages/publications/publication-detail/publication-detail.page';
import { ViewPublicationsPage } from '../pages/publications/view-publications/view-publications.page';
import { ApproveEventModalPage } from '../pages/gabinete-digital/event-list/approve-event-modal/approve-event-modal.page';

/* const { PushNotifications, LocalNotifications, LocalNotificationAction } = Plugins; */

@Component({
  selector: 'app-home',
  templateUrl: './home.page.html',
  styleUrls: ['./home.page.scss'],
})
export class HomePage implements OnInit {
  eventsList: Event[];
  prEventList: Event[];
  mdEventList: Event[];

  totalEvent = 0;
  totalExpediente = 0;
  profile: string;

  adding: "intervenient" | "CC" = "intervenient";
  mobileComponent = {
    showAddNewEvent: false,
    showEditEvent: false,
    showEventDetails: false,
    showEventList: false,
    transparentEventList: false,
    transparentEventToApprove: false,
    showEventToApprove: false,
    showAttendees: false,
    showAttendeeModal: false
  }
  eventToaprove: any = {
    back: false,
    serialNumber: "",
    saveData: {}
  }
  selectedEvent: Event;
  postEvent: any;
  folderId: string;

  constructor(private zone: NgZone, 
    private eventService: EventsService, 
    private processesbackend: ProcessesService, 
    private router: Router, 
    private modalController: ModalController, 
    public modalCtrl: AlertController, 
    private fcm: FCM, 
    private animationController: AnimationController,
    private notificatinsservice: NotificationsService,
    private platform: Platform) {

    router.events.subscribe((val) => {
      document.querySelectorAll('ion-modal').forEach((e) => e.remove())
    });

    {
      //this.folderId = this.navParams.get('folderId');
    }

  }

  ngOnInit() {

     this.pushCordova();
    /*     //Initialize profile as mdgpr
    
        let date = new Date();
        date.setMonth(date.getMonth() + 1);
        let start = date.getFullYear()+"-"+ date.getMonth()+"-"+date.getDate()+" "+date.getHours()+":"+date.getMinutes()+ ":"+date.getSeconds();
        let end = date.getFullYear()+"-"+ date.getMonth()+"-"+date.getDate()+" 23:59:59";
    
        this.profile = "mdgpr";
        if (this.profile == "mdgpr") {
          this.eventService.getAllMdEvents(start, end).subscribe(res => {
            this.eventsList = res;
            this.totalEvent = this.eventsList.length;
          });
        }
        else {
          this.eventService.getAllPrEvents(start, end).subscribe(res => {
            this.eventsList = res;
            this.totalEvent = this.eventsList.length;
          });
    
        }
        this.processesbackend.GetTasksList("Expediente", true).subscribe(result => {
          this.totalExpediente = result;
        });
        
        */
  }
  pushCordova() {

    if(this.platform.is('desktop')) {
      console.log('Notifications not supported')
    } else {

      this.fcm.onNotification().subscribe(data => {
        this.viewEventDetail(data.IdObject)
        if (data.wasTapped === true) {
          console.log("Received in background: ", data);
  
          if (data.Service === "agenda") {
            //this.router.navigate(['/home/', service, IdObject, 'home']);
            this.viewEventDetail(data.IdObject)
          }
          else if (data.Service === "gabinete-digital" && data.Object === "expediente") {
            console.log('expediante 1')
            this.viewExpedientDetail(data.IdObject)
          }
          else if (data.Service === "gabinete-digital" && data.Object === "event-list") {
            // this.ngZone.run(() => {this.router.navigate(['/home/gabinete-digital/event-list', IdObject])}) 
            this.openApproveModal(data.IdObject);
          }
          else if (data.Service === "accoes" && data.Object === "accao") {
            this.viewPublications(data.IdObject)
            alert(data.IdObject)
          }
          else if (data.Service === "accoes" && data.Object === "publicacao") {
            this.viewPublicationDetail(data.IdObject)
          }
  
        } else {
          console.log("Received in foreground: ", data);
  
          console.log(data.Service)
          console.log(data.Object)
          console.log(data.IdObject)
        
        };
      });
    }

    

  }

  async viewEventDetail(eventId: any) {
    console.log(this.profile);

    const modal = await this.modalController.create({
      component: ViewEventPage,
      componentProps: {
        eventId: eventId,
        adding: this.adding
      },
      cssClass: 'modal  modal-desktop',
      backdropDismiss: false
    });
    await modal.present();
    modal.onDidDismiss().then((res) => {
      if (res) {
        //this.viewEventDetailDismiss(res);
      }
    });
  }

  async openApproveModal(eventSerialNumber){
    let classs;
    if( window.innerWidth <= 1024){
      classs = 'cal-modal  modal modal-desktop'
    } else  {
      classs = 'gabinete-digital-mobile-modal-to-Desktop'
    }

    const modal = await this.modalController.create({
      component: ApproveEventModalPage,
      componentProps:{
        serialNumber: eventSerialNumber,
      },
      cssClass: 'event-list',
      backdropDismiss: false
    });

    await modal.present();

    modal.onDidDismiss();
  }

  async viewExpedientDetail(serialNumber: any) {
    let classs;
    if (window.innerWidth <= 800) {
      classs = 'modal'
    } else {
      classs = 'modal modal-desktop showAsideOptions'
    }
     console.log(this.profile);
    console.log(serialNumber); 
    console.log('expediante 2')
    const modal = await this.modalController.create({
      component: ExpedienteDetailPage,
      componentProps: {
        serialNumber: serialNumber,
        profile: "MDGPR",
      },
      cssClass: classs,
    });
    await modal.present();
    modal.onDidDismiss().then((res) => {
      if (res) {
        console.log(res);
      }
    });
  }

  async viewPublicationDetail(publicationId: string) {
    const modal = await this.modalController.create({
      component: PublicationDetailPage,
      componentProps: {
        publicationId: publicationId,
        folderId: this.folderId,
      },
      cssClass: 'publication-detail',
      backdropDismiss: false
    });
    await modal.present();
    modal.onDidDismiss().then(() => {
      
    });
  }


  async viewPublications(folderId) {

    const enterAnimation = (baseEl: any) => {
      const backdropAnimation = this.animationController.create()
        .addElement(baseEl.querySelector('ion-backdrop')!)
        .fromTo('opacity', '0.01', 'var(--backdrop-opacity)');

      const wrapperAnimation = this.animationController.create()
        .addElement(baseEl.querySelector('.modal-wrapper')!)
        .keyframes([
          { offset: 0, opacity: '0', transform: 'scale(0)' },
          { offset: 1, opacity: '0.99', transform: 'scale(1)' }
        ]);

      return this.animationController.create()
        .addElement(baseEl)
        .easing('ease-out')
        .duration(500)
        .addAnimation([backdropAnimation, wrapperAnimation]);
    }

    const leaveAnimation = (baseEl: any) => {
      return enterAnimation(baseEl).direction('reverse');
    }

    const modal = await this.modalController.create({
      component: ViewPublicationsPage,
      enterAnimation,
      leaveAnimation,
      componentProps: {
        folderId: folderId,
      },
      cssClass: 'new-action',
      backdropDismiss: false
    });
    await modal.present();
    modal.onDidDismiss();
  }

 

 



}