diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.html b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.html index f2f0c4aa..f97e969d 100644 --- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.html +++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.html @@ -54,7 +54,7 @@
-
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.ts b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.ts index 9d4958a0..5bbec423 100644 --- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.ts +++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.ts @@ -123,7 +123,7 @@ export class PreJoinComponent implements OnInit, OnDestroy { this.cdkSrv.setSelector('#prejoin-container'); } - joinSession() { + join() { if (this.showParticipantName && !this.participantName) { this._error = this.translateService.translate('PREJOIN.NICKNAME_REQUIRED'); return; @@ -143,7 +143,7 @@ export class PreJoinComponent implements OnInit, OnDestroy { } onEnterPressed() { - this.joinSession(); + this.join(); } private subscribeToPrejoinDirectives() { diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/videoconference/videoconference.component.ts b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/videoconference/videoconference.component.ts index bbc28c9f..6bc1a940 100644 --- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/videoconference/videoconference.component.ts +++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/videoconference/videoconference.component.ts @@ -616,13 +616,44 @@ export class VideoconferenceComponent implements OnDestroy, AfterViewInit { /** * @internal + * Handles the ready-to-join event, initializing the room and managing the prejoin flow. + * This method coordinates the transition from prejoin state to actual room joining. */ - _onReadyToJoin() { - this.openviduService.initRoom(); - const participantName = this.latestParticipantName; - if (participantName) this.onTokenRequested.emit(participantName); - // Emits onReadyToJoin event only if prejoin page has been shown - if (this.showPrejoin) this.onReadyToJoin.emit(); + _onReadyToJoin(): void { + this.log.d('Ready to join - initializing room and handling prejoin flow'); + + try { + // Always initialize the room when ready to join + this.openviduService.initRoom(); + + const participantName = this.latestParticipantName; + const wasShowingPrejoin = this.showPrejoin; + + if (this.isRoomReady) { + // Room is ready, hide prejoin and proceed + this.log.d('Room is ready, proceeding to join'); + this.showPrejoin = false; + } else { + // Room not ready, request token if we have a participant name + if (participantName) { + this.log.d(`Requesting token for participant: ${participantName}`); + this.onTokenRequested.emit(participantName); + } else { + this.log.w('No participant name available when requesting token'); + } + } + + // Emit onReadyToJoin event only if prejoin page was actually shown + // This ensures the event semantics are correct + if (wasShowingPrejoin) { + this.log.d('Emitting onReadyToJoin event (prejoin was shown)'); + this.onReadyToJoin.emit(); + } + + } catch (error) { + this.log.e('Error during ready to join process', error); + // Could emit an error event or handle gracefully based on requirements + } } /** * @internal @@ -644,7 +675,7 @@ export class VideoconferenceComponent implements OnDestroy, AfterViewInit { this.openviduService.initializeAndSetToken(token, livekitUrl); this.log.d('Token has been successfully set. Room is ready to join'); this.isRoomReady = true; - this.showPrejoin = false; + this.showPrejoin = this.libService.showPrejoin(); } catch (error) { this.log.e('Error trying to set token', error); this._tokenError = error; diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/videoconference.directive.ts b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/videoconference.directive.ts index afb60476..48ff7022 100644 --- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/videoconference.directive.ts +++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/videoconference.directive.ts @@ -590,7 +590,7 @@ export class PrejoinDirective implements OnDestroy { * @ignore */ update(value: boolean) { - if (this.libService.isPrejoin() !== value) { + if (this.libService.showPrejoin() !== value) { this.libService.setPrejoin(value); } } diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/services/config/directive-config.service.ts b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/services/config/directive-config.service.ts index 3588e87d..d5ee3b71 100644 --- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/services/config/directive-config.service.ts +++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/services/config/directive-config.service.ts @@ -214,7 +214,7 @@ export class OpenViduComponentsConfigService { this.prejoinDisplayParticipantName.next(prejoinDisplayParticipantName); } - isPrejoin(): boolean { + showPrejoin(): boolean { return this.prejoin.getValue(); }