| null = null;
+
+ constructor(private panelService: PanelSevice, private translateService: TranslateService) {
this.time = this.getTime();
setInterval(() => {
this.time = this.getTime();
@@ -26,7 +31,7 @@ export class PanelComponent {
private getTime() {
const time = this.panelService.getTime();
- return time.toLocaleDateString("en-US", {
+ return time.toLocaleDateString(this.translateService.translate("TIME_SCHEMA"), {
month: "short",
day: "numeric",
hour: "numeric",
@@ -37,4 +42,31 @@ export class PanelComponent {
goToSource() {
window.open("https://git.nwaifu.su/neuro_llc/NwaifuWeb", "_blank");
}
+
+ @HostListener("window:resize")
+ private moveLangModal() {
+ if (!this.langModal || !this.langBtn) {
+ return;
+ }
+
+ const x = this.langBtn.nativeElement.getBoundingClientRect().x;
+ this.langModal.nativeElement.style.left = `calc(${x}px - 3.5rem)`;
+ }
+
+ toggleModal() {
+ if (this.langModal) {
+ this.langModal.nativeElement.classList.toggle("active");
+ if (this.langModal.nativeElement.classList.contains("active")) {
+ this.moveLangModal();
+ }
+ }
+ }
+
+ useLang(lang: string) {
+ this.translateService.use(lang);
+ }
+
+ getLang() {
+ return this.translateService.lang;
+ }
}
diff --git a/src/app/modules/window/window.component.html b/src/app/modules/window/window.component.html
index 1239aa1..bd377db 100644
--- a/src/app/modules/window/window.component.html
+++ b/src/app/modules/window/window.component.html
@@ -1,10 +1,10 @@
-
Info
+
{{ modal_title | translate }}
-
Hello
+ {{ modal_text | translate }}
diff --git a/src/app/modules/window/window.component.ts b/src/app/modules/window/window.component.ts
index df6ec48..db5642a 100644
--- a/src/app/modules/window/window.component.ts
+++ b/src/app/modules/window/window.component.ts
@@ -1,18 +1,21 @@
import { CommonModule } from "@angular/common";
-import { ChangeDetectionStrategy, Component } from "@angular/core";
+import { Component } from "@angular/core";
import { FontAwesomeModule } from "@fortawesome/angular-fontawesome";
import { faBars, faXmark } from "@fortawesome/free-solid-svg-icons";
import { DialogRef } from "@ngneat/dialog";
+import { TranslationPipe } from "../../pipes/translation.pipe";
@Component({
selector: "app-window",
standalone: true,
- imports: [CommonModule, FontAwesomeModule],
+ imports: [CommonModule, FontAwesomeModule, TranslationPipe],
templateUrl: "./window.component.html",
styleUrls: ["./window.component.less"],
- changeDetection: ChangeDetectionStrategy.OnPush,
+ // changeDetection: ChangeDetectionStrategy.OnPush,
})
export class WindowComponent {
+ modal_text = "MODAL_TEXT";
+ modal_title = "MODAL_TITLE";
faClose = faXmark;
faMenu = faBars;
constructor(public ref: DialogRef) {}
diff --git a/src/app/pipes/translation.pipe.ts b/src/app/pipes/translation.pipe.ts
new file mode 100644
index 0000000..de13ada
--- /dev/null
+++ b/src/app/pipes/translation.pipe.ts
@@ -0,0 +1,14 @@
+import { Pipe, PipeTransform } from "@angular/core";
+import { TranslateService } from "../services/translate.service";
+
+@Pipe({
+ name: "translate",
+ standalone: true,
+ pure: false,
+})
+export class TranslationPipe implements PipeTransform {
+ constructor(private translateService: TranslateService) {}
+ transform(key: string) {
+ return this.translateService.data[key] ?? key;
+ }
+}
diff --git a/src/app/services/translate.service.ts b/src/app/services/translate.service.ts
new file mode 100644
index 0000000..94c5502
--- /dev/null
+++ b/src/app/services/translate.service.ts
@@ -0,0 +1,30 @@
+import { HttpClient } from "@angular/common/http";
+import { Injectable } from "@angular/core";
+
+@Injectable({ providedIn: "root" })
+export class TranslateService {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ data: Record = {};
+ lang = "en";
+ constructor(private http: HttpClient) {}
+ use(lang: string): Promise