From d9b512df45a328652ee1f540fd0eba7bdb17a3e4 Mon Sep 17 00:00:00 2001 From: leejinho Date: Mon, 24 Feb 2020 09:38:44 +0900 Subject: [PATCH] =?UTF-8?q?=ED=99=94=EC=83=81=ED=9A=8C=EC=9D=98=20?= =?UTF-8?q?=EC=83=81=EC=84=B8=EB=B3=B4=EA=B8=B0=20=ED=8C=9D=EC=97=85=20?= =?UTF-8?q?=EC=9E=91=EC=84=B1.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- .../src/lib/utils/json.util.ts | 13 ++ .../components/messages.component.html | 2 + .../components/messages.component.ts | 29 +++- .../conference-detail.dialog.component.html | 78 +++++++++++ .../conference-detail.dialog.component.scss | 125 ++++++++++++++++++ ...conference-detail.dialog.component.spec.ts | 24 ++++ .../conference-detail.dialog.component.ts | 48 +++++++ .../messenger/dialogs/conference/index.ts | 3 + .../app/layouts/messenger/dialogs/index.ts | 2 + .../event-json/video-conference.event-json.ts | 8 +- .../lib/components/message-box.component.html | 2 + .../lib/components/message-box.component.ts | 17 ++- .../video-conference.component.html | 22 +-- .../message-box/video-conference.component.ts | 16 ++- .../lib/components/messages.component.html | 2 + .../src/lib/components/messages.component.ts | 17 ++- 17 files changed, 389 insertions(+), 21 deletions(-) create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.html create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.scss create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.spec.ts create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.ts create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/index.ts diff --git a/package.json b/package.json index 8597393e..99cc477e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ucap-webmessenger", - "version": "1.0.1", + "version": "1.0.2", "author": { "name": "LG CNS", "email": "lgucap@lgcns.com" diff --git a/projects/ucap-webmessenger-api/src/lib/utils/json.util.ts b/projects/ucap-webmessenger-api/src/lib/utils/json.util.ts index 57a4aade..0dd1cc45 100644 --- a/projects/ucap-webmessenger-api/src/lib/utils/json.util.ts +++ b/projects/ucap-webmessenger-api/src/lib/utils/json.util.ts @@ -27,4 +27,17 @@ export class JsonAnalization { throw new Error('Invalid Json String'); } } + + /** + * Convert String Array from String array type Raw strings. + */ + public static convertStringToArray(str: string): string[] { + let rtnArr: string[] = []; + + try { + rtnArr = str.replace(/([\[\]"])/gi, '').split(','); + } catch (e) {} + + return rtnArr; + } } 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 11e8ab7d..f976f00c 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 @@ -214,6 +214,8 @@ (massTranslationDetail)="onMassTranslationDetail($event)" (save)="onSave($event)" (fileViewer)="onFileViewer($event)" + (conferenceDetail)="onClickConferenceDetail($event)" + (conferenceJoin)="onClickConferenceJoin($event)" (contextMenu)="onContextMenuMessage($event)" (openProfile)="onClickOpenProfile($event)" (scrollUp)="onScrollupMessages($event)" 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 1bd59ce0..fb3d708b 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 @@ -45,7 +45,8 @@ import { StickerEventJson, MassTextEventJson, TranslationEventJson, - MassTranslationEventJson + MassTranslationEventJson, + VideoConferenceEventJson } from '@ucap-webmessenger/protocol-event'; import * as AppStore from '@app/store'; @@ -128,6 +129,11 @@ import { } from '../dialogs/chat/clipboard.dialog.component'; import { AppFileService } from '@app/services/file.service'; import { FileType } from '@ucap-webmessenger/protocol-file'; +import { + ConferenceDetailDialogComponent, + ConferenceDetailDialogResult, + ConferenceDetailDialogData +} from '../dialogs/conference/conference-detail.dialog.component'; @Component({ selector: 'app-layout-messenger-messages', @@ -1197,6 +1203,27 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { ); } + /** [Event] Conference Detail View */ + onClickConferenceDetail(param: VideoConferenceEventJson) { + this.dialogService.open< + ConferenceDetailDialogComponent, + ConferenceDetailDialogData, + ConferenceDetailDialogResult + >(ConferenceDetailDialogComponent, { + width: '600px', + hasBackdrop: false, + data: { + detail: param + } + }); + } + + /** [Event] Conference Join */ + onClickConferenceJoin(param: VideoConferenceEventJson) { + // this.conferenceJoin.emit(param); + console.log('aaa', param); + } + onContextMenuMessage(params: { event: MouseEvent; message: Info; diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.html new file mode 100644 index 00000000..3e206c86 --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.html @@ -0,0 +1,78 @@ + + + + + {{ + 'conference.videoConferenceTypeNow' | translate + }} + {{ + 'conference.videoConferenceTypeNew' | translate + }} + {{ + 'conference.videoConferenceTypeUpdate' | translate + }} + {{ + 'conference.videoConferenceTypeDelete' | translate + }} + + + + + +
+
+ {{ conferenceDetail.title }} +
+
+ {{ 'conference.videoConferenceRegister' | translate}} + {{ conferenceDetail.register }} +
+
+ + + + + {{ 'conference.videoConferenceAttendee' | translate}} + + + {{ conferenceDetail.attendee }} + + + + {{ + attendee + }} + + + +
+
+ {{ 'conference.videoConferenceDate' | translate}} + {{ + conferenceDetail.startDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm' + }} + ~ + {{ + conferenceDetail.endDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm' + }} +
+
+ {{ 'conference.videoConferenceRoom' | translate}} + {{ getJoinArray(conferenceDetail.conferenceRooms) }} +
+
+
+ + + +
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.scss new file mode 100644 index 00000000..d0f9f45d --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.scss @@ -0,0 +1,125 @@ +.mat-card-header { + .mat-card-header-text { + margin: 0; + } + .btn-dialog-close { + font-size: 20px; + display: flex; + margin-left: auto; + align-self: flex-start; + color: #444444; + } +} + +.confirm-card { + min-width: 500px; + .button-farm { + text-align: right; + .mat-primary { + margin-left: 4px; + } + } +} + +.message-container { + background-color: #ffffff !important; + .message-info { + .title { + display: flex; + flex-flow: row; + align-items: center; + font-size: 18px; + font-weight: 600; + padding: 10px 0 6px; + line-height: 24px; + color: #222222; + border-bottom: 1px solid #dddddd; + .btn-menu { + margin-left: auto; + color: #333333; + } + } + .normal { + display: flex; + flex-flow: row; + align-items: center; + padding-top: 10px; + padding-bottom: 14px; + font-size: 1em; + .label { + display: inline-flex; + flex: 0 0 auto; + border-radius: 14px; + padding: 2px 10px; + margin-right: 10px; + color: #ffffff; + line-height: 20px; + width: 120px; + justify-content: center; + } + .name { + display: inline-flex; + flex: 1 1 auto; + } + } + .underline { + border-bottom: 1px solid #dddddd; + padding-bottom: 10px; + font-size: 1em; + .label { + display: inline-block; + border-radius: 14px; + padding: 2px 10px; + margin-right: 10px; + color: #ffffff; + line-height: 20px; + width: 120px; + text-align: center; + } + } + .ps { + align-items: flex-start; + } + .attachFile { + border-top: 1px solid #dddddd; + .attachFileList { + height: 80px; + li { + display: flex; + flex-flow: row; + line-height: 2em; + flex: 1 1 auto; + margin-right: 10px; + .file-name { + display: inline-flex; + flex-flow: row; + flex: 1 1 auto; + border: 1px solid red; + white-space: nowrap; + word-wrap: normal; + overflow: hidden; + margin-right: 10px; + span:last-child { + overflow: hidden; + text-overflow: ellipsis; + display: block; + width: calc(100% - 40px); + } + } + .file-size { + display: flex; + margin-left: auto; + align-self: flex-end; + flex: 0 0 auto; + } + a { + display: inline-block; + width: 20px; + height: 100%; + margin-left: 10px; + } + } + } + } + } +} diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.spec.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.spec.ts new file mode 100644 index 00000000..33209d3c --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.spec.ts @@ -0,0 +1,24 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ConferenceDetailDialogComponent } from './conference-detail.dialog.component'; + +describe('app::layouts::messenger::MessageDetailDialogComponent', () => { + let component: ConferenceDetailDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ConferenceDetailDialogComponent] + }).compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ConferenceDetailDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.ts new file mode 100644 index 00000000..7e1c13cb --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/conference-detail.dialog.component.ts @@ -0,0 +1,48 @@ +import { Component, OnInit, Inject } from '@angular/core'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; + +import { DialogService, SnackBarService } from '@ucap-webmessenger/ui'; +import { NGXLogger } from 'ngx-logger'; +import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native'; +import { TranslateService } from '@ngx-translate/core'; +import { VideoConferenceEventJson } from '@ucap-webmessenger/protocol-event'; +import { VideoConferenceContentsType } from '@ucap-webmessenger/protocol-event'; + +export interface ConferenceDetailDialogData { + detail: VideoConferenceEventJson; +} + +export interface ConferenceDetailDialogResult {} + +@Component({ + selector: 'app-layout-messenger-conference-detail', + templateUrl: './conference-detail.dialog.component.html', + styleUrls: ['./conference-detail.dialog.component.scss'] +}) +export class ConferenceDetailDialogComponent implements OnInit { + conferenceDetail: VideoConferenceEventJson; + + VideoConferenceContentsType = VideoConferenceContentsType; + + constructor( + public dialogRef: MatDialogRef< + ConferenceDetailDialogData, + ConferenceDetailDialogResult + >, + @Inject(MAT_DIALOG_DATA) public data: ConferenceDetailDialogData, + @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService, + private translateService: TranslateService + ) {} + + ngOnInit(): void { + this.conferenceDetail = this.data.detail; + } + + getJoinArray(arr: string[]): string { + return arr.join(','); + } + + onClickConfirm(): void { + this.dialogRef.close({}); + } +} diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/index.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/index.ts new file mode 100644 index 00000000..728bf381 --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/conference/index.ts @@ -0,0 +1,3 @@ +import { ConferenceDetailDialogComponent } from './conference-detail.dialog.component'; + +export const DIALOGS = [ConferenceDetailDialogComponent]; diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts index 1165cf8f..046ebdcd 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts @@ -1,5 +1,6 @@ import { DIALOGS as ACCOUNT_DIALOGS } from './account'; import { DIALOGS as CHAT_DIALOGS } from './chat'; +import { DIALOGS as CONFERENCE_DIALOGS } from './conference'; import { DIALOGS as GROUP_DIALOGS } from './group'; import { DIALOGS as MESSAGE_DIALOGS } from './message'; import { DIALOGS as NOTICE_DIALOGS } from './notice'; @@ -11,6 +12,7 @@ import { DIALOGS as SETTINGS_DIALOGS } from './settings'; export const DIALOGS = [ ...ACCOUNT_DIALOGS, ...CHAT_DIALOGS, + ...CONFERENCE_DIALOGS, ...GROUP_DIALOGS, ...MESSAGE_DIALOGS, ...NOTICE_DIALOGS, diff --git a/projects/ucap-webmessenger-protocol-event/src/lib/protocols/event-json/video-conference.event-json.ts b/projects/ucap-webmessenger-protocol-event/src/lib/protocols/event-json/video-conference.event-json.ts index 5aa209e2..1c8566db 100644 --- a/projects/ucap-webmessenger-protocol-event/src/lib/protocols/event-json/video-conference.event-json.ts +++ b/projects/ucap-webmessenger-protocol-event/src/lib/protocols/event-json/video-conference.event-json.ts @@ -10,6 +10,8 @@ export interface VideoConferenceEventJson { endDate?: string; register?: string; attendee?: string; + attendees?: string[]; + conferenceRooms?: string[]; } export const decodeVideoConferenceEventJson: EventJsonDecoder = ( @@ -19,13 +21,15 @@ export const decodeVideoConferenceEventJson: EventJsonDecoder diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.ts index 30ccd8b6..ce779012 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.ts +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.ts @@ -15,10 +15,10 @@ import { shakeAnimation } from 'angular-animations'; import { Info, EventType, - InfoResponse, EventJson, FileEventJson, - MassTranslationEventJson + MassTranslationEventJson, + VideoConferenceEventJson } from '@ucap-webmessenger/protocol-event'; import { NGXLogger } from 'ngx-logger'; import moment from 'moment'; @@ -87,6 +87,12 @@ export class MessageBoxComponent implements OnInit, AfterViewInit { type: string; }>(); + @Output() + conferenceDetail = new EventEmitter(); + + @Output() + conferenceJoin = new EventEmitter(); + @Output() contextMenu = new EventEmitter<{ event: MouseEvent; @@ -181,6 +187,13 @@ export class MessageBoxComponent implements OnInit, AfterViewInit { this.save.emit(value); } + onClickConferenceDetail(param: VideoConferenceEventJson) { + this.conferenceDetail.emit(param); + } + onClickConferenceJoin(param: VideoConferenceEventJson) { + this.conferenceJoin.emit(param); + } + /** [Event] Context Menu */ onContextMenu(event: any, message: Info) { if ( diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.html index 6005f3bf..ec975af6 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.html +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.html @@ -5,16 +5,16 @@ > - {{ 'chat.event.videoConferenceTypeNow' | translate }} + {{ 'conference.videoConferenceTypeNow' | translate }} - {{ 'chat.event.videoConferenceTypeNew' | translate }} + {{ 'conference.videoConferenceTypeNew' | translate }} - {{ 'chat.event.videoConferenceTypeUpdate' | translate }} + {{ 'conference.videoConferenceTypeUpdate' | translate }} - {{ 'chat.event.videoConferenceTypeDelete' | translate }} + {{ 'conference.videoConferenceTypeDelete' | translate }} @@ -22,19 +22,19 @@
  • {{ message.sentMessageJson.register }}
  • {{ message.sentMessageJson.attendee }}
  • {{ message.sentMessageJson.startDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm' @@ -45,18 +45,18 @@
- + diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.ts index 6c22e637..b940fd4d 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.ts +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; import { VideoConferenceContentsType } from '@ucap-webmessenger/protocol-event'; import { VideoConferenceEventJson, @@ -14,13 +14,23 @@ export class VideoConferenceComponent implements OnInit { @Input() message: Info; + @Output() + conferenceDetail = new EventEmitter(); + + @Output() + conferenceJoin = new EventEmitter(); + VideoConferenceContentsType = VideoConferenceContentsType; constructor() {} ngOnInit() {} - onClickDetailView() {} + onClickDetailView() { + this.conferenceDetail.emit(this.message.sentMessageJson); + } - onClickEnjoyConference() {} + onClickEnjoyConference() { + this.conferenceJoin.emit(this.message.sentMessageJson); + } } diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html index 4265eaa4..f9ac8ef3 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html @@ -75,6 +75,8 @@ (massTranslationDetail)="onMassTranslationDetail($event)" (fileViewer)="onFileViewer($event)" (save)="onSave($event)" + (conferenceDetail)="onClickConferenceDetail($event)" + (conferenceJoin)="onClickConferenceJoin($event)" (contextMenu)="onContextMenu($event)" > diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts index 4e91d191..7dd1837c 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts @@ -19,7 +19,8 @@ import { InfoResponse, EventJson, FileEventJson, - MassTranslationEventJson + MassTranslationEventJson, + VideoConferenceEventJson } from '@ucap-webmessenger/protocol-event'; import { LoginResponse } from '@ucap-webmessenger/protocol-authentication'; import { UserInfo, RoomInfo, RoomType } from '@ucap-webmessenger/protocol-room'; @@ -94,6 +95,10 @@ export class MessagesComponent implements OnInit, OnDestroy { type: string; }>(); @Output() + conferenceDetail = new EventEmitter(); + @Output() + conferenceJoin = new EventEmitter(); + @Output() contextMenu = new EventEmitter<{ event: MouseEvent; message: Info; @@ -663,6 +668,16 @@ export class MessagesComponent implements OnInit, OnDestroy { this.save.emit(value); } + /** [Event] Conference Detail View */ + onClickConferenceDetail(param: VideoConferenceEventJson) { + this.conferenceDetail.emit(param); + } + + /** [Event] Conference Join */ + onClickConferenceJoin(param: VideoConferenceEventJson) { + this.conferenceJoin.emit(param); + } + /** [Event] Context Menu */ onContextMenu(event: { event: MouseEvent;