openvidu-components: Added participant input in participant item

pull/707/head
csantosm 2022-02-15 16:45:40 +01:00
parent 602ae5b66b
commit c24a6d4cd0
3 changed files with 9 additions and 11 deletions

View File

@ -1,8 +1,8 @@
<mat-list> <mat-list>
<mat-list-item> <mat-list-item>
<mat-icon matListAvatar class="participant-avatar">person</mat-icon> <mat-icon matListAvatar class="participant-avatar">person</mat-icon>
<h3 matLine class="participant-nickname">{{ name }}</h3> <h3 matLine class="participant-nickname">{{ participant | nickname }}</h3>
<p matLine class="participant-subtitle">{{ connections }}</p> <p matLine class="participant-subtitle">{{ participant | streamsEnabled }}</p>
<!-- <p matLine> <!-- <p matLine>
<span class="participant-subtitle"></span> <span class="participant-subtitle"></span>
</p> --> </p> -->

View File

@ -1,4 +1,5 @@
import { Component, Input, OnInit } from '@angular/core'; import { Component, Input, OnInit } from '@angular/core';
import { ParticipantAbstractModel } from '../../../../models/participant.model';
@Component({ @Component({
selector: 'ov-participant-panel-item', selector: 'ov-participant-panel-item',
@ -6,8 +7,7 @@ import { Component, Input, OnInit } from '@angular/core';
styleUrls: ['./participant-panel-item.component.css'] styleUrls: ['./participant-panel-item.component.css']
}) })
export class ParticipantPanelItemComponent implements OnInit { export class ParticipantPanelItemComponent implements OnInit {
@Input() name: string; @Input() participant: ParticipantAbstractModel;
@Input() connections: string;
@Input() showDividerLine: boolean; @Input() showDividerLine: boolean;
constructor() {} constructor() {}

View File

@ -10,19 +10,17 @@
<div class="local-participant-container"> <div class="local-participant-container">
<ov-participant-panel-item <ov-participant-panel-item
[name]="localParticipant | nickname" [participant]="localParticipant"
[connections]="localParticipant | streamsEnabled"
[showDividerLine]="true" [showDividerLine]="true"
></ov-participant-panel-item> ></ov-participant-panel-item>
</div> </div>
<div class="remote-participants-container" *ngIf="remoteParticipants.length > 0"> <div class="remote-participants-container" *ngIf="remoteParticipants.length > 0">
<ov-participant-item <ov-participant-panel-item
*ngFor="let p of remoteParticipants; let lastItem = last" *ngFor="let participant of remoteParticipants; let lastItem = last"
[name]="p | nickname" [participant]="participant"
[connections]="p | streamsEnabled"
[showDividerLine]="!lastItem" [showDividerLine]="!lastItem"
></ov-participant-item> ></ov-participant-panel-item>
</div> </div>
</div> </div>