From 15e9fe7ec4c25450c56d7bb1e36784bb5220cd2a Mon Sep 17 00:00:00 2001 From: nikolay Date: Wed, 21 Jun 2023 10:06:11 +0400 Subject: [PATCH] =?UTF-8?q?dev=20#14384=20=D0=9F=D1=80=D0=B0=D0=B2=D0=BA?= =?UTF-8?q?=D0=B0=20=D0=BE=D1=88=D0=B8=D0=B1=D0=BE=D0=BA=20=D0=BE=D1=82?= =?UTF-8?q?=D0=BE=D0=B1=D1=80=D0=B0=D0=B6=D0=B5=D0=BD=D0=B8=D1=8F=20WPA=20?= =?UTF-8?q?=D0=9A=D0=BE=D1=84=D0=B5=D0=9B=D0=B0=D0=B9=D0=BA:=20fix=20sms?= =?UTF-8?q?=20enter=20code=20in=20safari?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../directives/focus-next-input.directive.ts | 4 +- .../social-media-buttons.component.ts | 2 +- .../pages/login/login.component.html | 4 -- .../pages/login/login.component.ts | 55 ++++++++++++++----- 4 files changed, 45 insertions(+), 20 deletions(-) diff --git a/angular/src/app/directives/focus-next-input.directive.ts b/angular/src/app/directives/focus-next-input.directive.ts index 0d9b6b7..cc550ad 100644 --- a/angular/src/app/directives/focus-next-input.directive.ts +++ b/angular/src/app/directives/focus-next-input.directive.ts @@ -9,7 +9,9 @@ export class FocusNextInputDirective { constructor(private renderer: Renderer2) { } ngOnInit() { - // TODO: don't need to listen all events + // TODO: + // 1: don't need to listen all events + // 2: not working in safari this.eventEmitter.subscribe(elementId => { try { const element = this.renderer.selectRootElement(elementId) diff --git a/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.ts b/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.ts index 2c659b0..49f56cd 100644 --- a/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.ts +++ b/angular/src/app/presentation-options/default-option/components/social-media-buttons/social-media-buttons.component.ts @@ -15,7 +15,7 @@ export class SocialMediaButtonsComponent implements OnInit { public links: ISocialMediaLink[] = [ { label: 'Инстаграм', - url: 'https://www.instagram.com/', + url: 'https://instagram.com/coffeelike_com?igshid=MzRlODBiNWFlZA==', imgUrl: '/assets/social-media-icons/instagram.svg' }, { diff --git a/angular/src/app/presentation-options/default-option/pages/login/login.component.html b/angular/src/app/presentation-options/default-option/pages/login/login.component.html index e8c39bf..7e9d447 100644 --- a/angular/src/app/presentation-options/default-option/pages/login/login.component.html +++ b/angular/src/app/presentation-options/default-option/pages/login/login.component.html @@ -55,7 +55,6 @@ type="tel" placeholder="•" #field - [appFocusNextInput]="inputFocusEmitter" formControlName="code" maxlength="1" /> @@ -66,7 +65,6 @@ type="tel" placeholder="•" #field1 - [appFocusNextInput]="inputFocusEmitter" formControlName="code1" maxlength="1" /> @@ -77,7 +75,6 @@ type="tel" placeholder="•" #field2 - [appFocusNextInput]="inputFocusEmitter" formControlName="code2" maxlength="1" /> @@ -88,7 +85,6 @@ type="tel" placeholder="•" #field3 - [appFocusNextInput]="inputFocusEmitter" formControlName="code3" maxlength="1" /> diff --git a/angular/src/app/presentation-options/default-option/pages/login/login.component.ts b/angular/src/app/presentation-options/default-option/pages/login/login.component.ts index 9957811..0895123 100644 --- a/angular/src/app/presentation-options/default-option/pages/login/login.component.ts +++ b/angular/src/app/presentation-options/default-option/pages/login/login.component.ts @@ -1,9 +1,11 @@ import { AfterViewInit, Component, + ElementRef, EventEmitter, HostListener, OnInit, + ViewChild, } from '@angular/core'; import { FormControl, FormGroup, Validators } from '@angular/forms'; import { MatSnackBar } from '@angular/material/snack-bar'; @@ -39,17 +41,17 @@ export class LoginComponent implements OnInit, AfterViewInit { private messageService: MessageService, private _snackBar: MatSnackBar, private jsonRpcService: JsonrpcService - ) {} + ) { } - ngOnInit(): void {} + ngOnInit(): void { } ngAfterViewInit() { - setTimeout(() => { - this.inputFocusEmitter.emit(`#${this.inputIds[0]}`); - }, 1000); } - - public inputFocusEmitter = new EventEmitter(); + + @ViewChild('field', { static: false }) field!: ElementRef; + @ViewChild('field1', { static: false }) field1!: ElementRef; + @ViewChild('field2', { static: false }) field2!: ElementRef; + @ViewChild('field3', { static: false }) field3!: ElementRef; @HostListener('window:keydown', ['$event']) HandlKeyEvents(event: any) { @@ -63,23 +65,48 @@ export class LoginComponent implements OnInit, AfterViewInit { event.target.value = ''; const prevInputIndex = this.inputIds.indexOf(elementId) - 1; if (prevInputIndex >= 0) { - this.inputFocusEmitter.emit(`#${this.inputIds[prevInputIndex]}`); + // this.inputFocusEmitter.emit(`#${this.inputIds[prevInputIndex]}`); + this.focusFieldByIndex(prevInputIndex); } break; default: - elementId = event.target.id; + elementId = event.target.id; const index = this.inputIds.indexOf(elementId); const nextInputIndex = index + 1; - event.target.value = event.key; - + event.target.value = key; + if (nextInputIndex > 0 && nextInputIndex <= this.inputIds.length) { - this.inputFocusEmitter.emit(`#${this.inputIds[nextInputIndex]}`); + // this.inputFocusEmitter.emit(`#${this.inputIds[nextInputIndex]}`); + this.focusFieldByIndex(nextInputIndex); } + if (nextInputIndex == this.inputIds.length) { + this.field3!.nativeElement.blur(); + } + break; } } + focusFieldByIndex(i: number) { + setTimeout(() => { + switch (i) { + case 0: + this.field.nativeElement.focus(); + break; + case 1: + this.field1.nativeElement.focus(); + break; + case 2: + this.field2.nativeElement.focus(); + break; + case 3: + this.field3.nativeElement.focus(); + break; + } + }, 0); + } + submitNumber() { const data = this.phoneForm.value; this.isShowNumber = false; @@ -123,7 +150,7 @@ export class LoginComponent implements OnInit, AfterViewInit { }, }); setTimeout(() => { - this.inputFocusEmitter.emit(`#${this.inputIds[0]}`); + this.field.nativeElement.focus(); }, 0); } @@ -164,7 +191,7 @@ export class LoginComponent implements OnInit, AfterViewInit { }, error: (err) => { console.error(err); - + } }) // this.phoneConfirmed.emit(null);