ambiser
/
openvidu
mirror of https://github.com/OpenVidu/openvidu.git
8
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

openvidu-components: Used OnPush change detection strategy

pull/707/head
csantosm 2022-02-24 10:20:32 +01:00
parent e02f72a0f1
commit 000f21b9dd
2 changed files with 14 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
openvidu-components-angular/projects/openvidu-angular/src/lib/components/session/session.component.ts
View File

@ -1,4 +1,4 @@
import { AfterViewInit, Component, ContentChild, EventEmitter, HostListener, Input, OnInit, Output, TemplateRef, ViewChild } from '@angular/core'; import { ChangeDetectionStrategy, Component, ContentChild, EventEmitter, HostListener, Input, OnInit, Output, TemplateRef, ViewChild } from '@angular/core';
import { Subscriber, Session, StreamEvent, StreamPropertyChangedEvent, SessionDisconnectedEvent, ConnectionEvent } from 'openvidu-browser'; import { Subscriber, Session, StreamEvent, StreamPropertyChangedEvent, SessionDisconnectedEvent, ConnectionEvent } from 'openvidu-browser';
import { VideoType } from '../../models/video-type.model'; import { VideoType } from '../../models/video-type.model';
@ -21,9 +21,10 @@ import { SidenavMenuService } from '../../services/sidenav-menu/sidenav-menu.ser
@Component({ @Component({
selector: 'ov-session', selector: 'ov-session',
templateUrl: './session.component.html', templateUrl: './session.component.html',
styleUrls: ['./session.component.css'] styleUrls: ['./session.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush
}) })
export class SessionComponent implements OnInit, AfterViewInit { export class SessionComponent implements OnInit {
@ContentChild('toolbar', { read: TemplateRef }) toolbarTemplate: TemplateRef<any>; @ContentChild('toolbar', { read: TemplateRef }) toolbarTemplate: TemplateRef<any>;
@ContentChild('panel', { read: TemplateRef }) panelTemplate: TemplateRef<any>; @ContentChild('panel', { read: TemplateRef }) panelTemplate: TemplateRef<any>;
@ContentChild('layout', { read: TemplateRef }) layoutTemplate: TemplateRef<any>; @ContentChild('layout', { read: TemplateRef }) layoutTemplate: TemplateRef<any>;
@ -112,12 +113,6 @@ export class SessionComponent implements OnInit, AfterViewInit {
this._session.emit(this.session); this._session.emit(this.session);
} }
ngAfterViewInit(): void {
this.layoutService.initialize();
this.layoutService.update();
}
ngOnDestroy() { ngOnDestroy() {
// Reconnecting session is received in Firefox // Reconnecting session is received in Firefox
// To avoid 'Connection lost' message uses session.off() // To avoid 'Connection lost' message uses session.off()
@ -125,7 +120,6 @@ export class SessionComponent implements OnInit, AfterViewInit {
this.participantService.clear(); this.participantService.clear();
this.session = null; this.session = null;
this.sessionScreen = null; this.sessionScreen = null;
this.layoutService.clear();
this.isChatPanelOpened = false; this.isChatPanelOpened = false;
this.isParticipantsPanelOpened = false; this.isParticipantsPanelOpened = false;
if (this.menuSubscription) this.menuSubscription.unsubscribe(); if (this.menuSubscription) this.menuSubscription.unsubscribe();
@ -238,7 +232,6 @@ export class SessionComponent implements OnInit, AfterViewInit {
this.session.on('streamDestroyed', (event: StreamEvent) => { this.session.on('streamDestroyed', (event: StreamEvent) => {
const connectionId = event.stream.connection.connectionId; const connectionId = event.stream.connection.connectionId;
this.participantService.removeConnectionByConnectionId(connectionId); this.participantService.removeConnectionByConnectionId(connectionId);
// event.preventDefault();
}); });
} }

12
openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts
View File

@ -1,4 +1,6 @@
import { import {
ChangeDetectionStrategy,
ChangeDetectorRef,
Component, Component,
ContentChild, ContentChild,
EventEmitter, EventEmitter,
@ -28,7 +30,8 @@ import { MenuType } from '../../models/menu.model';
@Component({ @Component({
selector: 'ov-toolbar', selector: 'ov-toolbar',
templateUrl: './toolbar.component.html', templateUrl: './toolbar.component.html',
styleUrls: ['./toolbar.component.css'] styleUrls: ['./toolbar.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush
}) })
export class ToolbarComponent implements OnInit, OnDestroy { export class ToolbarComponent implements OnInit, OnDestroy {
@ContentChild('centeredButtons', { read: TemplateRef }) centeredButtonsTemplate: TemplateRef<any>; @ContentChild('centeredButtons', { read: TemplateRef }) centeredButtonsTemplate: TemplateRef<any>;
@ -71,7 +74,8 @@ export class ToolbarComponent implements OnInit, OnDestroy {
protected openviduService: OpenViduService, protected openviduService: OpenViduService,
protected oVDevicesService: DeviceService, protected oVDevicesService: DeviceService,
protected actionService: ActionService, protected actionService: ActionService,
protected loggerSrv: LoggerService protected loggerSrv: LoggerService,
private cd: ChangeDetectorRef
) { ) {
this.log = this.loggerSrv.get('ToolbarComponent'); this.log = this.loggerSrv.get('ToolbarComponent');
} }
@ -292,18 +296,22 @@ export class ToolbarComponent implements OnInit, OnDestroy {
this.unreadMessages++; this.unreadMessages++;
} }
this.messageList = messages; this.messageList = messages;
this.cd.markForCheck();
}); });
} }
protected subscribeToUserMediaProperties() { protected subscribeToUserMediaProperties() {
this.screenShareStateSubscription = this.participantService.screenShareState.subscribe((active) => { this.screenShareStateSubscription = this.participantService.screenShareState.subscribe((active) => {
this.isScreenShareActive = active; this.isScreenShareActive = active;
this.cd.markForCheck();
}); });
this.webcamVideoStateSubscription = this.participantService.webcamVideoActive.subscribe((active) => { this.webcamVideoStateSubscription = this.participantService.webcamVideoActive.subscribe((active) => {
this.isWebcamVideoActive = active; this.isWebcamVideoActive = active;
this.cd.markForCheck();
}); });
this.webcamAudioStateSubscription = this.participantService.webcamAudioActive.subscribe((active) => { this.webcamAudioStateSubscription = this.participantService.webcamAudioActive.subscribe((active) => {
this.isWebcamAudioActive = active; this.isWebcamAudioActive = active;
this.cd.markForCheck();
}); });
} }
} }