openvidu-components: Disabled captions feature preview

pull/750/head
Carlos Santos 2022-09-19 10:47:59 +02:00
parent cc5110dec3
commit 3f0e96ac35
5 changed files with 30 additions and 26 deletions

View File

@ -10,8 +10,7 @@
"@angular/flex-layout": "^13.0.0-beta.36", "@angular/flex-layout": "^13.0.0-beta.36",
"autolinker": "^3.14.3", "autolinker": "^3.14.3",
"buffer": "^6.0.3", "buffer": "^6.0.3",
"openvidu-browser": "2.22.0", "openvidu-browser": "2.22.0"
"lorem-ipsum": "^2.0.8"
}, },
"dependencies": { "dependencies": {
"tslib": "^2.3.0" "tslib": "^2.3.0"

View File

@ -14,8 +14,8 @@ import { PanelEvent, PanelService } from '../../services/panel/panel.service';
import { DocumentService } from '../../services/document/document.service'; import { DocumentService } from '../../services/document/document.service';
import { MediaChange } from '@angular/flex-layout'; import { MediaChange } from '@angular/flex-layout';
//TODO: BORRAR //TODO: Remove when speech to text is integrated
import { LoremIpsum } from 'lorem-ipsum'; // import { LoremIpsum } from 'lorem-ipsum';
/** /**
* @internal * @internal
@ -50,7 +50,7 @@ export class CaptionsComponent implements OnInit {
captionElements: { connectionId: string; author: string; text: string }[] = []; captionElements: { connectionId: string; author: string; text: string }[] = [];
//TODO: Delete //TODO: Remove when speech to text is integrated
private sample = [ private sample = [
{ connectionId: '1', partial: 'frente' }, { connectionId: '1', partial: 'frente' },
{ connectionId: '1', partial: 'friends' }, { connectionId: '1', partial: 'friends' },
@ -1393,7 +1393,7 @@ export class CaptionsComponent implements OnInit {
}); });
} }
private updateCaption(connectionId: string, text: string) { private updateCaption(connectionId: string, text: string) {
//TODO: Delete //TODO: Remove when speech to text is integrated
const nicknames = new Map(); const nicknames = new Map();
nicknames.set('1', 'Pepe'); nicknames.set('1', 'Pepe');
nicknames.set('2', 'Mario'); nicknames.set('2', 'Mario');
@ -1453,7 +1453,7 @@ export class CaptionsComponent implements OnInit {
this.captionElements = [...newCaptionElements]; this.captionElements = [...newCaptionElements];
} }
// TODO Delete when feature is enabled //TODO: Remove when speech to text is integrated
private startFakeEventWithSample() { private startFakeEventWithSample() {
let index = 0; let index = 0;
let event = <{ connectionId: string; partial: string; text?: string }>this.sample[index]; let event = <{ connectionId: string; partial: string; text?: string }>this.sample[index];
@ -1475,22 +1475,24 @@ export class CaptionsComponent implements OnInit {
this.interval = eventLoop(); this.interval = eventLoop();
setInterval(() => { //TODO: Simulating an speech event
clearInterval(this.interval); //TODO: Remove when speech to text is integrated
const lorem = new LoremIpsum(); // setInterval(() => {
let times = 5; // clearInterval(this.interval);
let partial = 'BLA BLA BLA '; // const lorem = new LoremIpsum();
const interval2 = setInterval(() => { // let times = 5;
fakeEventBS.next({ connectionId: '5', partial }); // let partial = 'BLA BLA BLA ';
partial += lorem.generateWords(2); // const interval2 = setInterval(() => {
if (times <= 0) { // fakeEventBS.next({ connectionId: '5', partial });
fakeEventBS.next({ connectionId: '5', partial, text: partial }); // partial += lorem.generateWords(2);
clearInterval(interval2); // if (times <= 0) {
this.interval = eventLoop(); // fakeEventBS.next({ connectionId: '5', partial, text: partial });
} // clearInterval(interval2);
times--; // this.interval = eventLoop();
}, 400); // }
}, 6000); // times--;
// }, 400);
// }, 6000);
} }
private subscribeToPanelToggling() { private subscribeToPanelToggling() {

View File

@ -22,7 +22,7 @@
<div mat-line>{{ 'PANEL.SETTINGS.AUDIO' | translate }}</div> <div mat-line>{{ 'PANEL.SETTINGS.AUDIO' | translate }}</div>
</mat-list-option> </mat-list-option>
<mat-list-option <mat-list-option
*ngIf="showSubtitles" *ngIf="showSubtitles && false"
class="option" class="option"
[selected]="selectedOption === settingsOptions.SUBTITLES" [selected]="selectedOption === settingsOptions.SUBTITLES"
[value]="settingsOptions.SUBTITLES" [value]="settingsOptions.SUBTITLES"
@ -47,7 +47,7 @@
</div> </div>
<ov-video-devices-select *ngIf="selectedOption === settingsOptions.VIDEO"></ov-video-devices-select> <ov-video-devices-select *ngIf="selectedOption === settingsOptions.VIDEO"></ov-video-devices-select>
<ov-audio-devices-select *ngIf="selectedOption === settingsOptions.AUDIO"></ov-audio-devices-select> <ov-audio-devices-select *ngIf="selectedOption === settingsOptions.AUDIO"></ov-audio-devices-select>
<ov-subtitles-settings *ngIf="selectedOption === settingsOptions.SUBTITLES && showSubtitles"></ov-subtitles-settings> <ov-subtitles-settings *ngIf="selectedOption === settingsOptions.SUBTITLES && showSubtitles && false"></ov-subtitles-settings>
</div> </div>
</div> </div>
</div> </div>

View File

@ -105,7 +105,7 @@
<!-- Subtitles button --> <!-- Subtitles button -->
<button <button
*ngIf="!isMinimal && showSubtitlesButton" *ngIf="!isMinimal && showSubtitlesButton && false"
[disabled]="isConnectionLost" [disabled]="isConnectionLost"
mat-menu-item mat-menu-item
id="subtitles-btn" id="subtitles-btn"

View File

@ -256,6 +256,9 @@ export class ToolbarBackgroundEffectsButtonDirective implements AfterViewInit, O
* And it also can be used in the {@link ToolbarComponent}. * And it also can be used in the {@link ToolbarComponent}.
* @example * @example
* <ov-toolbar [captionsButton]="false"></ov-toolbar> * <ov-toolbar [captionsButton]="false"></ov-toolbar>
*
* TODO: Make it public when speech to text is integrated
* @internal
*/ */
@Directive({ @Directive({
selector: 'ov-videoconference[toolbarCaptionsButton], ov-toolbar[captionsButton]' selector: 'ov-videoconference[toolbarCaptionsButton], ov-toolbar[captionsButton]'