diff --git a/src/app/app.config.ts b/src/app/app.config.ts index 98b4000..93940bf 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -2,8 +2,7 @@ import { provideHttpClient } from '@angular/common/http'; import { ApplicationConfig } from '@angular/core'; import { provideRouter } from '@angular/router'; import { appRoutes } from './app.routes'; -import { TranslateService } from './services/translate.service'; export const appConfig: ApplicationConfig = { - providers: [provideHttpClient(), provideRouter(appRoutes), TranslateService], + providers: [provideHttpClient(), provideRouter(appRoutes)], }; diff --git a/src/app/components/translate_block/translate_block.component.html b/src/app/components/translate_block/translate_block.component.html index b82faf5..546f70d 100644 --- a/src/app/components/translate_block/translate_block.component.html +++ b/src/app/components/translate_block/translate_block.component.html @@ -5,7 +5,9 @@
- + + +
diff --git a/src/app/components/translate_block/translate_block.component.ts b/src/app/components/translate_block/translate_block.component.ts index c5446e4..f4eebeb 100644 --- a/src/app/components/translate_block/translate_block.component.ts +++ b/src/app/components/translate_block/translate_block.component.ts @@ -1,7 +1,8 @@ import { CommonModule } from '@angular/common'; -import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core'; import { TranslateData } from 'src/app/dto/translate_data.dto'; -import { TranslatePipe } from 'src/app/pipes/translate.pipe'; +import { ETranslateService } from 'src/app/services/translate.enums'; +import { TranslateService } from 'src/app/services/translate.service'; @Component({ selector: 'app-translate-block', @@ -9,7 +10,7 @@ import { TranslatePipe } from 'src/app/pipes/translate.pipe'; styleUrls: ['./translate_block.component.scss'], standalone: true, imports: [CommonModule], - providers: [TranslatePipe], + providers: [TranslateService], }) export class TranslateBlockComponent implements OnInit, AfterViewInit { @ViewChild('translatedText') translatedText: ElementRef | null = null; @@ -31,13 +32,26 @@ export class TranslateBlockComponent implements OnInit, AfterViewInit { this.isEditing = this.item.translated_text === ''; } - constructor(private translatePipe: TranslatePipe, private changeDetectionRef: ChangeDetectorRef) {} - async sendToTranslate() { - const text = await this.translatePipe.transform(this.item.english_text); - this.item.translated_text = text; - if (this.translatedText) this.translatedText.nativeElement.textContent = text; - this.isEditing = false; - this.saveChanges(); + constructor(private translateService: TranslateService) {} + private sendToTranslate(service: ETranslateService = ETranslateService.GOOGLE) { + this.translateService.translate(this.item.english_text, service).subscribe((text) => { + this.item.translated_text = text; + if (this.translatedText) this.translatedText.nativeElement.textContent = text; + this.isEditing = false; + this.saveChanges(); + }); + } + + sendToGoogleTranslate() { + this.sendToTranslate(ETranslateService.GOOGLE); + } + + sendToDeeplTranslate() { + this.sendToTranslate(ETranslateService.DEEPL); + } + + sendToPromptTranslate() { + this.sendToTranslate(ETranslateService.PROMPT); } saveTranslate() { diff --git a/src/app/services/translate.dto.ts b/src/app/services/translate.dto.ts new file mode 100644 index 0000000..550d3c5 --- /dev/null +++ b/src/app/services/translate.dto.ts @@ -0,0 +1 @@ +export type GoogleTranslateResponse = Array>; diff --git a/src/app/services/translate.enums.ts b/src/app/services/translate.enums.ts new file mode 100644 index 0000000..ebf02ef --- /dev/null +++ b/src/app/services/translate.enums.ts @@ -0,0 +1,5 @@ +export enum ETranslateService { + GOOGLE = 'google', + DEEPL = 'deepl', + PROMPT = 'prompt', +} diff --git a/src/app/services/translate.service.ts b/src/app/services/translate.service.ts index 95d0dd8..ca5c693 100644 --- a/src/app/services/translate.service.ts +++ b/src/app/services/translate.service.ts @@ -1,27 +1,34 @@ import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; +import { Observable, map } from 'rxjs'; +import { GoogleTranslateResponse } from './translate.dto'; +import { ETranslateService } from './translate.enums'; @Injectable({ providedIn: 'root' }) export class TranslateService { constructor(private http: HttpClient) {} - translate(text: string): Promise { - return new Promise((resolve) => { - this.http - .get( - 'https://translate.googleapis.com/translate_a/single?client=gtx&sl=en&tl=ru&dt=t&q=' + - encodeURIComponent(text), - ) - .subscribe({ - // eslint-disable-next-line @typescript-eslint/no-explicit-any - next: (response: any) => { - console.log(response); - resolve(response[0][0][0]); - }, - error: (error) => { - console.error(error); - resolve(''); - }, - }); - }); + + private googleTranslate(text: string): Observable { + return this.http + .get( + 'https://translate.googleapis.com/translate_a/single?client=gtx&sl=en&tl=ru&dt=t&q=' + encodeURIComponent(text), + ) + .pipe( + map((response) => { + let result = ''; + response[0].forEach((el) => { + result += el[0] + ' '; + }); + return result; + }), + ); + } + translate(text: string, service: ETranslateService = ETranslateService.GOOGLE): Observable { + switch (service) { + case ETranslateService.GOOGLE: + return this.googleTranslate(text); + default: + return this.googleTranslate(text); + } } }