//Importing the libraaries
import { Component, OnInit, Input } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { ThirdPartyDraggable } from '@fullcalendar/interaction';
import { DialogService, DynamicDialogConfig } from 'primeng/api';

//Importing the service classes
import { ContactService } from '../../../shared/service/contact.service';


class ImageSnippet {
  constructor(public src: string, public file: File) { }
}

@Component({
  selector: 'app-contact-avatar-upload',
  templateUrl: './contact-avatar-upload.component.html',
  styleUrls: ['./contact-avatar-upload.component.scss']
})
export class ContactAvatarUploadComponent implements OnInit {

  // Upload Avatar
  ulpoadAvatar: string;

  // Image file
  selectedFile: ImageSnippet;

  // File Id
  fileId: number;

  // Contact Id
  contactId: number;

  imageUrl: string;

  

  constructor(private contactService: ContactService, private router: Router, public dialogService: DialogService
    , public config: DynamicDialogConfig, private route: ActivatedRoute,) { }

  ngOnInit() {
    //Getting the image url and setting it
    if(this.config.data['imageUrl']){
      this.imageUrl = this.config.data['imageUrl'];
      this.contactId = this.config.data['contactId'];      
    }
    
  }

  // Close Popup
  Cancel() {
    this.dialogService.dialogComponentRef.instance.close();
  }

  // Update New Avatar
  Update() {
    if (this.ulpoadAvatar != null && this.ulpoadAvatar != undefined) {
      const frmData = new FormData();
      frmData.append("fileUpload", this.ulpoadAvatar);
      if(this.contactId == null && this.contactId == undefined) {
        /** get parameter contactId */
        this.route.paramMap.subscribe(params => {
          this.contactId = +params.get("contactId")
        });
      }

      this.contactService.UpdateAvatar(frmData, this.contactId).subscribe(
        data => {
          this.fileId = +data;

          // move to ocr dispay page        
          this.dialogService.dialogComponentRef.instance.close();
        }
      );
    }
  }

  // Upload Avatar
  Upload(event: any): void {

    let files = event.target.files;

    if (files) {
      for (let file of files) {
        let reader = new FileReader();
        reader.onload = (e: any) => {
          this.imageUrl = e.target.result;
        }
        reader.readAsDataURL(file);
      }
    }

    this.ulpoadAvatar = event.target.files[0];

  }



}