import {Component, ElementRef, EventEmitter, Inject, Input, OnInit, Output, ViewChild} from '@angular/core';
import HostRecord from '../../../structures/HostRecord';
import {ApiService} from '../../../service/api.service';
import {AlertController} from '@ionic/angular';
import {Observable} from 'rxjs';
import { APP_BASE_HREF } from '@angular/common';

@Component({
  selector: 'editor-files',
  templateUrl: './files.component.html',
  styleUrls: ['./files.component.scss'],
})
export class FilesComponent implements OnInit {
  @Input() readonly = false;
  @Input() hostRecord: HostRecord;
  @Output() hostRecordChange = new EventEmitter<HostRecord>();
  @Output() requestParentSave = new EventEmitter<FilesComponent>();
  @Output() requestParentDelete = new EventEmitter<FilesComponent>();
  @ViewChild('uploadForm', {static: false}) uploadForm: ElementRef;

  public fileRecords: Array<any> = [];
  public pendingSetup = true;
  public dbRecord: any = {};

  constructor(
      protected api: ApiService,
      protected alerts: AlertController,
      @Inject(APP_BASE_HREF) private baseHref: string
  ) { }

  ngOnInit() {
    this.getInitObservable().subscribe(() => {

    });
  }

  getApiSubmit() {
    return this.api._build_url(`file/upload/${this.hostRecord.PageId}/${this.hostRecord.UUID}/${this.hostRecord.Value.Value}`);
  }

  onSubmitClick() {
    if ( this.readonly ) {
      return;
    }

    this.uploadForm.nativeElement.submit();
  }

  getReturnUrl() {
    return `${this.baseHref}editor;id=${this.hostRecord.PageId}`;
  }

  downloadFile(fileRecord) {
    // tslint:disable-next-line:max-line-length
    window.open(this.api._build_url(`files/${this.hostRecord.PageId}/${this.hostRecord.UUID}/get/${this.hostRecord.Value.Value}/${fileRecord._id}`), '_blank');
  }

  async onDestroyClick() {
    if ( this.readonly ) {
      return;
    }

    const alert = await this.alerts.create({
      header: 'Are you sure?',
      message: 'You are about to delete these files. This action cannot be undone.',
      buttons: [
        {
          text: 'Keep Them',
          role: 'cancel',
        },
        {
          text: 'Delete Them',
          handler: async () => {
            this.api.post(`/files/${this.hostRecord.PageId}/${this.hostRecord.UUID}/delete/${this.hostRecord.Value.Value}`)
                .subscribe(res => {
              this.requestParentDelete.emit(this);
            });
          },
        },
      ],
    });

    await alert.present();
  }

  getInitObservable(): Observable<any> {
    return new Observable<any>(sub => {
      if ( this.hostRecord && this.pendingSetup ) {
        if ( !this.hostRecord.Value ) {
          this.hostRecord.Value = {};
        }

        if ( !this.hostRecord.Value.Value && !this.readonly ) {
          this.api.post(`/files/${this.hostRecord.PageId}/${this.hostRecord.UUID}/create`).subscribe(res => {
            this.dbRecord = res.data;
            this.fileRecords = res.data.files;
            this.hostRecord.Value.Mode = 'files';
            this.hostRecord.Value.Value = res.data.UUID;
            this.hostRecord.value = res.data.UUID;
            this.hostRecordChange.emit(this.hostRecord);
            this.pendingSetup = false;
            sub.next(true);
            sub.complete();
          });
        } else {
          this.api.get(`/files/${this.hostRecord.PageId}/${this.hostRecord.UUID}/get/${this.hostRecord.Value.Value}`).subscribe(res => {
            this.fileRecords = res.data.files;
            this.pendingSetup = false;
            sub.next(true);
            sub.complete();
          });
        }
      } else {
        this.pendingSetup = true;
      }
    });
  }

}