From 951e38bcb1a4d653ecc94bb831e6ff05a42277d3 Mon Sep 17 00:00:00 2001 From: root Date: Mon, 30 Jun 2025 11:11:49 +0200 Subject: [PATCH] Fix translation errors and improve conversation flow - Add proper German fallbacks for all user-facing text - Fix 'Share your thoughts', 'Submit', 'You' translations - Improve context sent to AI with originalTopic and context type - Reset conversation state properly to prevent duplicate messages - Add better German translations for welcome messages and fallback questions - Improve choice button translations and prompts - Fix weird AI responses by providing better context to server --- html/kidsai/script-new.js | 57 +++++++++++++++++++++------------------ 1 file changed, 31 insertions(+), 26 deletions(-) diff --git a/html/kidsai/script-new.js b/html/kidsai/script-new.js index 6afc393..0b36801 100644 --- a/html/kidsai/script-new.js +++ b/html/kidsai/script-new.js @@ -237,12 +237,13 @@ class KidsAIExplorer { // Show thinking section this.thinkingSection.classList.remove('hidden'); - // Clear previous content + // Clear previous content completely this.thinkingSteps.innerHTML = ''; - // Initialize conversation state + // Reset conversation state this.currentStep = 0; this.userAnswers = []; + this.currentQuestionIndex = 0; // Create conversation container const conversationContainer = document.createElement('div'); @@ -254,9 +255,9 @@ class KidsAIExplorer { welcomeStep.className = 'conversation-step visible'; // Get translations before creating HTML to avoid context issues - const encouragementText = guidance.encouragement || this.getTranslation('default-encouragement') || "Great question! Let's explore this together step by step! 🚀"; - const detectiveHelpText = this.getTranslation('detective-help') || "Instead of giving you the answer right away, I'll help you think through this like a detective! 🕵️"; - const aiTeacherText = this.getTranslation('ai-teacher') || "AI Teacher"; + const encouragementText = guidance.encouragement || this.getTranslation('default-encouragement') || (this.currentLanguage === 'de' ? "Fantastische Frage! Lass uns das gemeinsam Schritt für Schritt erforschen! 🚀" : "Great question! Let's explore this together step by step! 🚀"); + const detectiveHelpText = this.getTranslation('detective-help') || (this.currentLanguage === 'de' ? "Anstatt dir die Antwort gleich zu geben, helfe ich dir dabei, wie ein Detektiv zu denken! 🕵️" : "Instead of giving you the answer right away, I'll help you think through this like a detective! 🕵️"); + const aiTeacherText = this.getTranslation('ai-teacher') || (this.currentLanguage === 'de' ? "KI-Lehrer" : "AI Teacher"); welcomeStep.innerHTML = `
@@ -274,15 +275,14 @@ class KidsAIExplorer { // Add thinking questions as interactive steps const questions = guidance.steps ? guidance.steps.map(step => step.text) : guidance.questions || [ - "What do you already know about this topic?", - "What do you think might be the reason for this?", - "Can you think of any examples or similar situations?" + this.currentLanguage === 'de' ? "Was weißt du bereits über dieses Thema?" : "What do you already know about this topic?", + this.currentLanguage === 'de' ? "Was denkst du, könnte der Grund dafür sein?" : "What do you think might be the reason for this?", + this.currentLanguage === 'de' ? "Kannst du dir Beispiele oder ähnliche Situationen vorstellen?" : "Can you think of any examples or similar situations?" ]; // Create chat interface this.conversationContainer = conversationContainer; this.questions = questions; - this.currentQuestionIndex = 0; // Start the conversation with the first question this.askNextQuestion(); @@ -506,7 +506,10 @@ class KidsAIExplorer { ? this.questions[questionIndex] : 'the current question'; - console.log('📤 Sending chat request to /api/respond-to-answer:', { answer, currentQuestion }); + // Get the original topic for better context + const originalQuestion = this.questionInput ? this.questionInput.value.trim() : ''; + + console.log('📤 Sending chat request to /api/respond-to-answer:', { answer, currentQuestion, originalQuestion }); // Call server API for contextual response const response = await fetch('/api/respond-to-answer', { @@ -517,8 +520,10 @@ class KidsAIExplorer { body: JSON.stringify({ answer: answer, question: currentQuestion, + originalTopic: originalQuestion, language: this.currentLanguage, - stepIndex: questionIndex + stepIndex: questionIndex, + context: 'guided_learning_conversation' }) }); @@ -592,16 +597,16 @@ class KidsAIExplorer { addContinueChoiceButtons() { // Get translations before creating HTML to avoid context issues - const exploreDeeperText = this.getTranslation('explore-deeper') || "I want to explore this deeper"; - const continueLearningText = this.getTranslation('continue-learning') || "Continue with next topic"; - const tellMeMoreText = this.getTranslation('tell-me-more') || "Tell me more! 🤔"; - const nextQuestionText = this.getTranslation('next-question') || "Next question! ➡️"; + const exploreDeeperText = this.getTranslation('explore-deeper') || (this.currentLanguage === 'de' ? "Ich möchte das tiefer erforschen" : "I want to explore this deeper"); + const continueLearningText = this.getTranslation('continue-learning') || (this.currentLanguage === 'de' ? "Mit dem nächsten Thema fortfahren" : "Continue with next topic"); + const tellMeMoreText = this.getTranslation('tell-me-more') || (this.currentLanguage === 'de' ? "Erzähl mir mehr! 🤔" : "Tell me more! 🤔"); + const nextQuestionText = this.getTranslation('next-question') || (this.currentLanguage === 'de' ? "Nächste Frage! ➡️" : "Next question! ➡️"); const choiceContainer = document.createElement('div'); choiceContainer.className = 'choice-container'; choiceContainer.innerHTML = `
-

💭 ${exploreDeeperText} oder ${continueLearningText}?

+

💭 ${exploreDeeperText} ${this.currentLanguage === 'de' ? 'oder' : 'or'} ${continueLearningText}?

`; @@ -767,7 +772,7 @@ class KidsAIExplorer { const answer = textarea.value.trim(); if (!answer) { - const message = this.getTranslation('write-thoughts') || 'Please write down your thoughts! 🤔'; + const message = this.getTranslation('write-thoughts') || (this.currentLanguage === 'de' ? 'Bitte schreibe deine Gedanken auf! 🤔' : 'Please write down your thoughts! 🤔'); this.showMessage(message, 'warning'); return; } @@ -778,7 +783,7 @@ class KidsAIExplorer { userBubble.innerHTML = `
👤 - ${this.getTranslation('you') || 'You'} + ${this.getTranslation('you') || (this.currentLanguage === 'de' ? 'Du' : 'You')}

${answer}

@@ -958,13 +963,13 @@ class KidsAIExplorer { inputContainer.className = 'user-input-container'; inputContainer.innerHTML = `
-

💭 ${this.getTranslation('share-thoughts') || 'Share your thoughts:'}

+

💭 ${this.getTranslation('share-thoughts') || (this.currentLanguage === 'de' ? 'Teile deine Gedanken mit:' : 'Share your thoughts:')}

-
`; @@ -994,7 +999,7 @@ class KidsAIExplorer { const answer = textarea.value.trim(); if (!answer) { - const message = this.getTranslation('write-thoughts') || 'Please write down your thoughts! 🤔'; + const message = this.getTranslation('write-thoughts') || (this.currentLanguage === 'de' ? 'Bitte schreibe deine Gedanken auf! 🤔' : 'Please write down your thoughts! 🤔'); this.showMessage(message, 'warning'); return; } @@ -1005,7 +1010,7 @@ class KidsAIExplorer { userBubble.innerHTML = `
👤 - ${this.getTranslation('you') || 'You'} + ${this.getTranslation('you') || (this.currentLanguage === 'de' ? 'Du' : 'You')}

${answer}