diff --git a/projects/ucap-webmessenger-api-common/src/lib/models/file-upload-item.ts b/projects/ucap-webmessenger-api-common/src/lib/models/file-upload-item.ts
index 25fbbf69..0239627b 100644
--- a/projects/ucap-webmessenger-api-common/src/lib/models/file-upload-item.ts
+++ b/projects/ucap-webmessenger-api-common/src/lib/models/file-upload-item.ts
@@ -13,11 +13,14 @@ export class FileUploadItem {
this.file = file;
}
- static fromFiles(files: File[]): FileUploadItem[] {
+ static fromFiles(files: FileList): FileUploadItem[] {
const fileItems: FileUploadItem[] = [];
- for (const file of files) {
- fileItems.push(new FileUploadItem(file));
+
+ // tslint:disable-next-line: prefer-for-of
+ for (let i = 0; i < files.length; i++) {
+ fileItems.push(new FileUploadItem(files[i]));
}
+
return fileItems;
}
diff --git a/projects/ucap-webmessenger-api-common/src/lib/services/common-api.service.ts b/projects/ucap-webmessenger-api-common/src/lib/services/common-api.service.ts
index 46dfe58a..600935df 100644
--- a/projects/ucap-webmessenger-api-common/src/lib/services/common-api.service.ts
+++ b/projects/ucap-webmessenger-api-common/src/lib/services/common-api.service.ts
@@ -142,8 +142,15 @@ export class CommonApiService {
);
}
- public acceptableExtensionForFileTalk(extension: string): boolean {
- return -1 !== this.moduleConfig.acceptableFileExtensions.indexOf(extension);
+ public acceptableExtensionForFileTalk(extensions: string[]): boolean {
+ for (const extension of extensions) {
+ if (
+ -1 === this.moduleConfig.acceptableFileExtensions.indexOf(extension)
+ ) {
+ return false;
+ }
+ }
+ return true;
}
public fileTalkShare(
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html
index 4b643ac4..8b09b433 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html
@@ -113,6 +113,7 @@
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 2327dcf5..20f78302 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
@@ -386,6 +386,11 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
onFileSelected(fileUploadItems: FileUploadItem[]) {
this.logger.debug('onFileSelected', fileUploadItems);
+ const info = {
+ senderSeq: this.loginRes.userSeq,
+ roomSeq: this.roomInfo.roomSeq
+ };
+
const allObservables: Observable[] = [];
for (const fileUploadItem of fileUploadItems) {
@@ -424,9 +429,9 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
for (const res of resList) {
this.store.dispatch(
EventStore.send({
- senderSeq: this.loginRes.userSeq,
+ senderSeq: info.senderSeq,
req: {
- roomSeq: this.roomInfo.roomSeq,
+ roomSeq: info.roomSeq,
eventType: EventType.File,
sentMessage: res.returnJson
}
@@ -434,7 +439,9 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
);
}
},
- error => {},
+ error => {
+ this.logger.debug('onFileSelected error', error);
+ },
() => {
this.fileUploadQueue.onUploadComplete();
}
diff --git a/projects/ucap-webmessenger-core/src/lib/utils/file.util.ts b/projects/ucap-webmessenger-core/src/lib/utils/file.util.ts
new file mode 100644
index 00000000..6cfa31f0
--- /dev/null
+++ b/projects/ucap-webmessenger-core/src/lib/utils/file.util.ts
@@ -0,0 +1,16 @@
+const regFileExtension = /(?:\.([^.]+))?$/;
+
+export class FileUtil {
+ static getExtension(fileName: string): string | undefined {
+ return regFileExtension.exec(fileName)[1];
+ }
+
+ static getExtensions(fileList: FileList): string[] {
+ const extensions: string[] = [];
+ // tslint:disable-next-line: prefer-for-of
+ for (let i = 0; i < fileList.length; i++) {
+ extensions.push(FileUtil.getExtension(fileList[i].name));
+ }
+ return extensions;
+ }
+}
diff --git a/projects/ucap-webmessenger-core/src/public-api.ts b/projects/ucap-webmessenger-core/src/public-api.ts
index e23278e6..b426d4aa 100644
--- a/projects/ucap-webmessenger-core/src/public-api.ts
+++ b/projects/ucap-webmessenger-core/src/public-api.ts
@@ -20,4 +20,5 @@ export * from './lib/types/status-code.type';
export * from './lib/types/status-type.type';
export * from './lib/types/video-conference-type.type';
+export * from './lib/utils/file.util';
export * from './lib/utils/string.util';
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.ts
index 85a384e2..08215862 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.ts
@@ -55,17 +55,16 @@ export class FormComponent implements OnInit {
}
onChangeFileInput() {
- const files: File[] = [];
- for (let i = 0; i < this.fileInput.nativeElement.files.length; i++) {
- files.push(this.fileInput.nativeElement.files.item(i));
- }
-
- const fileUploadItems = FileUploadItem.fromFiles(files);
+ const fileUploadItems = FileUploadItem.fromFiles(
+ this.fileInput.nativeElement.files
+ );
if (!!this.fileUploadQueue) {
this.fileUploadQueue.onFileSelected(fileUploadItems);
}
this.sendFiles.emit(fileUploadItems);
+
+ this.fileInput.nativeElement.value = '';
}
}
diff --git a/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.ts b/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.ts
index cf7143bb..1d1ef39a 100644
--- a/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.ts
+++ b/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.ts
@@ -17,6 +17,9 @@ import { FileUploadItem } from '@ucap-webmessenger/api-common';
styleUrls: ['./file-upload-queue.component.scss']
})
export class FileUploadQueueComponent implements OnInit, AfterViewInit {
+ @Input()
+ dropZoneIncludeParent = false;
+
fileUploadItems: FileUploadItem[];
uploadItems: DataTransferItem[];
@@ -90,11 +93,17 @@ export class FileUploadQueueComponent implements OnInit, AfterViewInit {
private changeStyleDisplay(show: boolean): void {
if (show || (!!this.fileUploadItems && 0 < this.fileUploadItems.length)) {
- this.elementRef.nativeElement.parentElement.style.display = '';
- // this.elementRef.nativeElement.style.display = '';
+ if (this.dropZoneIncludeParent) {
+ this.elementRef.nativeElement.parentElement.style.display = '';
+ } else {
+ this.elementRef.nativeElement.style.display = '';
+ }
} else {
- this.elementRef.nativeElement.parentElement.style.display = 'none';
- // this.elementRef.nativeElement.style.display = 'none';
+ if (this.dropZoneIncludeParent) {
+ this.elementRef.nativeElement.parentElement.style.display = 'none';
+ } else {
+ this.elementRef.nativeElement.style.display = 'none';
+ }
}
}
diff --git a/projects/ucap-webmessenger-ui/src/lib/directives/file-upload-for.directive.ts b/projects/ucap-webmessenger-ui/src/lib/directives/file-upload-for.directive.ts
index 62fb4c11..f14c79e0 100644
--- a/projects/ucap-webmessenger-ui/src/lib/directives/file-upload-for.directive.ts
+++ b/projects/ucap-webmessenger-ui/src/lib/directives/file-upload-for.directive.ts
@@ -10,7 +10,11 @@ import {
import { NGXLogger } from 'ngx-logger';
import { FileUploadQueueComponent } from '../components/file-upload-queue.component';
-import { FileUploadItem } from '@ucap-webmessenger/api-common';
+import {
+ FileUploadItem,
+ CommonApiService
+} from '@ucap-webmessenger/api-common';
+import { FileUtil } from '@ucap-webmessenger/core';
@Directive({
selector: 'input[ucapFileUploadFor], div[ucapFileUploadFor]'
@@ -33,7 +37,11 @@ export class FileUploadForDirective implements AfterViewInit {
dragOver = false;
- constructor(private elementRef: ElementRef, private logger: NGXLogger) {}
+ constructor(
+ private commonApiService: CommonApiService,
+ private elementRef: ElementRef,
+ private logger: NGXLogger
+ ) {}
ngAfterViewInit(): void {}
@@ -93,7 +101,22 @@ export class FileUploadForDirective implements AfterViewInit {
if (!this.isFileDrag(event.dataTransfer)) {
return;
}
- const files = event.dataTransfer.files;
+ const files: FileList = event.dataTransfer.files;
+
+ if (
+ !this.commonApiService.acceptableExtensionForFileTalk(
+ FileUtil.getExtensions(files)
+ )
+ ) {
+ this.logger.debug('window:drop not acceptable');
+ if (!!this.fileUploadQueue) {
+ this.fileUploadQueue.onDragLeave();
+ }
+ this.elementRef.nativeElement.value = '';
+ this.dragOver = false;
+ return;
+ }
+
const fileUploadItems = FileUploadItem.fromFiles(files);
this.fileSelected.emit(fileUploadItems);
event.preventDefault();