Merge pull request #22 from 4Furki4/definition-rendering

fix: voices being generated by the related word

src/app/components/main/definition/definition.component.html

@@ -5,7 +5,7 @@
                 <h1 class="definition__title">
                     {{word.madde }}
                 </h1>
-                <ng-container *ngIf="word.cogul_mu ==='1' || word.telaffuz || word.lisan">
+                <ng-container *ngIf="word.cogul_mu ==='1' || word.telaffuz || word.lisan || voiceCodesAndWords">
                     <div class="definition__types">
                         <p>
                             <i *ngIf="word.cogul_mu === '1'">
@@ -18,9 +18,9 @@ <h1 class="definition__title">
                                 {{word.lisan}}
                             </i>
                         </p>
-                        <ng-container *ngIf="voiceSource">
+                        <ng-container *ngIf="voiceCodesAndWords">
                             <div class="definition__play-button--wrapper">
-                                <button (click)="playSound()" class="definition__play-button">
+                                <button (click)="playSound(word.madde)" class="definition__play-button">
 
                                 </button>
                             </div>

src/app/components/main/definition/definition.component.ts

@@ -37,10 +37,12 @@ export class DefinitionComponent implements OnInit {
   words !: WordResponse[];
   wordErrorResponse = new WordErrorResponse();
   anlamList: Array<string[]> = [];
-  voiceSource !: string | undefined;
-  playSound() {
-    if (!this.voiceSource) return
-    const audio = new Audio(this.voiceSource);
+  voiceCodesAndWords !: any[]
+  playSound(word: string) {
+    if (!this.voiceCodesAndWords) return
+    const relatedVoiceCode = this.voiceCodesAndWords.find((item) => item.word === word).voiceCode;
+    const relatedSource = `${environment.apiUrl}/ses/${relatedVoiceCode}.wav`
+    const audio = new Audio(relatedSource);
     audio.play();
   }
   searchedWord = this.activatedRoute.paramMap.pipe(
@@ -51,8 +53,12 @@ export class DefinitionComponent implements OnInit {
       return of(word)
     })).subscribe((word) => {
       this.wordService.requestVoiceCode(word).subscribe((responses) => {
-        const voiceCode = responses.filter((response) => response.seskod).at(0)?.seskod
-        this.voiceSource = voiceCode ? `${environment.apiUrl}/ses/${voiceCode}.wav` : undefined
+        this.voiceCodesAndWords = responses.filter((response) => response.seskod).map((filteredResponse) => {
+          return {
+            word: filteredResponse.sozu.trim(),
+            voiceCode: filteredResponse.seskod
+          }
+        })
       }
       )
       this.wordService.requestWordMeaning(word).subscribe((response: WordResponse[] | WordErrorResponse) => {
@@ -81,6 +87,7 @@ export class DefinitionComponent implements OnInit {
         this.anlamList.push(anlamOzellikListe)
       })
       this.words = response
+      console.log(this.words);
     }
   }
 }