mirror of https://github.com/OpenVidu/openvidu.git
43 lines
1.3 KiB
HTML
43 lines
1.3 KiB
HTML
|
<div id="chat-container" fxLayout="column" fxLayoutAlign="space-evenly none" >
|
||
|
|
<div class="header-container" fxFlex="55px" fxLayoutAlign="start center">
|
||
|
|
<h3>Chat</h3>
|
||
|
|
<button mat-icon-button matTooltip="Close" (click)="close()">
|
||
|
|
<mat-icon>close</mat-icon>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="text-container" fxFlex="30px">
|
||
|
|
<p class="text-info">Messages will be removed at the end of the session</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="messages-container" fxFlex="75%" fxLayoutAlign="space-evenly none" #chatScroll>
|
||
|
|
<div *ngFor="let data of messageList" class="message" [ngClass]="data.isLocal ? 'right' : 'left'">
|
||
|
|
<div class="msg-detail">
|
||
|
|
<div class="nickname-container">
|
||
|
|
<p *ngIf="data.isLocal">You</p>
|
||
|
|
<p *ngIf="!data.isLocal">{{ data.nickname }}</p>
|
||
|
|
</div>
|
||
|
|
<div class="msg-content">
|
||
|
|
<p [innerHTML]="data.message | linkify"></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="input-container" fxFlex="55px" fxFlexOrder="3" fxLayoutAlign="space-evenly none">
|
||
|
|
<textarea
|
||
|
|
#chatInput
|
||
|
|
maxlength="500"
|
||
|
|
rows="4"
|
||
|
|
placeholder="Send a message"
|
||
|
|
autocomplete="off"
|
||
|
|
(keypress)="eventKeyPress($event)"
|
||
|
|
[(ngModel)]="message"
|
||
|
|
id="chat-input"
|
||
|
|
></textarea>
|
||
|
|
<button mat-icon-button id="send-btn" (click)="sendMessage()">
|
||
|
|
<mat-icon matTooltip="Send">send</mat-icon>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|