next-ucap-messenger/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html

59 lines
2.1 KiB
HTML

<!-- CHAT -->
<div class="container" fxFlex fxLayout="column">
<!-- CHAT TOOLBAR -->
<mat-toolbar class="chat-toolbar">
<div fxFlex fxLayout="row" fxLayoutAlign="space-between center">
<div fxLayout="row" fxLayoutAlign="start center">
<!-- RESPONSIVE CHATS BUTTON-->
<button mat-icon-button aria-label="chats button" fxHide.gt-md class="responsive-chats-button">
<mat-icon>chat</mat-icon>
</button>
<!-- / RESPONSIVE CHATS BUTTON-->
</div>
<div>
<button *ngIf="!!roomInfo" mat-icon-button (click)="onClickReceiveAlarm($event)"
aria-label="Toggle Receive Alarm">
<mat-icon class="amber-fg" *ngIf="roomInfo.receiveAlarm">notifications_active</mat-icon>
<mat-icon class="secondary-text" *ngIf="!roomInfo.receiveAlarm">notifications_off</mat-icon>
</button>
<button mat-icon-button [matMenuTriggerFor]="contactMenu" aria-label="more">
<mat-icon>more_vert</mat-icon>
</button>
<mat-menu #contactMenu="matMenu">
<button mat-menu-item (click)="selectContact()">
Contact Info
</button>
</mat-menu>
</div>
</div>
</mat-toolbar>
<!-- / CHAT TOOLBAR -->
<mat-progress-bar *ngIf="eventListProcessing$ | async" mode="indeterminate"></mat-progress-bar>
<!-- CHAT CONTENT -->
<div fxFlex="1 1 auto" class="chat-content" #messageBoxContainer>
<!-- Timer Room Info -->
<span *ngIf="roomInfo && roomInfo.isTimeRoom">비밀 대화방입니다.</span>
<!-- Timer Room Info -->
<!-- CHAT MESSAGES -->
<ucap-chat-messages [messages]="eventList$ | async" [userInfos]="userInfoList$ | async" [loginRes]="loginRes"
[sessionVerInfo]="sessionVerInfo" (massDetail)="onMassDetail($event)" (save)="onSave($event)"
(imageViewer)="onImageViewer($event)">
</ucap-chat-messages>
<!-- CHAT MESSAGES -->
</div>
<!-- / CHAT CONTENT -->
<!-- CHAT FOOTER -->
<div fxFlex="0 0 auto" fxLayout="column">
<!-- REPLY FORM -->
<ucap-chat-form (send)="onSendMessage($event)"></ucap-chat-form>
<!-- / REPLY FORM -->
</div>
<!-- / CHAT FOOTER-->
</div>
<!-- / CHAT -->