저장 / 다른이름저장 기능 분리 > openViewer 클릭영역 분리

2020-01-03 15:52:19 +09:00 · 2020-01-03 15:52:19 +09:00 · 6c565e800f
commit 6c565e800f
parent 9b7f2f60f1
17 changed files with 196 additions and 27 deletions
--- a/electron-projects/ucap-webmessenger-electron/src/index.ts
+++ b/electron-projects/ucap-webmessenger-electron/src/index.ts
@ -513,15 +513,18 @@ ipcMain.on(
      const buffer: Buffer = args[0];
      const fileName: string = args[1];
      const mimeType: string = args[2];
+      const customSavePath: string = args[3];
      let savePath: string = path.join(
-        !!args[3]
-          ? args[3]
-          : !!appStorage.downloadPath
+        !!appStorage.downloadPath
          ? appStorage.downloadPath
          : app.getPath('downloads'),
        fileName
      );
+      if (!!customSavePath) {
+        savePath = customSavePath;
+      } else {
        savePath = await FileUtil.uniqueFileName(savePath);
+      }

      fse.writeFile(savePath, buffer, err => {
        if (!err) {
@ -594,6 +597,20 @@ ipcMain.on(
  }
 );

+ipcMain.on(
+  FileChannel.SelectSaveFilePath,
+  (event: IpcMainEvent, ...args: any[]) => {
+    dialog
+      .showSaveDialog({ defaultPath: args[0] })
+      .then(obj => {
+        event.returnValue = obj.filePath;
+      })
+      .catch(obj => {
+        event.returnValue = undefined;
+      });
+  }
+);
+
 ipcMain.on(
  IdleStateChannel.StartCheck,
  (event: IpcMainEvent, ...args: any[]) => {
--- 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
@ -105,11 +105,17 @@ export class FileViewerDialogComponent implements OnInit, OnDestroy {
                      }
                    );
                  } else {
-                    this.snackBarService.open('파일 저장에 실패하였습니다.');
+                    this.snackBarService.open(
+                      '파일 저장에 실패하였습니다.',
+                      '확인'
+                    );
                  }
                })
                .catch(reason => {
-                  this.snackBarService.open('파일 저장에 실패하였습니다.');
+                  this.snackBarService.open(
+                    '파일 저장에 실패하였습니다.',
+                    '확인'
+                  );
                });
            })
            .catch(reason => {
--- 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
@ -5,7 +5,8 @@ import {
  ViewChild,
  AfterViewInit,
  Output,
-  EventEmitter
+  EventEmitter,
+  Inject
 } from '@angular/core';
 import {
  ucapAnimations,
@ -58,7 +59,7 @@ import {
  KEY_STICKER_HISTORY
 } from '@app/types';
 import { RoomInfo, UserInfo, RoomType } from '@ucap-webmessenger/protocol-room';
-import { tap, take, map, catchError } from 'rxjs/operators';
+import { tap, take, map, catchError, finalize } from 'rxjs/operators';
 import {
  FileInfo,
  FormComponent as UCapUiChatFormComponent
@ -70,7 +71,7 @@ import {
  MatSnackBarRef,
  SimpleSnackBar
 } from '@angular/material';
-import { FileUploadItem } from '@ucap-webmessenger/api';
+import { FileUploadItem, FileDownloadItem } from '@ucap-webmessenger/api';
 import {
  CommonApiService,
  FileTalkSaveRequest,
@ -88,7 +89,7 @@ import {
  FileViewerDialogData,
  FileViewerDialogResult
 } from '@app/layouts/common/dialogs/file-viewer.dialog.component';
-import { FileUtil, StickerFilesInfo } from '@ucap-webmessenger/core';
+import { FileUtil, StickerFilesInfo, MimeUtil } from '@ucap-webmessenger/core';
 import { PerfectScrollbarComponent } from 'ngx-perfect-scrollbar';
 import { StatusCode } from '@ucap-webmessenger/api';
 import {
@ -107,6 +108,7 @@ import {
  MassDetailComponent,
  MassDetailDialogData
 } from '../dialogs/chat/mass-detail.component';
+import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native';

@Component({
  selector: 'app-layout-messenger-messages',
@ -204,6 +206,7 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
    private clipboardService: ClipboardService,
    private dialogService: DialogService,
    private snackBarService: SnackBarService,
+    @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService,
    private logger: NGXLogger
  ) {
    this.sessionVerInfo = this.sessionStorageService.get<VersionInfo2Response>(
@ -844,8 +847,29 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
  }

  /** File Save, Save As */
-  onSave(value: { fileInfo: FileInfo; type: string }) {
+  onSave(value: {
+    fileInfo: FileEventJson;
+    fileDownloadItem: FileDownloadItem;
+    type: string;
+  }) {
    this.logger.debug('fileSave', value);
+    if (value.type === 'saveAs') {
+      this.nativeService
+        .selectSaveFilePath(value.fileInfo.fileName)
+        .then(result => {
+          console.log(result);
+          if (!!result && result.length > 0) {
+            this.saveFile(value, result);
+          } else {
+            this.snackBarService.open('저장경로 지정에 실패하였습니다.', '확인');
+          }
+        })
+        .catch(reason => {
+          this.snackBarService.open('저장경로 지정에 실패하였습니다.', '확인');
+        });
+    } else {
+      this.saveFile(value);
+    }
  }

  onFileDragEnter(items: DataTransferItemList) {
@ -861,6 +885,65 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
    this.logger.debug('onFileDragLeave');
  }

+  saveFile(
+    value: {
+      fileInfo: FileEventJson;
+      fileDownloadItem: FileDownloadItem;
+      type: string;
+    },
+    savePath?: string
+  ) {
+    this.commonApiService
+      .fileTalkDownload({
+        userSeq: this.loginRes.userSeq,
+        deviceType: this.environmentsInfo.deviceType,
+        token: this.loginRes.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 => {
+              this.nativeService
+                .saveFile(buffer, value.fileInfo.fileName, mimeType, savePath)
+                .then(result => {
+                  if (!!result) {
+                    this.snackBarService.open(
+                      `파일이 경로[${result}]에 저장되었습니다.`,
+                      '',
+                      {
+                        duration: 3000,
+                        verticalPosition: 'bottom'
+                      }
+                    );
+                  } else {
+                    this.snackBarService.open('파일 저장에 실패하였습니다.', '확인');
+                  }
+                })
+                .catch(reason => {
+                  this.snackBarService.open('파일 저장에 실패하였습니다.', '확인');
+                });
+            })
+            .catch(reason => {
+              this.logger.error('download', reason);
+            });
+        }),
+        finalize(() => {
+          setTimeout(() => {
+            value.fileDownloadItem.downloadingProgress$ = undefined;
+          }, 1000);
+        })
+      )
+      .subscribe();
+  }
+
  async onFileSelected(fileUploadItems: FileUploadItem[]) {
    this.logger.debug('onFileSelected', fileUploadItems);
    this.clearView();
--- 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
@ -239,11 +239,17 @@ export class AlbumBoxComponent implements OnInit, OnDestroy {
                      }
                    );
                  } else {
-                    this.snackBarService.open('파일 저장에 실패하였습니다.');
+                    this.snackBarService.open(
+                      '파일 저장에 실패하였습니다.',
+                      '확인'
+                    );
                  }
                })
                .catch(reason => {
-                  this.snackBarService.open('파일 저장에 실패하였습니다.');
+                  this.snackBarService.open(
+                    '파일 저장에 실패하였습니다.',
+                    '확인'
+                  );
                });
            })
            .catch(reason => {
--- 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
@ -275,11 +275,17 @@ export class FileBoxComponent implements OnInit, OnDestroy {
                      }
                    );
                  } else {
-                    this.snackBarService.open('파일 저장에 실패하였습니다.');
+                    this.snackBarService.open(
+                      '파일 저장에 실패하였습니다.',
+                      '확인'
+                    );
                  }
                })
                .catch(reason => {
-                  this.snackBarService.open('파일 저장에 실패하였습니다.');
+                  this.snackBarService.open(
+                    '파일 저장에 실패하였습니다.',
+                    '확인'
+                  );
                });
            })
            .catch(reason => {
--- a/projects/ucap-webmessenger-app/src/app/services/authentication.service.ts
+++ b/projects/ucap-webmessenger-app/src/app/services/authentication.service.ts
@ -68,7 +68,7 @@ export class AppAuthenticationService {
            ...environment.productConfig.defaultSettings.chat,
            downloadPath: `${await this.nativeService.getPath(
              'documents'
-            )}/LG UCAP downloads`
+            )}/Messenger downloads`
          }
        }
      };
--- a/projects/ucap-webmessenger-native-browser/src/lib/services/browser-native.service.ts
+++ b/projects/ucap-webmessenger-native-browser/src/lib/services/browser-native.service.ts
@ -185,6 +185,12 @@ export class BrowserNativeService extends NativeService {
    });
  }

+  selectSaveFilePath(defaultPath?: string): Promise<string> {
+    return new Promise<string>((resolve, reject) => {
+      resolve('');
+    });
+  }
+
  windowStateChanged(): Observable<WindowState> {
    return new Observable<WindowState>(subscriber => {
      try {
--- a/projects/ucap-webmessenger-native-electron/src/lib/services/electron-native.service.ts
+++ b/projects/ucap-webmessenger-native-electron/src/lib/services/electron-native.service.ts
@ -304,6 +304,18 @@ export class ElectronNativeService implements NativeService {
    });
  }

+  selectSaveFilePath(defaultPath?: string): Promise<string> {
+    return new Promise<string>((resolve, reject) => {
+      try {
+        resolve(
+          this.ipcRenderer.sendSync(FileChannel.SelectSaveFilePath, defaultPath)
+        );
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
+
  windowStateChanged(): Observable<WindowState> {
    if (!this.windowStateChangedSubject) {
      this.windowStateChangedSubject = new Subject<WindowState>();
--- a/projects/ucap-webmessenger-native-electron/src/lib/types/channel.type.ts
+++ b/projects/ucap-webmessenger-native-electron/src/lib/types/channel.type.ts
@ -35,7 +35,8 @@ export enum FileChannel {
  SaveFile = 'UCAP::file::saveFile',
  ReadFile = 'UCAP::file::readFile',
  GetPath = 'UCAP::file::getPath',
-  SelectDirectory = 'UCAP::file::selectDirectory'
+  SelectDirectory = 'UCAP::file::selectDirectory',
+  SelectSaveFilePath = 'UCAP::file::SelectSaveFilePath'
 }

 export enum WindowStateChannel {
--- a/projects/ucap-webmessenger-native/src/lib/services/native.service.ts
+++ b/projects/ucap-webmessenger-native/src/lib/services/native.service.ts
@ -58,6 +58,7 @@ export abstract class NativeService {
  abstract openTargetItem(filePath?: string): Promise<boolean>;
  abstract getPath(name: NativePathName): Promise<string>;
  abstract selectDirectory(): Promise<string>;
+  abstract selectSaveFilePath(defaultPath?: string): Promise<string>;

  abstract windowStateChanged(): Observable<WindowState>;
  abstract windowClose(): void;
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.html
@ -1,4 +1,4 @@
-<div class="bubble-main">
+<div class="bubble-main" (click)="onClickOpenViewer()">
  <!--파일명에 따라 doc exe hwp ppt xls zip 으로 추가되고 나머지 파일 명은 file로 기간이 만료된 파일은 그뒤에 disable도 추가-->
  <!-- <div class="file-img" [ngClass]="fileInfo.FileExt"></div> -->
  <div [ngClass]="['mime-icon', 'light', 'ico-' + fileInfo.fileExt]">
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.ts
@ -15,6 +15,8 @@ export class AttachFileComponent implements OnInit {

  @Output()
  save = new EventEmitter<string>();
+  @Output()
+  openViewer = new EventEmitter();

  constructor(private logger: NGXLogger) {}

@ -26,4 +28,7 @@ export class AttachFileComponent implements OnInit {
  onClickSaveAs() {
    this.save.emit('saveAs');
  }
+  onClickOpenViewer() {
+    this.openViewer.emit();
+  }
 }
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.html
@ -6,7 +6,7 @@
    *ngSwitchCase="FileType.File"
    [fileInfo]="fileInfo"
    [expired]="getExpiredFile()"
-    (click)="onClickFileViewer(fileInfo)"
+    (openViewer)="onClickFileViewer(fileInfo)"
    (save)="onSave($event)"
  >
  </ucap-chat-message-box-attach-file>
@ -14,7 +14,7 @@
    *ngSwitchCase="FileType.Sound"
    [fileInfo]="fileInfo"
    [expired]="getExpiredFile()"
-    (click)="onClickFileViewer(fileInfo)"
+    (openViewer)="onClickFileViewer(fileInfo)"
    (save)="onSave($event)"
  >
  </ucap-chat-message-box-attach-file>
@ -28,7 +28,8 @@
    *ngSwitchCase="FileType.Video"
    [fileInfo]="fileInfo"
    [expired]="getExpiredFile()"
-    (click)="onClickFileViewer(fileInfo)"
+    (openViewer)="onClickFileViewer(fileInfo)"
+    (save)="onSave($event)"
  ></ucap-chat-message-box-video>
  <ucap-chat-message-box-text
    *ngSwitchDefault
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/file.component.ts
@ -4,7 +4,7 @@ import {
  InfoResponse,
  FileEventJson
 } from '@ucap-webmessenger/protocol-event';
-import { StatusCode } from '@ucap-webmessenger/api';
+import { StatusCode, FileDownloadItem } from '@ucap-webmessenger/api';
 import { FileType } from '@ucap-webmessenger/protocol-file';
 import { NGXLogger } from 'ngx-logger';

@ -20,11 +20,16 @@ export class FileComponent implements OnInit {
  eventInfoStatus: InfoResponse;

  @Output()
-  save = new EventEmitter<{ fileInfo: FileEventJson; type: string }>();
+  save = new EventEmitter<{
+    fileInfo: FileEventJson;
+    fileDownloadItem: FileDownloadItem;
+    type: string;
+  }>();
  @Output()
  fileViewer = new EventEmitter<FileEventJson>();

  fileInfo?: FileEventJson;
+  fileDownloadItem: FileDownloadItem;
  errorMessage?: string;
  FileType = FileType;

@ -37,6 +42,8 @@ export class FileComponent implements OnInit {
      this.errorMessage =
        this.message.sentMessageJson.errorMessage || '[Error] System Error!!';
    }
+
+    this.fileDownloadItem = new FileDownloadItem();
  }

  getExpiredFile() {
@ -58,7 +65,11 @@ export class FileComponent implements OnInit {

  onSave(value: string) {
    if (!this.getExpiredFile()) {
-      this.save.emit({ fileInfo: this.fileInfo, type: value });
+      this.save.emit({
+        fileInfo: this.fileInfo,
+        fileDownloadItem: this.fileDownloadItem,
+        type: value
+      });
    }
  }
 }
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.html
@ -1,4 +1,4 @@
-<div class="bubble-main">
+<div class="bubble-main" (click)="onClickOpenViewer()">
  <div class="file-thumbimg">
    <img *ngIf="!!fileInfo.thumbUrl" [src]="fileInfo.thumbUrl" />
  </div>
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.ts
@ -15,6 +15,8 @@ export class VideoComponent implements OnInit {

  @Output()
  save = new EventEmitter<string>();
+  @Output()
+  openViewer = new EventEmitter();

  constructor(private logger: NGXLogger) {}

@ -26,4 +28,7 @@ export class VideoComponent implements OnInit {
  onClickSaveAs() {
    this.save.emit('saveAs');
  }
+  onClickOpenViewer() {
+    this.openViewer.emit();
+  }
 }
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts
@ -14,6 +14,7 @@ import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
 import { FileInfo } from '../models/file-info.json';
 import { DatePipe } from '@angular/common';
 import moment from 'moment';
+import { FileDownloadItem } from '@ucap-webmessenger/api';

@Component({
  selector: 'ucap-chat-messages',
@ -67,7 +68,11 @@ export class MessagesComponent implements OnInit {
  @Output()
  fileViewer = new EventEmitter<FileEventJson>();
  @Output()
-  save = new EventEmitter<{ fileInfo: FileInfo; type: string }>();
+  save = new EventEmitter<{
+    fileInfo: FileEventJson;
+    fileDownloadItem: FileDownloadItem;
+    type: string;
+  }>();
  @Output()
  contextMenu = new EventEmitter<{
    event: MouseEvent;
@ -233,7 +238,11 @@ export class MessagesComponent implements OnInit {
  }

  /** [Event] Attach File Save & Save As */
-  onSave(value: { fileInfo: FileInfo; type: string }) {
+  onSave(value: {
+    fileInfo: FileEventJson;
+    fileDownloadItem: FileDownloadItem;
+    type: string;
+  }) {
    this.save.emit(value);
  }