diff --git a/src/app/components/level-card/level-card.html b/src/app/components/level-card/level-card.html
index 18b995f..6f1c178 100644
--- a/src/app/components/level-card/level-card.html
+++ b/src/app/components/level-card/level-card.html
@@ -13,10 +13,10 @@
diff --git a/src/app/components/level-card/level-card.ts b/src/app/components/level-card/level-card.ts
index 0d59a73..db0c717 100644
--- a/src/app/components/level-card/level-card.ts
+++ b/src/app/components/level-card/level-card.ts
@@ -7,15 +7,29 @@ import { TranslationService } from '../../services/translation.service';
templateUrl: './level-card.html',
styleUrl: './level-card.scss',
host: {
- tabindex: '0',
+ role: 'article',
},
})
export class LevelCard {
- protected translation = inject(TranslationService).translation;
+ private translationSvc = inject(TranslationService);
+ protected translation = this.translationSvc.translation;
artist = input.required();
trackName = input.required();
creator = input([]);
creatorString = computed(() => this.creator().join(' & '));
+
+ previewButtonLabel = computed(() =>
+ this.translationSvc.interpolate(this.translation.levelCard.preview, {
+ artist: this.artist(),
+ trackName: this.trackName(),
+ }),
+ );
+
+ downloadButtonLabel = computed(() =>
+ this.translationSvc.interpolate(this.translation.levelCard.download, {
+ creator: this.creatorString()
+ }),
+ );
}
diff --git a/src/app/i18n/en.ts b/src/app/i18n/en.ts
index 502f19e..9d8a7ca 100644
--- a/src/app/i18n/en.ts
+++ b/src/app/i18n/en.ts
@@ -22,8 +22,10 @@ export const EN = {
close: 'Close',
save: 'Save',
skipToContent: 'Skip to main content',
- preview: 'Soundtrack Preview',
- download: 'Download',
+ },
+ levelCard: {
+ preview: '{{trackName}} by {{artist}} Preview',
+ download: "{{creator}}'s Level Download",
},
};
diff --git a/src/app/i18n/jp.ts b/src/app/i18n/jp.ts
index fe660af..ac7a06d 100644
--- a/src/app/i18n/jp.ts
+++ b/src/app/i18n/jp.ts
@@ -24,7 +24,9 @@ export const JP: Translation = {
close: '閉じる',
save: '保存',
skipToContent: '本文へスキップ',
- preview: '楽曲プレビュー',
- download: 'ダウンロード',
+ },
+ levelCard: {
+ preview: '{{artist}}の{{trackName}} プレビュー',
+ download: '{{creator}}のレベルをダウンロード',
},
};
diff --git a/src/app/i18n/kr.ts b/src/app/i18n/kr.ts
index 56ae8c3..fcdd271 100644
--- a/src/app/i18n/kr.ts
+++ b/src/app/i18n/kr.ts
@@ -24,7 +24,9 @@ export const KR: Translation = {
close: '닫기',
save: '저장',
skipToContent: '본문으로 건너뛰기',
- preview: '곡 프리뷰',
- download: '다운로드',
+ },
+ levelCard: {
+ preview: '{{artist}}의 {{trackName}} 미리듣기',
+ download: `{{creator}}의 레벨 다운로드`,
},
};
diff --git a/src/app/services/translation.service.ts b/src/app/services/translation.service.ts
index 9fec3a0..f6b9877 100644
--- a/src/app/services/translation.service.ts
+++ b/src/app/services/translation.service.ts
@@ -29,4 +29,14 @@ export class TranslationService {
readonly translation = new Proxy({} as Translation, {
get: (_, prop) => this._translation()[prop as keyof Translation]
});
+
+ /**
+ * 문자열 내의 플레이스홀더(예: {{name}})를 실제 값으로 치환합니다.
+ */
+ interpolate(text: string, params: Record): string {
+ return Object.entries(params).reduce(
+ (acc, [key, value]) => acc.replace(new RegExp(`{{${key}}}`, 'g'), String(value)),
+ text
+ );
+ }
}