feat(04-04): wire audio and speech into lesson, reward, forest, and app

- playCorrectSound() on correct keypress in letter and word exercises
- playRewardSound() when reward image appears
- speakText() for companion comment on reward screen
- playForestElementSound() when new forest element renders
- speakText() for companion greeting on forest screen

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-29 18:22:40 +02:00
co-authored by Claude Opus 4.6
parent a55238f1f9
commit b453efebb4
4 changed files with 20 additions and 9 deletions
+6 -2
View File
@@ -20,6 +20,8 @@ import {
import { getForestComment } from "../companion/companion";
import { getRandomFallbackForestComment } from "../companion/fallbacks";
import type { CompanionType, ForestElement } from "../types";
import { playRewardSound } from "../audio/sounds";
import { speakText } from "../audio/speech";
// --- Element types for random selection ---
@@ -192,16 +194,18 @@ export async function initRewardScreen(
};
const elementId = await saveForestElement(db, element);
// 6. Replace placeholder with actual image
// 6. Replace placeholder with actual image + play reward sound
const objectUrl = URL.createObjectURL(result.blob);
imageArea.innerHTML = "";
const img = document.createElement("img");
img.src = objectUrl;
img.alt = result.description;
imageArea.appendChild(img);
playRewardSound();
// 7. Show companion comment
// 7. Show companion comment + speak it aloud
companionTextEl.textContent = comment;
speakText(comment);
// 8. Wire buttons
continueBtn.onclick = () => {
+2
View File
@@ -1,6 +1,7 @@
import type { Progress, LevelStatus } from "../types";
import { levels } from "../game/levels";
import { getProgress, getForestElements } from "../storage/db";
import { playForestElementSound } from "../audio/sounds";
let activeObjectUrls: string[] = [];
@@ -44,6 +45,7 @@ export async function renderForestScene(
// Animate newly added element
if (element.id === newElementId) {
slot.classList.add("forest__element--new");
playForestElementSound();
}
slot.appendChild(img);