From 47ff1d3e4a1afe098e41e1dce51d7ea89742dff7 Mon Sep 17 00:00:00 2001 From: leejinho Date: Wed, 20 Nov 2019 14:57:54 +0900 Subject: [PATCH 1/5] =?UTF-8?q?=EA=B8=B0=EB=8A=A5=EC=B6=94=EA=B0=80=20::?= =?UTF-8?q?=20=ED=94=84=EB=A1=9C=ED=95=84=20>=20=EC=A6=90=EA=B2=A8?= =?UTF-8?q?=EC=B0=BE=EA=B8=B0=20=EB=93=B1=EB=A1=9D/=ED=95=B4=EC=A0=9C,=20?= =?UTF-8?q?=EB=8F=99=EB=A3=8C=EC=B6=94=EA=B0=80=20/=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../profile/profile.dialog.component.html | 2 + .../profile/profile.dialog.component.ts | 112 ++++++-- .../src/app/store/messenger/sync/actions.ts | 13 + .../src/app/store/messenger/sync/effects.ts | 52 +++- .../src/lib/components/profile.component.html | 266 +++++++++++++----- .../src/lib/components/profile.component.ts | 37 ++- 6 files changed, 395 insertions(+), 87 deletions(-) diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html index e906db4c..c8ab5d39 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html @@ -5,5 +5,7 @@ [isBuddy]="isBuddy" [isFavorit]="isFavorit" (openChat)="onClickChat($event)" + (toggleFavorit)="onClickToggleFavorit($event)" + (toggleBuddy)="onClickToggleBuddy($event)" > diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts index a2e96594..e387083b 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Inject, ViewChild } from '@angular/core'; +import { Component, OnInit, Inject, ViewChild, OnDestroy } from '@angular/core'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; import { KEY_LOGIN_RES_INFO } from '@app/types/login-res-info.type'; import { KEY_VER_INFO } from '@app/types/ver-info.type'; @@ -7,17 +7,20 @@ import { SessionStorageService } from '@ucap-webmessenger/web-storage'; import { Store, select } from '@ngrx/store'; import * as AppStore from '@app/store'; import * as ChatStore from '@app/store/messenger/chat'; +import * as SyncStore from '@app/store/messenger/sync'; -import { UserInfo } from '@ucap-webmessenger/protocol-sync'; +import { UserInfo, GroupDetailData } from '@ucap-webmessenger/protocol-sync'; import { UserInfoSS, UserInfoF, UserInfoDN } from '@ucap-webmessenger/protocol-query'; -import { DialogService } from '@ucap-webmessenger/ui'; +import { DialogService, ConfirmDialogComponent, ConfirmDialogData, ConfirmDialogResult } from '@ucap-webmessenger/ui'; import { VersionInfo2Response } from '@ucap-webmessenger/api-public'; import { LoginResponse } from '@ucap-webmessenger/protocol-authentication'; import { map } from 'rxjs/operators'; +import { Subscription } from 'rxjs'; +import { SelectGroupDialogComponent, SelectGroupDialogData, SelectGroupDialogResult } from '../group/select-group.dialog.component'; export interface ProfileDialogData { userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN; @@ -30,13 +33,15 @@ export interface ProfileDialogResult {} templateUrl: './profile.dialog.component.html', styleUrls: ['./profile.dialog.component.scss'] }) -export class ProfileDialogComponent implements OnInit { +export class ProfileDialogComponent implements OnInit, OnDestroy { loginRes: LoginResponse; sessionVerinfo: VersionInfo2Response; isMe: boolean; isBuddy: boolean; isFavorit: boolean; + selectAllBuddy2Subscription: Subscription; + constructor( public dialogRef: MatDialogRef, @Inject(MAT_DIALOG_DATA) public data: ProfileDialogData, @@ -55,18 +60,26 @@ export class ProfileDialogComponent implements OnInit { ngOnInit() { this.isMe = this.loginRes.userSeq === this.data.userInfo.seq; - this.store.pipe( - select(AppStore.MessengerSelector.SyncSelector.selectAllBuddy2), - map(buddyList => { - const users = buddyList.filter( - buddy => buddy.seq === this.data.userInfo.seq - ); - this.isBuddy = users.length > 0; - if (this.isBuddy) { - this.isFavorit = users[0].isFavorit; - } - }) - ); + this.selectAllBuddy2Subscription = this.store + .pipe( + select(AppStore.MessengerSelector.SyncSelector.selectAllBuddy2), + map(buddyList => { + const users = buddyList.filter( + buddy => buddy.seq === this.data.userInfo.seq + ); + this.isBuddy = users.length > 0; + if (this.isBuddy) { + this.isFavorit = users[0].isFavorit; + } + }) + ) + .subscribe(); + } + + ngOnDestroy(): void { + if (!!this.selectAllBuddy2Subscription) { + this.selectAllBuddy2Subscription.unsubscribe(); + } } onClickChat(userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN) { @@ -80,4 +93,71 @@ export class ProfileDialogComponent implements OnInit { this.dialogRef.close(); } + + onClickToggleFavorit(param: { + userInfo: UserInfo | UserInfoF; + isFavorit: boolean; + }) { + this.store.dispatch( + SyncStore.updateBuddy({ + seq: param.userInfo.seq, + isFavorit: param.isFavorit + }) + ); + } + + async onClickToggleBuddy(param: { + userInfo: UserInfo | UserInfoF; + isBuddy: boolean; + }) { + if (param.isBuddy) { + // 동료추가. + const result = await this.dialogService.open< + SelectGroupDialogComponent, + SelectGroupDialogData, + SelectGroupDialogResult + >(SelectGroupDialogComponent, { + width: '600px', + data: { + title: 'Group Select' + } + }); + + if (!!result && !!result.choice && result.choice) { + if (!!result.group) { + const oldGroup: GroupDetailData = result.group; + const trgtUserSeq: number[] = []; + result.group.userSeqs.map(seq => trgtUserSeq.push(seq)); + trgtUserSeq.push(param.userInfo.seq); + + this.store.dispatch( + SyncStore.updateGroupMember({ + oldGroup, + trgtUserSeq + }) + ); + } + } + } else { + // 동료삭제. + const result = await this.dialogService.open< + ConfirmDialogComponent, + ConfirmDialogData, + ConfirmDialogResult + >(ConfirmDialogComponent, { + width: '360px', + data: { + title: 'Delete Buddy', + html: `[${param.userInfo.name} ${param.userInfo.grade}]를 그룹에서 삭제하시겠습니까?
프로필에서 삭제하면 모든 그룹에서 삭제됩니다.` + } + }); + + if (!!result && !!result.choice && result.choice) { + this.store.dispatch( + SyncStore.delBuddyAndClear({ seq: param.userInfo.seq }) + ); + this.isBuddy = false + } + } + } } diff --git a/projects/ucap-webmessenger-app/src/app/store/messenger/sync/actions.ts b/projects/ucap-webmessenger-app/src/app/store/messenger/sync/actions.ts index 64dc4e1a..31d326b9 100644 --- a/projects/ucap-webmessenger-app/src/app/store/messenger/sync/actions.ts +++ b/projects/ucap-webmessenger-app/src/app/store/messenger/sync/actions.ts @@ -176,6 +176,19 @@ export const delBuddyFailure = createAction( '[Messenger::Sync] Buddy Del Failure', props<{ error: any }>() ); +/** 동료 삭제 및 그룹 클리어.(in profile) */ +export const delBuddyAndClear = createAction( + '[Messenger::Sync] Buddy Del and Group Clear', + props<{ seq: number }>() +); +export const delBuddyAndClearSuccess = createAction( + '[Messenger::Sync] Buddy Del and Group Clear Success', + props() +); +export const delBuddyAndClearFailure = createAction( + '[Messenger::Sync] Buddy Del and Group Clear Failure', + props<{ error: any }>() +); /** 동료 변경(즐겨찾기) */ export const updateBuddy = createAction( '[Messenger::Sync] Buddy Update', diff --git a/projects/ucap-webmessenger-app/src/app/store/messenger/sync/effects.ts b/projects/ucap-webmessenger-app/src/app/store/messenger/sync/effects.ts index a9938e06..a279bc19 100644 --- a/projects/ucap-webmessenger-app/src/app/store/messenger/sync/effects.ts +++ b/projects/ucap-webmessenger-app/src/app/store/messenger/sync/effects.ts @@ -1,4 +1,3 @@ -import { openTimer } from './../room/actions'; import { Injectable } from '@angular/core'; import { Actions, ofType, createEffect } from '@ngrx/effects'; @@ -48,7 +47,8 @@ import { updateGroupMember, delGroup, delGroupFailure, - delGroupSuccess + delGroupSuccess, + delBuddyAndClear } from './actions'; import { SessionStorageService } from '@ucap-webmessenger/web-storage'; import { LoginInfo, KEY_LOGIN_INFO } from '@app/types'; @@ -727,6 +727,54 @@ export class Effects { ) ); + delBuddyAndClear$ = createEffect( + () => { + return this.actions$.pipe( + ofType(delBuddyAndClear), + withLatestFrom( + this.store.pipe( + select( + (state: any) => + state.messenger.sync.group2.entities as Dictionary< + GroupDetailData + > + ) + ) + ), + tap(([req, groupList]) => { + // tslint:disable-next-line: forin + for (const key in groupList) { + const group: GroupDetailData = groupList[key]; + if (group.userSeqs.indexOf(req.seq) > -1) { + // Group Clear.. + this.store.dispatch( + updateGroup({ + groupSeq: group.seq, + groupName: group.name, + userSeqs: group.userSeqs.filter( + userSeq => userSeq !== req.seq + ) + }) + ); + } + } + + // Favorit Clear.. + this.store.dispatch( + updateBuddy({ + seq: req.seq, + isFavorit: false + }) + ); + + // Buddy Clear.. + this.store.dispatch(delBuddy({ userSeqs: [req.seq] })); + }) + ); + }, + { dispatch: false } + ); + updateBuddy$ = createEffect(() => this.actions$.pipe( ofType(updateBuddy), diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html index 6c2f344c..240fca97 100644 --- a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html +++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html @@ -9,71 +9,147 @@
- +
- -
- - - + +
+ + - + points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" + > - - - - - - - - - - - - - + + + + + + + + + + + + + + + +
- - Select File. + + + +
+ + + + + + Select File. +
+ +
+ + + + + + + + + + + Select File. +
@@ -25,10 +50,10 @@
    -
  • name : {{ selectedFile.info.name }}
  • -
  • size : {{ selectedFile.info.size | ucapBytes }}
  • +
  • {{ selectedFile.info.name }}
  • +
  • size : {{ selectedFile.info.size | ucapBytes }}
  • - date : + date : {{ selectedFile.info.sendDate | dateToStringFormat: 'YYYY.MM.DD' }}
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.scss index 1311305c..28271f99 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.scss @@ -1,3 +1,18 @@ +@mixin ellipsis($row) { + overflow: hidden; + text-overflow: ellipsis; + @if $row == 1 { + display: block; + white-space: nowrap; + word-wrap: normal; + } @else if $row >= 2 { + display: -webkit-box; + -webkit-line-clamp: $row; + -webkit-box-orient: vertical; + word-wrap: break-word; + } +} + .album-box { height: 100%; overflow: hidden; @@ -17,22 +32,32 @@ margin:10px; padding:10px; border:1px solid #cccccc; - .select-flie{ - display: flex; - flex-flow: row; - align-items: center; + .select-file{ color: #212121; - align-items: center; border-bottom: 1px dotted #dddddd; text-align:center; - ul{ - padding:0; - margin-top:10px; - .name{ + padding-bottom:10px; + } + ul{ + padding-top:10px; + li{ + @include ellipsis(1); + &.name{ font-weight:600; } } } + .empty-msg{ + display:inline-flex; + flex-flow: column; + margin:auto 0; + align-items: center; + justify-content: center; + color:#999999; + span{ + padding:6px; + } + } } .search-list{ @@ -41,11 +66,12 @@ height: calc(100% - 450px); overflow-y: auto; flex-wrap: wrap; - justify-content: space-between; .img-item { cursor: pointer; margin-bottom:10px; + margin-right:9px; position: relative; + height: 150px; dl{ dt{ display: flex; @@ -55,6 +81,7 @@ height: 120px; background-color: #efefef; border: 1px dotted #cccccc; + box-sizing: border-box; img{ width:100%; height:100%; @@ -66,14 +93,15 @@ } } } - & :nth-child(3n+0){ + &:nth-child(3n+0){ margin-right:0; } } } -.preview-image { - max-height: 300px; +.preview-image, +.preview-video{ + max-height: 140px; } .btn-box { diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.html index 5c21477f..3a95280a 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.html @@ -7,7 +7,13 @@
- Select File. +
+ + + + Select File. +
@@ -21,7 +27,7 @@
    -
  • name : {{ selectedFile.info.name }}
  • +
  • {{ selectedFile.info.name }}
  • size : {{ selectedFile.info.size | ucapBytes }}
  • date : @@ -29,8 +35,35 @@
-
- 아이콘 +
+ + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.scss index e7de30c8..c8b8e1ed 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.scss @@ -28,10 +28,10 @@ } .select-filebox { + position: relative; display: flex; flex-flow: column; margin: 10px; - padding: 10px; border: 1px solid #cccccc; .select-flie { display: flex; @@ -39,6 +39,7 @@ align-items: center; color: #212121; align-items: center; + padding: 10px; border-bottom: 1px dotted #dddddd; ul { padding: 0; @@ -47,6 +48,43 @@ } } } + .empty-msg { + display: inline-flex; + flex-flow: column; + margin: auto 0; + align-items: center; + justify-content: center; + color: #999999; + span { + padding: 6px; + } + } + .select-file-option { + position: absolute; + display: flex; + justify-content: space-between; + width: 100%; + text-align: center; + padding: 10px 0; + bottom: 4px; + span { + width: 28px; + height: 28px; + display: inline-flex; + text-align: center; + justify-content: center; + align-items: center; + margin: 0 20px; + cursor: pointer; + svg { + } + &:hover { + border-radius: 50%; + background-color: #999999; + color: #ffffff !important; + } + } + } } .mat-table { @@ -75,7 +113,7 @@ } } } -.table-box{ +.table-box { height: calc(100% - 450px); overflow-y: auto; } @@ -89,13 +127,14 @@ cursor: pointer; } -.footer-fix{ +.footer-fix { position: absolute; bottom: 0; - height:160px; + height: 160px; flex-direction: column; box-sizing: border-box; display: flex; + border-top: 1px solid #dddddd; .btn-box { height: 50px; padding-bottom: 10px; @@ -128,3 +167,8 @@ order: 5; } } +::ng-deep .mat-form-field-appearance-legacy { + .mat-form-field-infix { + padding: 6px; + } +} 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 c7dde43a..6074ed4c 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 @@ -207,4 +207,4 @@ export class FileBoxComponent implements OnInit, OnDestroy { onClickRow(row: FileInfoTotal) { this.selectedFile = row; } -} +} \ No newline at end of file diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/room-user-list.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/room-user-list.component.scss index e2de3c17..6cf582e3 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/room-user-list.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/room-user-list.component.scss @@ -1,3 +1,4 @@ +@import "../../../../../../../ucap-webmessenger-ui/src/assets/scss/partials/presence"; .list { width: 100%; height: 100%; diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.scss index dc8856aa..ff42ac4f 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.scss @@ -94,7 +94,7 @@ } } } -.mat-tab-group > .mat-tab-header .mat-tab-label { +::ng-deep .mat-card > .mat-tab-labels { border-bottom: 2px solid #dddddd; } ::ng-deep .ps-content { diff --git a/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss index 7f998b9b..c9c35b35 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/native/components/top-bar.component.scss @@ -9,7 +9,6 @@ display: flex; padding: 0 10px; cursor: pointer; - background: #4f4f4f; height: 30px; color:#ffffff; //background: rgba(37, 27, 30, 0.9); diff --git a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html index dcbfeada..873bc8c0 100644 --- a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html +++ b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html @@ -1,4 +1,4 @@ -
+
Date: Wed, 20 Nov 2019 18:04:24 +0900 Subject: [PATCH 3/5] =?UTF-8?q?=EC=8A=A4=ED=8B=B0=EC=BB=A4=20=EB=A0=88?= =?UTF-8?q?=EC=9D=B4=EC=96=B4=20=EC=B4=88=EC=95=88=20=EC=9E=91=EC=84=B1.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/messages.component.html | 10 + .../components/messages.component.scss | 22 ++- .../components/messages.component.ts | 6 + .../src/lib/utils/sticker.util.ts | 171 ++++++++++++++++++ .../ucap-webmessenger-core/src/public-api.ts | 1 + .../src/lib/components/form.component.html | 10 +- .../src/lib/components/form.component.ts | 7 + .../sticker-selector.component.html | 4 + .../sticker-selector.component.scss | 0 .../sticker-selector.component.spec.ts | 25 +++ .../components/sticker-selector.component.ts | 22 +++ .../src/lib/ucap-ui.module.ts | 2 + 12 files changed, 274 insertions(+), 6 deletions(-) create mode 100644 projects/ucap-webmessenger-core/src/lib/utils/sticker.util.ts create mode 100644 projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.html create mode 100644 projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.scss create mode 100644 projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.spec.ts create mode 100644 projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts 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 a152ee78..531e54b7 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 @@ -160,6 +160,15 @@ class="file-drop-zone" >
+ +
+ +
+
+
@@ -171,6 +180,7 @@ [fileUploadQueue]="fileUploadQueue" (send)="onSendMessage($event)" (sendFiles)="onFileSelected($event)" + (toggleStickerSelector)="onShowToggleStickerSelector($event)" > diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss index 3788c0be..df6a0f5f 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss @@ -29,7 +29,7 @@ align-items: center; background-color: #ffffff !important; border-bottom: 1px solid #dddddd; - box-shadow: 0 3px 6px rgba(0,0,0,.16); + box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); .chat-header { width: 100%; align-items: center; @@ -95,9 +95,25 @@ .file-drop-zone { position: absolute; - padding:10px 10px 0 10px; + padding: 10px 10px 0 10px; background-color: rgb(54, 54, 54, 0.8); - bottom:0 + bottom: 0; + } + } + + .sticker-selector-container { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: transparent; + + .sticer-selector-zone { + position: absolute; + padding: 10px 10px 0 10px; + background-color: rgb(54, 54, 54, 0.8); + bottom: 0; } } } 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 3ee12b66..26b198a7 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 @@ -147,6 +147,8 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { /** Timer 대화방의 대화 삭제를 위한 interval */ interval: any; + isShowStickerSelector = false; + snackBarPreviewEvent: MatSnackBarRef; constructor( @@ -484,6 +486,10 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { ); } + onShowToggleStickerSelector() { + this.isShowStickerSelector = !this.isShowStickerSelector; + } + async onFileViewer(fileInfo: FileEventJson) { const result = await this.dialogService.open< FileViewerDialogComponent, diff --git a/projects/ucap-webmessenger-core/src/lib/utils/sticker.util.ts b/projects/ucap-webmessenger-core/src/lib/utils/sticker.util.ts new file mode 100644 index 00000000..eed33be6 --- /dev/null +++ b/projects/ucap-webmessenger-core/src/lib/utils/sticker.util.ts @@ -0,0 +1,171 @@ +export interface StickerInfo { + index: string; + title: string; + iconPath: string; + iconPathOn: string; + useYn: boolean; + fileInfos: StickerFilesInfo[]; +} +export interface StickerFilesInfo { + index: string; + path: string; +} +const StickerMap: StickerInfo[] = [ + { + index: '00', + title: 'History', + iconPath: 'sticker_cate00.png', + iconPathOn: 'sticker_cate00_f.png', + useYn: true, + fileInfos: [] + }, + { + index: '01', + title: '꼼므', + iconPath: 'sticker_cate01.png', + iconPathOn: 'sticker_cate01_f.png', + useYn: true, + fileInfos: [ + { index: '01_01', path: 'sticker_s_01_01.png' }, + { index: '01_02', path: 'sticker_s_01_02.png' }, + { index: '01_03', path: 'sticker_s_01_03.png' }, + { index: '01_04', path: 'sticker_s_01_04.png' }, + { index: '01_05', path: 'sticker_s_01_05.png' }, + { index: '01_06', path: 'sticker_s_01_06.png' }, + { index: '01_07', path: 'sticker_s_01_07.png' }, + { index: '01_08', path: 'sticker_s_01_08.png' } + ] + }, + { + index: '02', + title: '까미', + iconPath: 'sticker_cate02.png', + iconPathOn: 'sticker_cate02_f.png', + useYn: true, + fileInfos: [ + { index: '02_02', path: 'sticker_s_02_02.png' }, + { index: '02_03', path: 'sticker_s_02_03.png' }, + { index: '02_04', path: 'sticker_s_02_04.png' }, + { index: '02_05', path: 'sticker_s_02_05.png' }, + { index: '02_06', path: 'sticker_s_02_06.png' }, + { index: '02_07', path: 'sticker_s_02_07.png' }, + { index: '02_08', path: 'sticker_s_02_08.png' } + ] + }, + { + index: '03', + title: '왈도', + iconPath: 'sticker_cate03.png', + iconPathOn: 'sticker_cate03_f.png', + useYn: true, + fileInfos: [ + { index: '03_01', path: 'sticker_s_03_01.png' }, + { index: '03_02', path: 'sticker_s_03_02.png' }, + { index: '03_03', path: 'sticker_s_03_03.png' }, + { index: '03_04', path: 'sticker_s_03_04.png' }, + { index: '03_05', path: 'sticker_s_03_05.png' }, + { index: '03_06', path: 'sticker_s_03_06.png' }, + { index: '03_07', path: 'sticker_s_03_07.png' }, + { index: '03_08', path: 'sticker_s_03_08.png' } + ] + }, + { + index: '04', + title: '웅쓰', + iconPath: 'sticker_cate04.png', + iconPathOn: 'sticker_cate04_f.png', + useYn: true, + fileInfos: [ + { index: '04_01', path: 'sticker_s_04_01.png' }, + { index: '04_02', path: 'sticker_s_04_02.png' }, + { index: '04_03', path: 'sticker_s_04_03.png' }, + { index: '04_04', path: 'sticker_s_04_04.png' }, + { index: '04_05', path: 'sticker_s_04_05.png' }, + { index: '04_06', path: 'sticker_s_04_06.png' }, + { index: '04_07', path: 'sticker_s_04_07.png' }, + { index: '04_08', path: 'sticker_s_04_08.png' } + ] + }, + { + index: '05', + title: '말풍선', + iconPath: 'sticker_cate05.png', + iconPathOn: 'sticker_cate05_f.png', + useYn: true, + fileInfos: [ + { index: '05_01', path: 'sticker_s_05_01.png' }, + { index: '05_02', path: 'sticker_s_05_02.png' }, + { index: '05_03', path: 'sticker_s_05_03.png' }, + { index: '05_04', path: 'sticker_s_05_04.png' }, + { index: '05_05', path: 'sticker_s_05_05.png' }, + { index: '05_06', path: 'sticker_s_05_06.png' }, + { index: '05_07', path: 'sticker_s_05_07.png' }, + { index: '05_08', path: 'sticker_s_05_08.png' }, + { index: '05_09', path: 'sticker_s_05_09.png' }, + { index: '05_10', path: 'sticker_s_05_10.png' }, + { index: '05_11', path: 'sticker_s_05_11.png' }, + { index: '05_12', path: 'sticker_s_05_12.png' }, + { index: '05_13', path: 'sticker_s_05_13.png' }, + { index: '05_14', path: 'sticker_s_05_14.png' }, + { index: '05_15', path: 'sticker_s_05_15.png' }, + { index: '05_16', path: 'sticker_s_05_16.png' } + ] + }, + { + index: '12', + title: '황소', + iconPath: 'sticker_cate12.png', + iconPathOn: 'sticker_cate12_f.png', + useYn: true, + fileInfos: [ + { index: '12_01', path: 'sticker_s_12_01.gif' }, + { index: '12_02', path: 'sticker_s_12_02.gif' }, + { index: '12_03', path: 'sticker_s_12_03.gif' }, + { index: '12_04', path: 'sticker_s_12_04.gif' }, + { index: '12_05', path: 'sticker_s_12_05.gif' }, + { index: '12_06', path: 'sticker_s_12_06.gif' }, + { index: '12_07', path: 'sticker_s_12_07.gif' }, + { index: '12_08', path: 'sticker_s_12_08.gif' }, + { index: '12_09', path: 'sticker_s_12_09.gif' }, + { index: '12_10', path: 'sticker_s_12_10.gif' }, + { index: '12_11', path: 'sticker_s_12_11.gif' }, + { index: '12_12', path: 'sticker_s_12_12.gif' }, + { index: '12_13', path: 'sticker_s_12_13.gif' }, + { index: '12_14', path: 'sticker_s_12_14.gif' }, + { index: '12_15', path: 'sticker_s_12_15.gif' }, + { index: '12_16', path: 'sticker_s_12_16.gif' } + ] + } +]; + +const ActiveAndOrdering: string[] = ['00', '01', '02', '03', '04', '05']; + +export class StickerUtil { + static getStickerInfoList(): StickerInfo[] { + const rtnStickerList: StickerInfo[] = []; + + ActiveAndOrdering.forEach(idx => { + const stickerInfos: StickerInfo[] = StickerMap.filter( + sticker => sticker.index === idx && sticker.useYn + ); + if (!!stickerInfos && stickerInfos.length > 0) { + rtnStickerList.push(stickerInfos[0]); + } + }); + + return rtnStickerList; + } + + static getStickerInfoSub(index: string): StickerFilesInfo[] { + const stickerFilesList: StickerFilesInfo[] = []; + const stickerInfos: StickerInfo[] = StickerMap.filter( + sticker => sticker.index === index && sticker.useYn + ); + + if (!!stickerInfos && stickerInfos.length > 0) { + stickerFilesList.concat(stickerInfos[0].fileInfos); + } + + return stickerFilesList; + } +} diff --git a/projects/ucap-webmessenger-core/src/public-api.ts b/projects/ucap-webmessenger-core/src/public-api.ts index b088a55f..e8a3a32b 100644 --- a/projects/ucap-webmessenger-core/src/public-api.ts +++ b/projects/ucap-webmessenger-core/src/public-api.ts @@ -22,6 +22,7 @@ export * from './lib/types/video-conference-type.type'; export * from './lib/utils/file.util'; export * from './lib/utils/mime.util'; +export * from './lib/utils/sticker.util'; export * from './lib/utils/string.util'; export * from './lib/config/host.config'; diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.html index 37d0c11a..fbc98053 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.html +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.html @@ -16,13 +16,17 @@ (change)="onChangeFileInput()" /> - -