diff --git a/projects/ucap-webmessenger-app/src/app/layouts/common/dialogs/file-viewer.dialog.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/common/dialogs/file-viewer.dialog.component.ts index 489bd5fc..f56ba5fa 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/common/dialogs/file-viewer.dialog.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/common/dialogs/file-viewer.dialog.component.ts @@ -3,18 +3,10 @@ import { Component, OnInit, OnDestroy, Inject } from '@angular/core'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; import { NGXLogger } from 'ngx-logger'; import { FileEventJson } from '@ucap-webmessenger/protocol-event'; -import { DeviceType, FileUtil, MimeUtil } from '@ucap-webmessenger/core'; -import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native'; -import { take, map, finalize, tap } from 'rxjs/operators'; -import { - SnackBarService, - AlertSnackbarComponent, - AlertSnackbarData -} from '@ucap-webmessenger/ui'; +import { DeviceType } from '@ucap-webmessenger/core'; import { FileDownloadItem } from '@ucap-webmessenger/api'; import { CommonApiService } from '@ucap-webmessenger/api-common'; -import { TranslateService } from '@ngx-translate/core'; -import { FileProtocolService } from '@ucap-webmessenger/protocol-file'; +import { AppFileService } from '@app/services/file.service'; export interface FileViewerDialogData { fileInfo: FileEventJson; @@ -46,11 +38,8 @@ export class FileViewerDialogComponent implements OnInit, OnDestroy { FileViewerDialogResult >, @Inject(MAT_DIALOG_DATA) public data: FileViewerDialogData, - @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService, - private translateService: TranslateService, - private snackBarService: SnackBarService, private commonApiService: CommonApiService, - private fileProtocolService: FileProtocolService, + private appFileService: AppFileService, private logger: NGXLogger ) { this.fileInfo = data.fileInfo; @@ -75,93 +64,17 @@ export class FileViewerDialogComponent implements OnInit, OnDestroy { ngOnDestroy(): void {} onDownload(fileDownloadItem: FileDownloadItem): void { - this.commonApiService - .fileTalkDownload( - { - userSeq: this.userSeq, - deviceType: this.deviceType, - token: this.token, - attachmentsSeq: this.fileInfo.attachmentSeq, - fileDownloadItem - }, - this.downloadUrl - ) - .pipe( - take(1), - map(async rawBlob => { - const mimeType = MimeUtil.getMimeFromExtension(this.fileInfo.fileExt); - const blob = rawBlob.slice(0, rawBlob.size, mimeType); - - FileUtil.fromBlobToBuffer(blob) - .then(buffer => { - /** download check */ - this.fileProtocolService - .downCheck({ - seq: this.fileInfo.attachmentSeq - }) - .pipe(take(1)) - .subscribe(); - - this.nativeService - .saveFile(buffer, this.fileInfo.fileName, mimeType) - .then(result => { - if (!!result) { - this.snackBarService.open( - this.translateService.instant( - 'common.file.results.savedToPath', - { - path: result - } - ), - '', - { - duration: 3000, - verticalPosition: 'bottom' - } - ); - } else { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - } - }) - .catch(reason => { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - }); - }) - .catch(reason => { - this.logger.error('download', reason); - }); - }), - finalize(() => { - setTimeout(() => { - fileDownloadItem.downloadingProgress$ = undefined; - }, 1000); - }) - ) - .subscribe(); + this.appFileService.fileTalkDownlod({ + req: { + userSeq: this.userSeq, + deviceType: this.deviceType, + token: this.token, + attachmentsSeq: this.fileInfo.attachmentSeq, + fileDownloadItem + }, + fileName: this.fileInfo.fileName, + fileDownloadUrl: this.downloadUrl + }); } onClosedViewer(): void { diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts index 7bbecb02..dfeb0203 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts @@ -8,9 +8,7 @@ import { EventEmitter, Inject, ChangeDetectorRef, - ChangeDetectionStrategy, - ElementRef, - NgZone + ChangeDetectionStrategy } from '@angular/core'; import { ucapAnimations, @@ -24,20 +22,11 @@ import { AlertDialogData, AlertDialogResult, FileUploadQueueComponent, - StringUtil, - AlertSnackbarComponent, - AlertSnackbarData + StringUtil } from '@ucap-webmessenger/ui'; import { Store, select } from '@ngrx/store'; import { NGXLogger } from 'ngx-logger'; -import { - Observable, - Subscription, - forkJoin, - combineLatest, - of, - BehaviorSubject -} from 'rxjs'; +import { Observable, Subscription, forkJoin, of, BehaviorSubject } from 'rxjs'; import { Info, @@ -78,7 +67,7 @@ import { RoomType, UserInfoShort } from '@ucap-webmessenger/protocol-room'; -import { tap, take, map, catchError, finalize } from 'rxjs/operators'; +import { take, map, catchError } from 'rxjs/operators'; import { FormComponent as UCapUiChatFormComponent, MessagesComponent as UCapUiChatMessagesComponent @@ -108,7 +97,7 @@ import { FileViewerDialogData, FileViewerDialogResult } from '@app/layouts/common/dialogs/file-viewer.dialog.component'; -import { FileUtil, StickerFilesInfo, MimeUtil } from '@ucap-webmessenger/core'; +import { FileUtil, StickerFilesInfo } from '@ucap-webmessenger/core'; import { StatusCode } from '@ucap-webmessenger/api'; import { @@ -131,12 +120,13 @@ import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native'; import { TranslateService } from '@ngx-translate/core'; import { TranslatePipe } from 'projects/ucap-webmessenger-ui/src/lib/pipes/translate.pipe'; import { TranslateService as UiTranslateService } from '@ucap-webmessenger/ui'; -import { FileProtocolService } from '@ucap-webmessenger/protocol-file'; + import { ClipboardDialogComponent, ClipboardDialogData, ClipboardDialogResult } from '../dialogs/chat/clipboard.dialog.component'; +import { AppFileService } from '@app/services/file.service'; @Component({ selector: 'app-layout-messenger-messages', @@ -241,7 +231,6 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { private sessionStorageService: SessionStorageService, private localStorageService: LocalStorageService, private commonApiService: CommonApiService, - private fileProtocolService: FileProtocolService, private clipboardService: ClipboardService, private uiTranslateService: UiTranslateService, private translateService: TranslateService, @@ -249,7 +238,7 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { private dialogService: DialogService, private snackBarService: SnackBarService, @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService, - private ngZone: NgZone, + private appFileService: AppFileService, private logger: NGXLogger ) { this.sessionVerInfo = this.sessionStorageService.get( @@ -1052,103 +1041,17 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { }, savePath?: string ) { - this.commonApiService - .fileTalkDownload({ + this.appFileService.fileTalkDownlod({ + req: { userSeq: this.loginResSubject.value.userSeq, deviceType: this.environmentsInfo.deviceType, token: this.loginResSubject.value.tokenString, attachmentsSeq: value.fileInfo.attachmentSeq, fileDownloadItem: value.fileDownloadItem - }) - .pipe( - take(1), - map(async rawBlob => { - const mimeType = MimeUtil.getMimeFromExtension( - FileUtil.getExtension(value.fileInfo.fileName) - ); - const blob = rawBlob.slice(0, rawBlob.size, mimeType); - - FileUtil.fromBlobToBuffer(blob) - .then(buffer => { - /** download check */ - this.fileProtocolService - .downCheck({ - seq: value.fileInfo.attachmentSeq - }) - .pipe(take(1)) - .subscribe(); - - this.nativeService - .saveFile(buffer, value.fileInfo.fileName, mimeType, savePath) - .then(result => { - if (!!result) { - const snackBarRef = this.snackBarService.open( - this.translateService.instant( - 'common.file.results.savedToPath', - { - path: result - } - ), - this.translateService.instant('common.file.open'), - { - duration: 3000, - verticalPosition: 'bottom', - horizontalPosition: 'center' - } - ); - - snackBarRef.onAction().subscribe(() => { - this.ngZone.runOutsideAngular(() => { - this.nativeService - .openTargetItem(result) - .catch(reason => { - this.logger.warn(reason); - }); - }); - }); - } else { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - } - }) - .catch(reason => { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - }); - }) - .catch(reason => { - this.logger.error('download', reason); - }); - }), - finalize(() => { - setTimeout(() => { - value.fileDownloadItem.downloadingProgress$ = undefined; - }, 1000); - }) - ) - .subscribe(); + }, + fileName: value.fileInfo.fileName, + savePath + }); } async onFileSelected(fileUploadItems: FileUploadItem[]) { diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.ts index e8fc9e0d..2a579ef2 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.ts @@ -9,15 +9,14 @@ import { import { FileInfo, FileDownloadInfo, - FileType, - FileProtocolService + FileType } from '@ucap-webmessenger/protocol-file'; import { Subscription, combineLatest } from 'rxjs'; import { Store, select } from '@ngrx/store'; import * as AppStore from '@app/store'; -import { tap, map, take, finalize } from 'rxjs/operators'; -import { FileUtil, MimeUtil } from '@ucap-webmessenger/core'; +import { tap } from 'rxjs/operators'; +import { FileUtil } from '@ucap-webmessenger/core'; import { CommonApiService } from '@ucap-webmessenger/api-common'; import { LoginResponse } from '@ucap-webmessenger/protocol-authentication'; import { SessionStorageService } from '@ucap-webmessenger/web-storage'; @@ -30,15 +29,10 @@ import { import { VersionInfo2Response } from '@ucap-webmessenger/api-public'; import { UCAP_NATIVE_SERVICE, NativeService } from '@ucap-webmessenger/native'; import { NGXLogger } from 'ngx-logger'; -import { - SnackBarService, - AlertSnackbarComponent, - AlertSnackbarData -} from '@ucap-webmessenger/ui'; import { FileDownloadItem } from '@ucap-webmessenger/api'; import { ModuleConfig } from '@ucap-webmessenger/api-common'; import { _MODULE_CONFIG } from 'projects/ucap-webmessenger-api-common/src/lib/config/token'; -import { TranslateService } from '@ngx-translate/core'; +import { AppFileService } from '@app/services/file.service'; export interface FileInfoTotal { info: FileInfo; @@ -78,10 +72,8 @@ export class AlbumBoxComponent implements OnInit, OnDestroy { private store: Store, private sessionStorageService: SessionStorageService, private commonApiService: CommonApiService, - private fileProtocolService: FileProtocolService, - private translateService: TranslateService, - private snackBarService: SnackBarService, @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService, + private appFileService: AppFileService, @Inject(_MODULE_CONFIG) private moduleConfig: ModuleConfig, private logger: NGXLogger ) { @@ -229,92 +221,16 @@ export class AlbumBoxComponent implements OnInit, OnDestroy { } onClickDownload(fileInfo: FileInfoTotal) { - this.commonApiService - .fileTalkDownload({ + this.appFileService.fileTalkDownlod({ + req: { userSeq: this.loginRes.userSeq, deviceType: this.environmentsInfo.deviceType, token: this.loginRes.tokenString, attachmentsSeq: fileInfo.info.seq, fileDownloadItem: fileInfo.fileDownloadItem - }) - .pipe( - take(1), - map(async rawBlob => { - const mimeType = MimeUtil.getMimeFromExtension( - FileUtil.getExtension(fileInfo.info.name) - ); - const blob = rawBlob.slice(0, rawBlob.size, mimeType); - - FileUtil.fromBlobToBuffer(blob) - .then(buffer => { - /** download check */ - this.fileProtocolService - .downCheck({ - seq: fileInfo.info.seq - }) - .pipe(take(1)) - .subscribe(); - - this.nativeService - .saveFile(buffer, fileInfo.info.name, mimeType) - .then(result => { - if (!!result) { - this.snackBarService.open( - this.translateService.instant( - 'common.file.results.savedToPath', - { - path: result - } - ), - '', - { - duration: 3000, - verticalPosition: 'bottom' - } - ); - } else { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - } - }) - .catch(reason => { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - }); - }) - .catch(reason => { - this.logger.error('download', reason); - }); - }), - finalize(() => { - setTimeout(() => { - fileInfo.fileDownloadItem.downloadingProgress$ = undefined; - }, 1000); - }) - ) - .subscribe(); + }, + fileName: fileInfo.info.name + }); } onClickDownloadAll(): void { diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.ts index 54ae3229..844eea06 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.ts @@ -3,16 +3,16 @@ import { MatPaginator, MatTableDataSource, MatSort } from '@angular/material'; import { FileInfo, FileDownloadInfo, - FileType, - FileProtocolService + FileType } from '@ucap-webmessenger/protocol-file'; import { Subscription, combineLatest } from 'rxjs'; import { Store, select } from '@ngrx/store'; import * as AppStore from '@app/store'; import * as EventStore from '@app/store/messenger/event'; -import { tap, map, take, finalize } from 'rxjs/operators'; -import { FileUtil, MimeUtil } from '@ucap-webmessenger/core'; + +import { tap } from 'rxjs/operators'; +import { FileUtil } from '@ucap-webmessenger/core'; import { LoginResponse } from '@ucap-webmessenger/protocol-authentication'; import { SessionStorageService } from '@ucap-webmessenger/web-storage'; import { KEY_LOGIN_RES_INFO } from '@app/types/login-res-info.type'; @@ -20,16 +20,12 @@ import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native'; import { NGXLogger } from 'ngx-logger'; import { FileDownloadItem } from '@ucap-webmessenger/api'; import { - SnackBarService, DialogService, ConfirmDialogComponent, ConfirmDialogResult, ConfirmDialogData, - DateOptions, - AlertSnackbarComponent, - AlertSnackbarData + DateOptions } from '@ucap-webmessenger/ui'; -import { CommonApiService } from '@ucap-webmessenger/api-common'; import { EventType } from '@ucap-webmessenger/protocol-event'; import { CreateChatDialogComponent, @@ -43,6 +39,7 @@ import { } from '@app/types'; import { RoomInfo } from '@ucap-webmessenger/protocol-room'; import { TranslateService } from '@ngx-translate/core'; +import { AppFileService } from '@app/services/file.service'; export interface FileInfoTotal { info: FileInfo; @@ -78,11 +75,9 @@ export class FileBoxComponent implements OnInit, OnDestroy { constructor( private store: Store, private sessionStorageService: SessionStorageService, - private commonApiService: CommonApiService, - private fileProtocolService: FileProtocolService, private translateService: TranslateService, - private snackBarService: SnackBarService, @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService, + private appFileService: AppFileService, private dialogService: DialogService, private logger: NGXLogger ) { @@ -259,92 +254,16 @@ export class FileBoxComponent implements OnInit, OnDestroy { } onClickDownload(fileInfo: FileInfoTotal) { - this.commonApiService - .fileTalkDownload({ + this.appFileService.fileTalkDownlod({ + req: { userSeq: this.loginRes.userSeq, deviceType: this.environmentsInfo.deviceType, token: this.loginRes.tokenString, attachmentsSeq: fileInfo.info.seq, fileDownloadItem: fileInfo.fileDownloadItem - }) - .pipe( - take(1), - map(async rawBlob => { - const mimeType = MimeUtil.getMimeFromExtension( - FileUtil.getExtension(fileInfo.info.name) - ); - const blob = rawBlob.slice(0, rawBlob.size, mimeType); - - FileUtil.fromBlobToBuffer(blob) - .then(buffer => { - /** download check */ - this.fileProtocolService - .downCheck({ - seq: fileInfo.info.seq - }) - .pipe(take(1)) - .subscribe(); - - this.nativeService - .saveFile(buffer, fileInfo.info.name, mimeType) - .then(result => { - if (!!result) { - this.snackBarService.open( - this.translateService.instant( - 'common.file.results.savedToPath', - { - path: result - } - ), - '', - { - duration: 3000, - verticalPosition: 'bottom' - } - ); - } else { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - } - }) - .catch(reason => { - this.snackBarService.openFromComponent< - AlertSnackbarComponent, - AlertSnackbarData - >(AlertSnackbarComponent, { - data: { - html: this.translateService.instant( - 'common.file.errors.failToSave' - ), - buttonText: this.translateService.instant( - 'common.file.errors.label' - ) - } - }); - }); - }) - .catch(reason => { - this.logger.error('download', reason); - }); - }), - finalize(() => { - setTimeout(() => { - fileInfo.fileDownloadItem.downloadingProgress$ = undefined; - }, 1000); - }) - ) - .subscribe(); + }, + fileName: fileInfo.info.name + }); } onClickDownloadAll(): void { diff --git a/projects/ucap-webmessenger-app/src/app/services/file.service.ts b/projects/ucap-webmessenger-app/src/app/services/file.service.ts new file mode 100644 index 00000000..4723184c --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/services/file.service.ts @@ -0,0 +1,128 @@ +import { Injectable, Inject, NgZone } from '@angular/core'; +import { + FileTalkDownloadRequest, + CommonApiService +} from '@ucap-webmessenger/api-common'; +import { map, take, finalize, catchError } from 'rxjs/operators'; +import { MimeUtil, FileUtil } from '@ucap-webmessenger/core'; +import { FileProtocolService } from '@ucap-webmessenger/protocol-file'; +import { UCAP_NATIVE_SERVICE, NativeService } from '@ucap-webmessenger/native'; +import { + SnackBarService, + AlertSnackbarComponent, + AlertSnackbarData +} from '@ucap-webmessenger/ui'; +import { TranslateService } from '@ngx-translate/core'; +import { NGXLogger } from 'ngx-logger'; +import { of } from 'rxjs'; + +@Injectable({ + providedIn: 'root' +}) +export class AppFileService { + constructor( + private commonApiService: CommonApiService, + private fileProtocolService: FileProtocolService, + @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService, + private snackBarService: SnackBarService, + private translateService: TranslateService, + private ngZone: NgZone, + private logger: NGXLogger + ) {} + + fileTalkDownlod(param: { + req: FileTalkDownloadRequest; + fileName: string; + fileDownloadUrl?: string; + savePath?: string; + }) { + const req = param.req; + const fileName = param.fileName; + const fileDownloadItem = req.fileDownloadItem; + const fileDownloadUrl = param.fileDownloadUrl; + const savePath = param.savePath; + + const fileTalkDownloadError = (reason: any) => { + this.logger.warn(reason); + this.snackBarService.openFromComponent< + AlertSnackbarComponent, + AlertSnackbarData + >(AlertSnackbarComponent, { + data: { + html: this.translateService.instant('common.file.errors.failToSave'), + buttonText: this.translateService.instant('common.file.errors.label') + } + }); + }; + + this.commonApiService + .fileTalkDownload(req, fileDownloadUrl) + .pipe( + take(1), + map(rawBlob => { + const mimeType = MimeUtil.getMimeFromExtension( + FileUtil.getExtension(fileName) + ); + const blob = rawBlob.slice(0, rawBlob.size, mimeType); + FileUtil.fromBlobToBuffer(blob) + .then(buffer => { + /** download check */ + this.fileProtocolService + .downCheck({ + seq: req.attachmentsSeq + }) + .pipe(take(1)) + .subscribe(); + + this.nativeService + .saveFile(buffer, fileName, mimeType, savePath) + .then(filePath => { + if (!!filePath) { + const snackBarRef = this.snackBarService.open( + this.translateService.instant( + 'common.file.results.savedToPath', + { + path: filePath + } + ), + this.translateService.instant('common.file.open'), + { + duration: 3000, + verticalPosition: 'bottom', + horizontalPosition: 'center' + } + ); + + snackBarRef.onAction().subscribe(() => { + this.ngZone.runOutsideAngular(() => { + this.nativeService + .openTargetItem(filePath) + .catch(reason => { + this.logger.warn(reason); + }); + }); + }); + } else { + fileTalkDownloadError('fail'); + } + }) + .catch(reason => { + fileTalkDownloadError(reason); + }); + }) + .catch(reason => { + fileTalkDownloadError(reason); + }); + }), + finalize(() => { + if (!!fileDownloadItem) { + setTimeout(() => { + fileDownloadItem.downloadingProgress$ = undefined; + }, 1000); + } + }), + catchError(error => of(error)) + ) + .subscribe(); + } +} diff --git a/projects/ucap-webmessenger-app/src/app/services/index.ts b/projects/ucap-webmessenger-app/src/app/services/index.ts index 699b607c..fc7e460b 100644 --- a/projects/ucap-webmessenger-app/src/app/services/index.ts +++ b/projects/ucap-webmessenger-app/src/app/services/index.ts @@ -3,11 +3,13 @@ import { AppAuthenticationService } from './authentication.service'; import { AppLoaderService } from './loader.service'; import { AppNotificationService } from './notification.service'; import { AppNativeService } from './native.service'; +import { AppFileService } from './file.service'; export const SERVICES = [ AppService, AppAuthenticationService, AppLoaderService, AppNotificationService, - AppNativeService + AppNativeService, + AppFileService ]; diff --git a/projects/ucap-webmessenger-app/src/app/store/messenger/chat/actions.ts b/projects/ucap-webmessenger-app/src/app/store/messenger/chat/actions.ts index b4f100f2..ac7f6f1a 100644 --- a/projects/ucap-webmessenger-app/src/app/store/messenger/chat/actions.ts +++ b/projects/ucap-webmessenger-app/src/app/store/messenger/chat/actions.ts @@ -1,10 +1,16 @@ import { createAction, props } from '@ngrx/store'; -import { Info, EventJson } from '@ucap-webmessenger/protocol-event'; +import { + Info, + EventJson, + FileEventJson +} from '@ucap-webmessenger/protocol-event'; import { MassTalkDownloadRequest, - MassTalkDownloadResponse + MassTalkDownloadResponse, + FileTalkDownloadRequest } from '@ucap-webmessenger/api-common'; import { RightDrawer } from '@app/types'; +import { FileDownloadItem } from '@ucap-webmessenger/api'; export const selectedRoom = createAction( '[Messenger::Chat] selectedRoom', diff --git a/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/image-viewer.component.ts b/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/image-viewer.component.ts index 2ab1e41c..be3ab5ce 100644 --- a/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/image-viewer.component.ts +++ b/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/image-viewer.component.ts @@ -4,8 +4,8 @@ import { Input, Output, EventEmitter, - ElementRef, - ViewChild + ChangeDetectorRef, + ChangeDetectionStrategy } from '@angular/core'; import { ucapAnimations } from '../../animations'; import { FileEventJson } from '@ucap-webmessenger/protocol-event'; @@ -15,7 +15,8 @@ import { FileDownloadItem } from '@ucap-webmessenger/api'; selector: 'ucap-image-viewer', templateUrl: './image-viewer.component.html', styleUrls: ['./image-viewer.component.scss'], - animations: ucapAnimations + animations: ucapAnimations, + changeDetection: ChangeDetectionStrategy.OnPush }) export class ImageViewerComponent implements OnInit { @Input() @@ -37,7 +38,7 @@ export class ImageViewerComponent implements OnInit { zoomRatio = 100; - constructor() {} + constructor(private changeDetectorRef: ChangeDetectorRef) {} ngOnInit() { this.naturalWidth = this.fileInfo.imageWidth; @@ -54,9 +55,10 @@ export class ImageViewerComponent implements OnInit { } onLoadFileDownloadUrl(img: HTMLImageElement) { - console.log('onLoadFileDownloadUrl', img.naturalWidth, img.naturalHeight); this.naturalWidth = img.naturalWidth; this.naturalHeight = img.naturalHeight; + + this.changeDetectorRef.detectChanges(); } onClickZoomOut() { @@ -64,14 +66,20 @@ export class ImageViewerComponent implements OnInit { return; } this.zoomRatio -= 10; + + this.changeDetectorRef.detectChanges(); } onClickZoomIn() { if (180 <= this.zoomRatio) { return; } this.zoomRatio += 10; + + this.changeDetectorRef.detectChanges(); } onClickZoomReset() { this.zoomRatio = 100; + + this.changeDetectorRef.detectChanges(); } }