diff --git a/electron-projects/ucap-webmessenger-electron/resources/image/ico_64x64_r.ico b/electron-projects/ucap-webmessenger-electron/resources/image/ico_64x64_r.ico deleted file mode 100644 index 94ece2ba..00000000 Binary files a/electron-projects/ucap-webmessenger-electron/resources/image/ico_64x64_r.ico and /dev/null differ diff --git a/projects/ucap-webmessenger-app/src/app/app.theme.scss b/projects/ucap-webmessenger-app/src/app/app.theme.scss index 599440de..164de656 100644 --- a/projects/ucap-webmessenger-app/src/app/app.theme.scss +++ b/projects/ucap-webmessenger-app/src/app/app.theme.scss @@ -103,10 +103,13 @@ body.theme-pink-dark { // ----------------------------------------------------------------------------------------------------- // Define the primary, accent and warn palettes -$pink-light-theme-primary-palette: mat-palette($mat-grey,800); -//$pink-light-theme-accent-palette: mat-palette($lg-red, 400); +/*$pink-light-theme-primary-palette: mat-palette($mat-grey,800); +$pink-light-theme-accent-palette: mat-palette($lg-red, 400); +$pink-light-theme-warn-palette: mat-palette($mat-red);*/ + +$pink-light-theme-primary-palette: mat-palette($daesang-grey, 900); $pink-light-theme-accent-palette: mat-palette($daesang); -$pink-light-theme-warn-palette: mat-palette($mat-red); +$pink-light-theme-warn-palette: mat-palette($mat-deep-orange); // Create the Material theme object diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.scss index ddb12bfe..081401ec 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.scss @@ -38,9 +38,7 @@ height: 100%; } ::ng-deep .global-menu { - border-right: 2px solid #4f4f4f; .mat-tab-label-container { - background-color: #4f4f4f; .mat-tab-list { .mat-tab-labels { flex-flow: column; diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/chat.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/chat.component.scss index 4e0df8ed..dd3c4550 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/chat.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/chat.component.scss @@ -1,11 +1,4 @@ .current-head { - display: flex; - justify-content: center; - padding: 0 10px; - height: 70px; - background: #352a37; - background: -webkit-linear-gradient(to right, #352a37, #f15f79); - background: linear-gradient(to right, #352a37, #ef4c73); h3 { display: inline-flex; padding-left: 10px; @@ -76,9 +69,17 @@ .app-layout-chat-left-sidenav-chat-list { height: calc(100% - 130px); + position: relative; } .app-layout-chat-left-sidenav-chat-list-viewport { width: 100%; height: 100%; } +::ng-deep .cdk-virtual-scroll-orientation-vertical { + .cdk-virtual-scroll-content-wrapper{ + width: 100%; + height:100%; + contain: unset; + } +} diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.scss index 4a173411..6ee241ce 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.scss @@ -1,13 +1,5 @@ @charset 'utf-8'; .current-head { - display: flex; - justify-content: center; - padding: 0 10px; - height: 70px; - background-color: #eeeeee; - background: #f15f79; - background: -webkit-linear-gradient(to right, #352a37, #f15f79); - background: linear-gradient(to right, #352a37, #ef4c73); color: #ffffff; h3 { display: inline-flex; diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts index 70b6ddbf..a70023d6 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts @@ -298,6 +298,12 @@ export class GroupComponent implements OnInit, OnDestroy { userInfo ); switch (menuType) { + case 'VIEW_PROFILE': + this.openProfile.emit(userInfo); + break; + case 'CHAT': + this.onSelectBuddy(userInfo); + break; case 'REGISTER_FAVORITE': this.store.dispatch( SyncStore.updateBuddy({ diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.scss index 11cfc5e5..55ccca60 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.scss @@ -16,7 +16,7 @@ } .current-head { - display: flex; + /*display: flex; justify-content: center; padding: 0 10px; height: 70px; @@ -24,7 +24,7 @@ background: #f15f79; background: -webkit-linear-gradient(to right, #352a37, #f15f79); background: linear-gradient(to right, #352a37, #ef4c73); - color: #ffffff; + color: #ffffff;*/ h3 { display: inline-flex; padding-left: 10px; @@ -83,6 +83,7 @@ display: flex; background-color: #f9f9f9; dt { + font-weight:600; } dd { margin-left: auto; 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..adfa5a5e 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,14 @@ class="file-drop-zone" > + + @@ -171,6 +179,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..5d560d9a 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; @@ -45,7 +45,6 @@ width: 40px; height: 40px; border-radius: 50%; - background-color: #604850; color: #efefef; font-size: 16px; line-height: 40px; @@ -95,9 +94,27 @@ .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; + width: 100%; + } + } + + .sticker-selector-container { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: transparent; + + .sticker-selector-zone { + position: absolute; + padding: 10px 10px 0 10px; + background-color: rgb(54, 54, 54, 0.8); + bottom: 0; + width: 100%; } } } 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-app/src/app/layouts/messenger/components/right-drawer/album-box.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.html index 01a70e10..b27d2402 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.html @@ -6,8 +6,33 @@
- - 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/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/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 @@ -
+
() ); +/** 동료 삭제 및 그룹 클리어.(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-app/src/assets/scss/global/_default.scss b/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss index 22600831..7bed9a97 100644 --- a/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss +++ b/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss @@ -60,6 +60,7 @@ $lg-red: ( A200: #ff4081, A400: #ff3399, A700: #c51162, + B100: #4f4f4f, G100: #ef4c73, G900: #352a37, contrast: ( @@ -77,28 +78,33 @@ $lg-red: ( A200: $light-primary-text, A400: $light-primary-text, A700: $light-primary-text, + B100: $light-primary-text, G100: $dark-primary-text, G900: $light-primary-text ) ); $daesang: ( - 50: #e0f7fa, - 100: #b2ebf2, - 200: #80deea, - 300: #4dd0e1, + 50: #f9feff, + //#e0f7fa, + 100: #b2ebf2, + 200: #4dd0e1, + //#80deea, + 300: #4dd0e1, 400: #26c6da, 500: #00bcd4, /*600: #00acc1,*/ 600: #00b6d5, 700: #0097a7, - 800: #2c8493, - 900: #126a79, + 800: #0367a6, + 900: #024873, A100: #84ffff, A200: #18ffff, A400: #00e5ff, A700: #00b8d4, - G100: #6dd5ed, - /*G900: #192a2c,*/ G900: #2193b0, + B100: #2d3a4a, + //,#47667fbackgroundcolor + G100: #0367a6, + /*G900: #192a2c,*/ G900: #6dd5ed, contrast: ( 50: $dark-primary-text, 100: $dark-primary-text, @@ -114,10 +120,43 @@ $daesang: ( A200: $dark-primary-text, A400: $dark-primary-text, A700: $dark-primary-text, + B100: $light-primary-text, G100: $dark-primary-text, G900: $light-primary-text ) ); +$daesang-grey: ( + 50: #fafafa, + 100: #f5f5f5, + 200: #eeeeee, + 300: #e0e0e0, + 400: #bdbdbd, + 500: #9e9e9e, + 600: #757575, + 700: #616161, + 800: #424242, + 900: #2d3a4a, + A100: #ffffff, + A200: #eeeeee, + A400: #bdbdbd, + A700: #616161, + contrast: ( + 50: $dark-primary-text, + 100: $dark-primary-text, + 200: $dark-primary-text, + 300: $dark-primary-text, + 400: $dark-primary-text, + 500: $dark-primary-text, + 600: $light-primary-text, + 700: $light-primary-text, + 800: $light-primary-text, + 900: $light-primary-text, + A100: $dark-primary-text, + A200: $dark-primary-text, + A400: $dark-primary-text, + A700: $light-primary-text + ) +); @mixin ucap-material-theme($theme) { @include ucap-core-theme($theme); @@ -133,6 +172,7 @@ $daesang: ( $gradient-darkest: mat-color($accent, G900); $gradient-light: mat-color($accent, G100); + //basic .bg-primary-dark { background: mat-color($primary, 900); color: mat-color($primary, default-contrast); @@ -168,6 +208,9 @@ $daesang: ( .text-primary-color { color: mat-color($primary); } + .text-accent-darkest { + color: mat-color($accent, 900); + } .text-accent-color { color: mat-color($accent); } @@ -180,6 +223,18 @@ $daesang: ( .border-accent-color { border: 1px solid mat-color($accent); } + + // sass 정의 + .mat-toolbar { + background-color: mat-color($accent, B100); + } + .main-container { + border: 3px solid mat-color($accent, B100); + } + .global-menu { + background-color: mat-color($accent, B100); + } + .mat-tab-group.mat-primary .mat-ink-bar, body.theme-default .mat-tab-nav-bar.mat-primary .mat-ink-bar { background-color: mat-color($accent, 400); @@ -187,9 +242,7 @@ $daesang: ( .mat-chip.mat-standard-chip.mat-chip-selected.mat-primary { background-color: mat-color($accent, 200); } - /*.mat-form-field-appearance-legacy .mat-hint{ - color: mat-color($accent, 800); - }*/ + .global-menu { .mat-tab-label[aria-selected='true'] { .mat-tab-label-content { @@ -266,4 +319,12 @@ $daesang: ( display: flex; flex-direction: column !important; } + .messages .container { + background: mat-color($accent, 50); + } + .profile-img { + .responsive-chats-button:last-child { + background-color: $gradient-light; + } + } } 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()" /> - -
(); + @Output() + toggleStickerSelector = new EventEmitter(); + @ViewChild('replyForm', { static: false }) replyForm: NgForm; @@ -67,4 +70,8 @@ export class FormComponent implements OnInit { this.fileInput.nativeElement.value = ''; } + + onClickStickerSelector() { + this.toggleStickerSelector.emit(); + } } diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.scss b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.scss index b91d83d5..06ff62ee 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.scss +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.scss @@ -5,7 +5,7 @@ .file-thumbimg{ display:inline-flex; img { - width:200px; + height:140px; padding-right: 20px; background-repeat: no-repeat; } diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.scss b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.scss index 0f901130..5119e8ca 100644 --- a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.scss +++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.scss @@ -144,7 +144,7 @@ $meBox-bg: #ffffff; width: 100%; height: 100%; text-align: center; - background-color: #dddddd; + background-color: rgba(0, 0, 0, 0.1); padding: 10px; margin: 10px 0; } @@ -160,7 +160,6 @@ $meBox-bg: #ffffff; position: relative; display: flex; flex-direction: row; - margin-right: 40px; margin-left: 0; .profile-img { flex: 0 0 auto; @@ -172,7 +171,7 @@ $meBox-bg: #ffffff; &.me { .chat-row { flex-direction: row-reverse; - margin-left: 40px; + margin-left: 0; margin-right: 0; .profile-info { flex-direction: row-reverse; 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" + > - - - - - - - - - - - - - + + + + + + + + + + + + + + + +
  • - - - + + {{ userInfo.intro }}
  • - - - + + {{ userInfo.email }}
  • - - + - + d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" + > {{ userInfo.lineNumber }}
  • - - + @@ -84,47 +160,103 @@
    -
    - \ No newline at end of file + diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.ts b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.ts index 4d6ef844..a7612d97 100644 --- a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.ts +++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.ts @@ -22,10 +22,20 @@ export class ProfileComponent implements OnInit { @Input() isFavorit: boolean; @Input() - userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN; + userInfo: UserInfo | UserInfoF; @Output() - openChat = new EventEmitter(); + openChat = new EventEmitter(); + @Output() + toggleFavorit = new EventEmitter<{ + userInfo: UserInfo | UserInfoF; + isFavorit: boolean; + }>(); + @Output() + toggleBuddy = new EventEmitter<{ + userInfo: UserInfo | UserInfoF; + isBuddy: boolean; + }>(); constructor() {} @@ -40,4 +50,27 @@ export class ProfileComponent implements OnInit { onClickVideoConference() {} onClickMessage() {} + + onToggleFavorit() { + this.isFavorit = !this.isFavorit; + + this.toggleFavorit.emit({ + userInfo: this.userInfo, + isFavorit: this.isFavorit + }); + } + + onClickAddBuddy() { + this.toggleBuddy.emit({ + userInfo: this.userInfo, + isBuddy: true + }); + } + + onClickDelBuddy() { + this.toggleBuddy.emit({ + userInfo: this.userInfo, + isBuddy: false + }); + } } diff --git a/projects/ucap-webmessenger-ui-room/src/lib/components/list-item.component.scss b/projects/ucap-webmessenger-ui-room/src/lib/components/list-item.component.scss index 302b435c..7c4a947a 100644 --- a/projects/ucap-webmessenger-ui-room/src/lib/components/list-item.component.scss +++ b/projects/ucap-webmessenger-ui-room/src/lib/components/list-item.component.scss @@ -139,7 +139,6 @@ $thumbnail-msize: 40px; margin-left: 6px; border-radius: 3px; padding: 1px 6px; - background-color: #ef4c73; color: #ffffff; } } diff --git a/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.scss b/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.scss index 35e07c2a..59f0c5b8 100644 --- a/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.scss +++ b/projects/ucap-webmessenger-ui/src/lib/components/file-upload-queue.component.scss @@ -17,32 +17,25 @@ width: 100%; height: 100%; .file-upload-item { - background-color: #eeeeee; min-width: 200px; - margin: 0 0.5%; + margin: 0 1%; margin-bottom: 10px; - width: 32%; + width: 48%; border-radius: 3px; + background-color:#f9f9f9; + border:1px solid #dddddd; .file-upload-info { padding: 10px; - background-color:#ffffff; - border-bottom: 1px solid #dddddd; svg { margin-right: 6px; } .file-upload-name { - height: 40px; + height: 20px; @include ellipsis(2); } } .file-upload-progress { padding: 6px 10px; } - &:nth-child(3n + 1) { - margin-left: 1%; - } - &:nth-child(3n + 0) { - margin-right: 1%; - } } } diff --git a/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.html b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.html new file mode 100644 index 00000000..6bf20e58 --- /dev/null +++ b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.html @@ -0,0 +1,4 @@ +

    sticker-selector works!

    +

    + {{ stickerInfo.title }} +

    diff --git a/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.scss b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.spec.ts b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.spec.ts new file mode 100644 index 00000000..b7413d44 --- /dev/null +++ b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { StickerSelectorComponent } from './sticker-selector.component'; + +describe('StickerSelectorComponent', () => { + let component: StickerSelectorComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ StickerSelectorComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(StickerSelectorComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts new file mode 100644 index 00000000..c36bd8a7 --- /dev/null +++ b/projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.ts @@ -0,0 +1,22 @@ +import { Component, OnInit } from '@angular/core'; +import { + StickerInfo, + StickerFilesInfo, + StickerUtil +} from '@ucap-webmessenger/core'; + +@Component({ + selector: 'ucap-sticker-selector', + templateUrl: './sticker-selector.component.html', + styleUrls: ['./sticker-selector.component.scss'] +}) +export class StickerSelectorComponent implements OnInit { + stickerInfoList: StickerInfo[] = []; + stickerFileInfoList: StickerFilesInfo[] = []; + + constructor() {} + + ngOnInit() { + this.stickerInfoList = StickerUtil.getStickerInfoList(); + } +} diff --git a/projects/ucap-webmessenger-ui/src/lib/ucap-ui.module.ts b/projects/ucap-webmessenger-ui/src/lib/ucap-ui.module.ts index cdd8be91..d81b8bfd 100644 --- a/projects/ucap-webmessenger-ui/src/lib/ucap-ui.module.ts +++ b/projects/ucap-webmessenger-ui/src/lib/ucap-ui.module.ts @@ -47,12 +47,14 @@ import { } from './pipes/dates.pipe'; import { SecondsToMinutesPipe } from './pipes/seconds-to-minutes.pipe'; import { LinkyPipe } from './pipes/linky.pipe'; +import { StickerSelectorComponent } from './components/sticker-selector.component'; const COMPONENTS = [ FileUploadQueueComponent, FloatActionButtonComponent, FileViewerComponent, ExpansionPanelComponent, + StickerSelectorComponent, BinaryViewerComponent, DocumentViewerComponent,