import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; import { ucapAnimations } from '../../animations'; import { FileEventJson } from '@ucap-webmessenger/protocol-event'; import { DeviceType, FileUtil, MimeUtil } from '@ucap-webmessenger/core'; import { CommonApiService, FileDownloadItem } from '@ucap-webmessenger/api-common'; import { take, map } from 'rxjs/operators'; @Component({ selector: 'ucap-image-viewer', templateUrl: './image-viewer.component.html', styleUrls: ['./image-viewer.component.scss'], animations: ucapAnimations }) export class ImageViewerComponent implements OnInit { @Input() fileInfo: FileEventJson; @Input() downloadUrl: string; @Input() userSeq: number; @Input() deviceType: DeviceType; @Input() token: string; @Output() closed = new EventEmitter(); imageSrc: string | ArrayBuffer; fileDownloadItem: FileDownloadItem; constructor(private commonApiService: CommonApiService) { this.fileDownloadItem = new FileDownloadItem(); } ngOnInit() { this.commonApiService .fileTalkDownload( { userSeq: this.userSeq, deviceType: this.deviceType, token: this.token, attachmentsSeq: this.fileInfo.attachmentSeq, fileDownloadItem: this.fileDownloadItem }, this.downloadUrl ) .pipe( take(1), map(async blob => { const b = blob.slice( 0, blob.size, MimeUtil.getMimeFromExtension(this.fileInfo.fileExt) ); this.imageSrc = await FileUtil.toDataUrl(b); }) ) .subscribe(); } onClickClose(): void { this.closed.emit(); } }