org.eclipse.mdm.nucleus/org.eclipse.mdm.application/src/main/webapp/src/app/file-explorer/components/file-link-editor-dialog/file-link-editor-dialog.component.ts

/********************************************************************************
 * Copyright (c) 2015-2018 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License v. 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0.
 *
 * SPDX-License-Identifier: EPL-2.0
 *
 ********************************************************************************/

import { Component, OnInit, ViewChild, ElementRef} from '@angular/core';
import { ConfirmationService, DynamicDialogRef, DynamicDialogConfig } from 'primeng/api';
import { TranslateService } from '@ngx-translate/core';

import { MDMLink } from '@navigator/node';

import { FileUploadRow } from '../../model/file-explorer.model';
import { FileReaderService } from '../../services/file-reader.service';
import { ContextFilesService } from '../../services/context-files.service';
import { FileService } from '../../services/file.service';
import { ContextAttributeIdentifier } from '@details/model/details.model';
import { FileSizePipe } from '@file-explorer/pipes/file-size.pipe';

@Component({
  selector: 'mdm5-file-link-editor-dialog',
  templateUrl: './file-link-editor-dialog.component.html',
  styleUrls: ['../file-explorer.css'],
  providers: [ConfirmationService]
})
export class FileLinkEditorDialogComponent implements OnInit {

  @ViewChild('fileinput') input: ElementRef;

  public ident: ContextAttributeIdentifier;
  public link: MDMLink;
  public file: File;

  // private translationSub: Subscription;

  constructor(private translateService: TranslateService,
              private contextFilesService: ContextFilesService,
              private confirmationService: ConfirmationService,
              private fileReaderService: FileReaderService,
              private fileService: FileService,
              public ref: DynamicDialogRef,
              public config: DynamicDialogConfig,
              private fileSizePipe: FileSizePipe) {}

  ngOnInit() {
    if (this.config != undefined) {
      this.ident = this.config.data.ident as ContextAttributeIdentifier;
    }
    this.link = this.getLink();
    this.loadSizeLazy();
  }

  public onUpload(event: Event) {
    this.input.nativeElement.click();
  }

  private loadSizeLazy() {
    if (this.link != undefined && Object.keys(this.link).length !== 0) {
      this.contextFilesService.loadFileSize(this.link, this.ident)
        .subscribe(fileSize => this.link.size = fileSize.size);
    }
  }

  // listener to add files to upload selection
  public onSelectFileForUpload(event: Event) {
    const target = event.target as HTMLInputElement;
    const files: FileList =  target.files;
    for (let i = 0; i < files.length; i++) {
      this.file = files[i];
      const l = new MDMLink();
      l.description = this.file.name;
      l.mimeType = this.file.type || 'application/octet-stream';
      l.size = this.fileSizePipe.transform(this.file.size);
      this.link = l;
    }
  }

  private getLink() {
    if (this.ident != undefined && this.ident.attribute != undefined) {
      const value = this.ident.attribute.value[this.ident.contextGroup];
      // if (value != undefined && value !== '') {
        return Object.assign(new MDMLink(), value as MDMLink);
      // }
    }
  }

  // // listener to load blob from db and initialize download dialog for saving file to local filesystem.
  // public onDownloadFile(event: Event) {
  //   // const link = this.getLink();
  //   if (this.link != undefined && this.ident.contextComponent != undefined && this.ident.contextGroup != undefined) {
  //     this.contextFilesService.loadFile(this.link, this.ident).subscribe(blob => FileSaver.saveAs(blob, this.link.getFileName()));
  //   }
  // }

  // // listener for file preview
  // public onPreviewFile(event: Event) {
  //   // const link = this.getLink();
  //   if (this.link != undefined && this.ident.contextComponent != undefined && this.ident.contextGroup != undefined) {
  //     this.contextFilesService.loadFile(this.link, this.ident)
  //                             .subscribe(blob => this.preview(blob));
  //   }
  // }

  // // handle preview for different browsers. Opens download dialog if preview not possible.
  // private preview(blob: Blob) {
  //   // const link = this.getLink();
  //   if (this.link != undefined) {
  //     if (window.navigator && window.navigator.msSaveOrOpenBlob) {
  //         window.navigator.msSaveOrOpenBlob(blob, this.link.getFileName());
  //     } else {
  //         window.open(URL.createObjectURL(blob), this.link.getFileName());
  //     }
  //   }
  // }

  // listener for delete file button. Opens confirm dialog.
  public onDeleteFile(event: Event) {
    this.translateService.get('file-explorer.file-explorer.msg-confirm-delete-file-from-db')
      .subscribe(msg =>
        this.confirmationService.confirm({
          message: msg,
          key: 'filePopUpConfirmation',
          accept: () => this.deleteFileConfirmed()
        })
      );
  }

  // Actually triggers file delete from db, when confirmed in delete dialog
  private deleteFileConfirmed() {
    const link = this.getLink();
    if (link != undefined) {
      this.contextFilesService.deleteFile(link, this.ident).subscribe(l => this.handleDelete(l));
    }
    this.ref.close();
  }

  /**
   * Handles delete.
   * @param link the deleted link
   */
  private handleDelete(link: MDMLink) {
    this.ident.attribute.value[this.ident.contextGroup] = undefined;
  }

  private handleUplaod(link: MDMLink) {
    this.ident.attribute.value[this.ident.contextGroup] = link;
  }

  public async onSave(event: Event) {
    if (this.file != undefined && this.link.remotePath == undefined) {
      const dataUrl = await this.fileReaderService.readFile(this.file);
      const row = new FileUploadRow(this.file, this.link.description, dataUrl);
      this.contextFilesService.uploadFile(row, this.ident).subscribe(link => this.handleUplaod(link));
    } else {
      this.ident.attribute.value[this.ident.contextGroup] = this.link;
    }
    this.ref.close();
  }

  public onCancel(event: Event) {
    this.ref.close();
  }
}