diff --git a/src/app/components/shared/room-join/room-join.component.html b/src/app/components/shared/room-join/room-join.component.html index f18b3bb291b72338c3a28b608b6be2094d61df15..0df7178cf7021093ffb88c02e63cb76c488c1e94 100644 --- a/src/app/components/shared/room-join/room-join.component.html +++ b/src/app/components/shared/room-join/room-join.component.html @@ -2,9 +2,11 @@ <form (ngSubmit)="joinRoom(roomId.value)"> <div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="10px"> <mat-form-field> - <input matInput #roomId type="number" min="00000000" max="99999999" onkeydown="if(this.value.length === 8 && event.keyCode != 8) return false;" placeholder="Session-Id" [formControl]="roomFormControl" - [errorStateMatcher]="matcher"/> - <mat-hint align="end">{{roomId.value.split(' ').join(' ').length}} / 8</mat-hint> + <input matInput #roomId type="text" inputmode="numeric" min="00000000" max="99999999" + onkeydown="if(this.value.length - (this.value.split(' ').length -1) === 8 && event.keyCode != 8) return false; + if(this.value.length === 4 && event.keyCode != 8) this.value = this.value + ' ';" + placeholder="Session-Id" [formControl]="roomFormControl" [errorStateMatcher]="matcher"/> + <mat-hint align="end">{{ roomId.value.length - (roomId.value.split(' ').length -1) }} / 8</mat-hint> <mat-error *ngIf="roomFormControl.hasError('required')">{{ 'home-page.please-enter' | translate}}</mat-error> <mat-error *ngIf="roomFormControl.hasError('minlength')">{{ 'home-page.exactly-8' | translate}}</mat-error> </mat-form-field> diff --git a/src/app/components/shared/room-join/room-join.component.ts b/src/app/components/shared/room-join/room-join.component.ts index cc22283e5b55b9b58b70088dbb214c44bdeadc4a..91fe23420270c29431902ba4e1bbd8f5401988a1 100644 --- a/src/app/components/shared/room-join/room-join.component.ts +++ b/src/app/components/shared/room-join/room-join.component.ts @@ -29,8 +29,8 @@ export class RoomJoinComponent implements OnInit { room: Room; demoId = '95680586'; user: User; - - roomFormControl = new FormControl('', [Validators.required, Validators.minLength(8), Validators.maxLength(8)]); + + roomFormControl = new FormControl('', [Validators.required, Validators.minLength(9), Validators.maxLength(9)]); matcher = new RegisterErrorStateMatcher(); @@ -46,7 +46,7 @@ export class RoomJoinComponent implements OnInit { } getRoom(id: string): void { - this.roomService.getRoomByShortId(id) + this.roomService.getRoomByShortId(id.replace(/\s/g, "")) .subscribe(room => { this.room = room; if (!room) {