Korean WH-Questions – Family<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n background-color: #ffffff;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column; \/* Stack elements vertically *\/\n min-height: 100vh;\n }\n .menu {\n width: 100%;\n background-color: #0f7bd9; \/* Updated color for differentiation *\/\n padding: 10px;\n text-align: center;\n box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);\n flex-shrink: 0;\n overflow-x: auto;\n white-space: nowrap;\n }\n .menu a {\n color: #fff;\n text-decoration: none;\n margin: 0 8px;\n font-weight: bold;\n font-size: 14px;\n display: inline-block;\n }\n .menu a:hover {\n text-decoration: underline;\n }\n .container {\n display: flex;\n flex-wrap: wrap;\n flex: 1 0 auto;\n padding: 10px;\n box-sizing: border-box;\n justify-content: center;\n }\n .image-container, .chat-container {\n width: 100%;\n max-width: 600px;\n margin-bottom: 20px;\n }\n .image-container {\n text-align: center;\n }\n .image-container img {\n width: 100%;\n height: auto;\n border-radius: 20px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n }\n .question-text {\n margin: 10px 0;\n font-weight: bold;\n color: #333;\n font-size: 16px;\n }\n .question-box {\n margin-top: 10px;\n padding: 10px;\n background-color: #fff;\n border: 2px solid #096c02; \/* Updated color for differentiation *\/\n border-radius: 10px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n font-size: 18px;\n font-weight: bold;\n color: #096c02;\n text-align: left;\n max-height: 300px;\n overflow-y: auto;\n }\n .chat-container {\n background-color: #096c02; \/* Updated color for differentiation *\/\n border-radius: 20px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n overflow: hidden;\n }\n .chat-header {\n background-color: #0f7bd9; \/* Updated color for differentiation *\/\n color: #fff;\n padding: 10px;\n text-align: center;\n border-bottom: 1px solid #0a6901;\n }\n .chat-header h2 {\n margin: 0;\n font-size: 18px;\n }\n .chat-messages {\n padding: 10px;\n overflow-y: auto;\n max-height: 300px;\n background-color: #fff;\n }\n .message {\n margin-bottom: 10px;\n padding: 10px;\n border-radius: 5px;\n font-size: 14px;\n line-height: 1.4;\n }\n .user-message {\n background-color: #4caf50;\n color: #fff;\n text-align: right;\n }\n .bot-message {\n background-color: #2196f3;\n color: #fff;\n text-align: left;\n }\n .chat-input {\n display: flex;\n align-items: center;\n background-color: #a3e106;\n padding: 10px;\n justify-content: center;\n }\n .send-button, .stop-button {\n background-color: #17c686;\n color: #fff;\n font-weight: bold;\n border: none;\n border-radius: 5px;\n padding: 8px 10px;\n cursor: pointer;\n transition: background-color 0.3s;\n flex: 1;\n margin: 0 5px;\n max-width: 150px;\n font-size: 14px;\n }\n .stop-button {\n background-color: #c86722;\n }\n .chat-input input {\n flex: 2;\n padding: 8px;\n margin-right: 10px;\n border: 2px solid #096c02; \/* Updated color for differentiation *\/\n border-radius: 5px;\n font-size: 16px;\n }\n\n \/* Optional: Voice Selection Dropdown Styling *\/\n .voice-selection {\n margin-top: 10px;\n text-align: center;\n }\n .voice-selection select {\n padding: 5px;\n font-size: 14px;\n border-radius: 5px;\n border: 1px solid #ccc;\n width: 80%;\n max-width: 300px;\n }\n\n \/* Adjustments for smaller screens *\/\n @media (max-width: 600px) {\n .menu a {\n margin: 0 5px;\n font-size: 12px;\n }\n .question-text {\n font-size: 14px;\n }\n .question-box {\n font-size: 14px;\n max-height: 200px;\n }\n .chat-header h2 {\n font-size: 16px;\n }\n .chat-messages {\n max-height: 200px;\n }\n .message {\n font-size: 13px;\n }\n .send-button, .stop-button {\n padding: 6px 8px;\n font-size: 12px;\n max-width: 120px;\n }\n .chat-input input {\n font-size: 14px;\n }\n }\n @media (max-width: 400px) {\n .menu a {\n margin: 0 3px;\n font-size: 11px;\n }\n .question-text {\n font-size: 13px;\n }\n .question-box {\n font-size: 13px;\n max-height: 150px;\n }\n .chat-header h2 {\n font-size: 14px;\n }\n .chat-messages {\n max-height: 150px;\n }\n .message {\n font-size: 12px;\n }\n .send-button, .stop-button {\n padding: 5px 6px;\n font-size: 11px;\n max-width: 100px;\n }\n .chat-input input {\n font-size: 12px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"menu\">\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-vocabulary-family\/\">Vocabulary<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-sentences-family\/\">Sentences<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-yes-no-question-family\/\">Yes\/No Questions<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-wh-question-family\/\">WH-Questions<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-like-question-family\/\">Like-Questions<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-interaction-family\/\">Interactions<\/a> \n <\/div>\n\n <div class=\"container\">\n <div class=\"image-container\">\n <img decoding=\"async\" src=\"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/09\/korean.jpg\" alt=\"Lesson Robot\">\n <div class=\"question-text\">Check the questions in this box<\/div>\n <div id=\"question-box\" class=\"question-box\">\n \n <\/div>\n \n <div class=\"voice-selection\">\n <label for=\"voice-select\">Choose Korean Voice: <\/label>\n <select id=\"voice-select\" aria-label=\"Select Korean Voice\">\n <option value=\"\">Default<\/option>\n \n <\/select>\n <\/div>\n <\/div>\n <div class=\"chat-container\">\n <div class=\"chat-header\"> \n <h2>Korean WH-Questions – Family<\/h2>\n <\/div>\n <div class=\"chat-messages\" id=\"chat-messages\">\n \n <\/div>\n <div class=\"chat-input\">\n <input type=\"text\" id=\"user-input\" placeholder=\"Type your answer here...\" style=\"display: none;\" aria-label=\"User Input\" \/>\n <button id=\"submit-btn\" class=\"send-button\" style=\"display: none;\" aria-label=\"Submit Answer\">Submit<\/button>\n <button id=\"start-btn\" class=\"send-button\" aria-label=\"Start Lesson\">Start Lesson<\/button>\n <button id=\"stop-btn\" class=\"stop-button\" aria-label=\"Stop Lesson\">Stop<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n const whQuestions = [\n { question: \"\ub204\uac00 \uac00\uc871\uc744 \ub3cc\ubcf4\ub098\uc694?\", translation: \"Who takes care of the family?\" },\n { question: \"\ubb34\uc5c7\uc744 \uc88b\uc544\ud558\uc138\uc694?\", translation: \"What do you like?\" },\n { question: \"\uc5b4\ub514\uc5d0 \uc0b4\uace0 \uc788\ub098\uc694?\", translation: \"Where do you live?\" },\n { question: \"\uc5b8\uc81c \uac00\uc871\uacfc \uc2dc\uac04\uc744 \ubcf4\ub0b4\uc138\uc694?\", translation: \"When do you spend time with your family?\" },\n { question: \"\uc5b4\ub5bb\uac8c \uac00\uc871\uc744 \uc9c0\uc6d0\ud558\uc2dc\ub098\uc694?\", translation: \"How do you support your family?\" },\n { question: \"\uc65c \uac00\uc871\uc774 \uc911\uc694\ud558\ub2e4\uace0 \uc0dd\uac01\ud558\ub098\uc694?\", translation: \"Why do you think family is important?\" },\n { question: \"\ub204\uad6c\uc640 \uac00\uc7a5 \uce5c\ud55c\uac00\uc694?\", translation: \"With whom are you closest?\" },\n { question: \"\uc5b4\ub5a4 \ud65c\ub3d9\uc744 \uac00\uc871\uacfc \ud568\uaed8 \ud558\uc138\uc694?\", translation: \"What activities do you do with your family?\" },\n { question: \"\uc5b4\ub514\uc5d0\uc11c \uac00\uc871\uacfc \ubaa8\uc784\uc744 \uac00\uc9c0\ub098\uc694?\", translation: \"Where do you have family gatherings?\" },\n { question: \"\ubb34\uc5c7\uc744 \ud1b5\ud574 \uac00\uc871\uacfc \uc18c\ud1b5\ud558\ub098\uc694?\", translation: \"Through what do you communicate with your family?\" },\n { question: \"\uc5b8\uc81c \uac00\uc871\uacfc \uc5ec\ud589\uc744 \uac00\ub098\uc694?\", translation: \"When do you go on trips with your family?\" },\n { question: \"\uc5b4\ub5bb\uac8c \uac00\uc871\uc758 \uc804\ud1b5\uc744 \uc720\uc9c0\ud558\ub098\uc694?\", translation: \"How do you maintain family traditions?\" },\n { question: \"\uc65c \uac00\uc871\uacfc\uc758 \uad00\uacc4\ub97c \uc18c\uc911\ud788 \uc5ec\uae30\ub098\uc694?\", translation: \"Why do you value your relationship with your family?\" },\n { question: \"\ub204\uad6c\uc640 \uac00\uc871 \uc678\uc5d0\ub3c4 \uc2dc\uac04\uc744 \ubcf4\ub0b4\ub098\uc694?\", translation: \"With whom else do you spend time besides family?\" },\n { question: \"\uc5b4\ub5a4 \ubc29\uc2dd\uc73c\ub85c \uac00\uc871\uc744 \ucd95\ud558\ud558\ub098\uc694?\", translation: \"In what ways do you celebrate your family?\" },\n { question: \"\uc5b4\ub514\uc5d0\uc11c \uac00\uc871 \uc0ac\uc9c4\uc744 \ucc0d\ub098\uc694?\", translation: \"Where do you take family photos?\" },\n { question: \"\ubb34\uc5c7\uc744 \ud1b5\ud574 \uac00\uc871\uc758 \uac74\uac15\uc744 \uc9c0\ud0a4\ub098\uc694?\", translation: \"How do you maintain your family's health?\" },\n { question: \"\uc5b8\uc81c \uac00\uc871\uacfc \uc911\uc694\ud55c \uacb0\uc815\uc744 \ub0b4\ub9ac\ub098\uc694?\", translation: \"When do you make important decisions with your family?\" },\n { question: \"\uc5b4\ub5bb\uac8c \uac00\uc871\uc758 \uc7ac\uc815\uc744 \uad00\ub9ac\ud558\ub098\uc694?\", translation: \"How do you manage your family's finances?\" },\n { question: \"\uc65c \uac00\uc871\uacfc\uc758 \uad00\uacc4\ub97c \uc18c\uc911\ud788 \uc5ec\uae30\ub098\uc694?\", translation: \"Why do you value your relationship with your family?\" }\n ];\n\n let currentQuestionIndex = 0;\n let repeatAttempts = 0;\n let isSpeechRecognitionSupported = false;\n let recognition;\n\n const stopKeywords = [\"\uc548\ub155\", \"\uc798 \uac00\", \"\uad7f\ubc14\uc774\", \"bye\", \"bye bye\", \"byebye\", \"\ub610 \ub9cc\ub098\uc694\", \"\ucc98\uc74c \ubd59\uaca0\uc2b5\ub2c8\ub2e4\"];\n const speechSynthesisSupported = 'speechSynthesis' in window;\n\n let selectedVoice = null; \/\/ Variable to hold the selected voice\n\n \/\/ Feature detection for Speech Recognition\n if (window.SpeechRecognition || window.webkitSpeechRecognition) {\n isSpeechRecognitionSupported = true;\n recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();\n recognition.lang = 'ko-KR';\n recognition.interimResults = false;\n recognition.maxAlternatives = 1;\n }\n\n \/\/ Function to populate the voice selection dropdown\n function populateVoiceList() {\n const voiceSelect = document.getElementById('voice-select');\n const voices = speechSynthesis.getVoices().filter(voice => voice.lang === 'ko-KR');\n\n \/\/ Sort voices alphabetically by name\n voices.sort((a, b) => a.name.localeCompare(b.name));\n\n voices.forEach((voice, index) => {\n const option = document.createElement('option');\n option.value = index;\n \/\/ Attempt to infer gender from voice name\n let gender = \"Unknown\";\n if (\/female\/i.test(voice.name)) {\n gender = \"Female\";\n } else if (\/male\/i.test(voice.name)) {\n gender = \"Male\";\n }\n option.textContent = `${voice.name} (${gender})`;\n voiceSelect.appendChild(option);\n });\n\n \/\/ If no Korean voices are found, inform the user\n if (voices.length === 0) {\n const option = document.createElement('option');\n option.value = \"\";\n option.textContent = \"No Korean voices available\";\n voiceSelect.appendChild(option);\n }\n }\n\n window.onload = function() {\n if (speechSynthesisSupported) {\n if (window.speechSynthesis.getVoices().length === 0) {\n \/\/ Voices not loaded yet, wait for the event\n window.speechSynthesis.onvoiceschanged = function() {\n populateVoiceList();\n greetUser();\n };\n } else {\n \/\/ Voices already loaded\n populateVoiceList();\n greetUser();\n }\n } else {\n alert('Sorry, your browser does not support speech synthesis. Please use a compatible browser for the best experience.');\n appendMessage('Speech synthesis not supported in your browser.', 'bot');\n }\n\n if (!isSpeechRecognitionSupported) {\n \/\/ Show text input and submit button\n document.getElementById('user-input').style.display = 'block';\n document.getElementById('submit-btn').style.display = 'block';\n \/\/ Optionally hide the start button\n \/\/ document.getElementById('start-btn').style.display = 'none';\n }\n\n \/\/ Event listener for voice selection\n document.getElementById('voice-select').addEventListener('change', function() {\n const selectedIndex = this.value;\n const voices = speechSynthesis.getVoices().filter(voice => voice.lang === 'ko-KR');\n if (selectedIndex !== \"\") {\n selectedVoice = voices[selectedIndex];\n } else {\n selectedVoice = null; \/\/ Default voice\n }\n });\n };\n\n function greetUser() {\n let greeting = \"Welcome! In this lesson, you will learn 20 WH questions about family in Korean. I will say each question twice, and then you will repeat.\";\n if (!isSpeechRecognitionSupported) {\n greeting += \" Your browser does not support voice input, so please type your responses in the text box below.\";\n }\n greeting += \" Are you ready? Click Start Lesson to begin.\";\n appendMessage(greeting, 'bot');\n sayText(greeting, 'en');\n }\n\n document.getElementById('start-btn').onclick = function() {\n currentQuestionIndex = 0;\n repeatAttempts = 0;\n startQuestionLesson();\n };\n\n document.getElementById('stop-btn').onclick = function() {\n endLesson(true); \/\/ Stop the lesson when \"Stop\" button is clicked\n };\n\n \/\/ Handle submit button click\n document.getElementById('submit-btn').onclick = function() {\n let userInput = document.getElementById('user-input').value.trim().toLowerCase();\n document.getElementById('user-input').value = '';\n if (userInput) {\n processUserResponse(userInput);\n }\n };\n\n \/\/ Allow pressing 'Enter' to submit the answer\n document.getElementById('user-input').addEventListener('keypress', function(event) {\n if (event.key === 'Enter') {\n event.preventDefault();\n document.getElementById('submit-btn').click();\n }\n });\n\n function startQuestionLesson() {\n if (currentQuestionIndex < whQuestions.length) {\n const question = whQuestions[currentQuestionIndex].question;\n const translation = whQuestions[currentQuestionIndex].translation;\n\n appendMessage(`'${question}' - '${translation}'`, 'bot');\n addQuestionToBox(question, translation);\n sayText(question, \"ko-KR\", function() {\n setTimeout(() => {\n sayText(question, \"ko-KR\", function() {\n setTimeout(() => {\n if (isSpeechRecognitionSupported) {\n \/\/ Prompt user to repeat\n appendMessage(`Please repeat after me: '${question}'`, 'bot');\n sayText(\"Please repeat after me:\", \"en\", function() {\n sayText(`${question}`, \"ko-KR\", function() {\n listenUserResponse(question);\n });\n });\n } else {\n \/\/ Prompt user to type\n appendMessage(`Please type the question '${question}' in the text box below.`, 'bot');\n sayText(`Please type the question '${question}' in the text box below.`, \"en\");\n \/\/ Focus the text input\n document.getElementById('user-input').focus();\n }\n }, 500); \/\/ Small pause before prompt\n });\n }, 500); \/\/ Small pause before second repetition\n });\n } else {\n endLesson();\n }\n }\n\n function listenUserResponse(expectedQuestion) {\n recognition.start();\n\n recognition.onresult = function(event) {\n let userInput = event.results[0][0].transcript.trim().toLowerCase();\n appendMessage(userInput, 'user');\n\n processUserResponse(userInput, expectedQuestion);\n };\n\n recognition.onspeechend = function() {\n recognition.stop();\n };\n\n recognition.onerror = function(event) {\n let errorMessage = '';\n switch(event.error) {\n case 'no-speech':\n errorMessage = 'No speech detected. Please try again or type your answer.';\n break;\n case 'audio-capture':\n errorMessage = 'Microphone access denied. Please check your settings or type your answer.';\n break;\n case 'not-allowed':\n errorMessage = 'Permission to use microphone denied.';\n break;\n default:\n errorMessage = 'An error occurred: ' + event.error;\n }\n appendMessage(errorMessage, 'bot');\n sayText(errorMessage, 'en');\n };\n }\n\n function processUserResponse(userInput, expectedQuestion = whQuestions[currentQuestionIndex].question) {\n appendMessage(userInput, 'user');\n\n if (stopKeywords.includes(userInput.toLowerCase())) {\n endLesson(true); \/\/ User requested to stop the lesson\n return;\n }\n\n \/\/ Normalize questions by removing spaces and punctuation for comparison\n const normalize = (str) => str.replace(\/\\s+\/g, '').replace(\/[.,\\\/#!$%\\^&\\*;:{}=\\-_`~()]\/g,\"\").toLowerCase();\n if (normalize(userInput) === normalize(expectedQuestion)) {\n const positiveMessage = \"Great! Your pronunciation is good.\";\n appendMessage(positiveMessage, 'bot');\n sayText(positiveMessage, 'en'); \/\/ Feedback in English\n repeatAttempts = 0; \/\/ Reset the attempts counter\n currentQuestionIndex++;\n setTimeout(startQuestionLesson, 2000); \/\/ Move to next question after 2 seconds\n } else {\n repeatAttempts++;\n if (repeatAttempts < 2) {\n appendMessage(`That's not correct. Listen again: '${expectedQuestion}'. Now try again.`, 'bot');\n\n \/\/ Split the message into parts\n sayText(\"That's not correct. Listen again:\", 'en', function() {\n sayText(`${expectedQuestion}`, 'ko-KR', function() {\n sayText(\"Now try again.\", 'en', function() {\n setTimeout(() => {\n if (isSpeechRecognitionSupported) {\n \/\/ Prompt user to repeat\n appendMessage(`Please repeat after me: '${expectedQuestion}'`, 'bot');\n sayText(\"Please repeat after me:\", \"en\", function() {\n sayText(`${expectedQuestion}`, \"ko-KR\", function() {\n listenUserResponse(expectedQuestion);\n });\n });\n } else {\n \/\/ Focus the text input\n document.getElementById('user-input').focus();\n }\n }, 500); \/\/ Small pause before prompt\n });\n });\n });\n } else {\n const nextQuestionMessage = `You've tried twice. The correct question is '${expectedQuestion}'. Let's move on to the next question.`;\n appendMessage(nextQuestionMessage, 'bot');\n\n \/* \n Adjusted speech sequence:\n 1. Speak \"You've tried twice.\"\n 2. Speak \"The correct question is '\ub2f9\uc2e0\uc740 \uac00\uc871\uacfc \ud568\uaed8 \uc0b4\uace0 \uc788\ub098\uc694?'.\"\n 3. Speak \"Let's move on to the next question.\"\n *\/\n \/\/ Step 1: Speak \"You've tried twice.\"\n sayText(\"You've tried twice.\", \"en\", function() {\n \/\/ Step 2: Speak the Korean question\n sayText(`The correct question is '${expectedQuestion}'.`, \"ko-KR\", function() {\n \/\/ Step 3: Speak \"Let's move on to the next question.\"\n sayText(\"Let's move on to the next question.\", \"en\", function() {\n repeatAttempts = 0; \/\/ Reset the attempts counter\n currentQuestionIndex++;\n setTimeout(startQuestionLesson, 2000); \/\/ Move to next question after 2 seconds\n });\n });\n });\n }\n }\n }\n\n function addQuestionToBox(question, translation) {\n const questionBox = document.getElementById('question-box');\n const questionElement = document.createElement('div');\n questionElement.innerText = `'${question}' - '${translation}'`;\n questionElement.style.cursor = 'pointer';\n questionElement.style.padding = '5px';\n questionElement.style.borderBottom = '1px solid #ccc';\n questionElement.addEventListener('click', () => sayText(question, 'ko-KR'));\n questionBox.appendChild(questionElement);\n }\n\n function endLesson(userStopped = false) {\n let message;\n if (userStopped) {\n message = \"Thank you for learning today! I hope you enjoyed the lesson.\";\n } else {\n message = \"Well done! You've learned 20 WH questions related to family. Keep practicing!\";\n }\n appendMessage(message, \"bot\");\n sayText(message, \"en\"); \/\/ End feedback in English\n }\n\n function sayText(text, lang, callback) {\n if (!speechSynthesisSupported) {\n if (callback) callback();\n return;\n }\n const utterance = new SpeechSynthesisUtterance(text);\n utterance.lang = lang;\n \/\/ Adjust rate and pitch for Korean\n if (lang.startsWith('ko')) {\n utterance.rate = 1.0;\n utterance.pitch = 1.0;\n } else {\n utterance.rate = 1.0;\n utterance.pitch = 1.0;\n }\n\n \/\/ Select the desired voice\n if (lang.startsWith('ko')) {\n if (selectedVoice) {\n utterance.voice = selectedVoice;\n } else {\n \/\/ Filter voices to find native Korean voices\n const koreanVoices = speechSynthesis.getVoices().filter(voice => voice.lang === 'ko-KR');\n if (koreanVoices.length > 0) {\n \/\/ Prefer female voices for naturalness\n selectedVoice = koreanVoices.find(voice => \/female\/i.test(voice.name)) || koreanVoices[0];\n utterance.voice = selectedVoice;\n } else {\n \/\/ No native Korean voices found\n appendMessage(\"No native Korean voices available. Please install or enable Korean voices on your device for the best experience.\", 'bot');\n sayText(\"No native Korean voices available. Please install or enable Korean voices on your device for the best experience.\", 'en', callback);\n return;\n }\n }\n } else {\n \/\/ For English or other languages, select the default voice\n const voices = speechSynthesis.getVoices();\n let selectedEnglishVoice = voices.find(voice => voice.lang === lang) || voices.find(voice => voice.lang.startsWith(lang));\n if (selectedEnglishVoice) {\n utterance.voice = selectedEnglishVoice;\n }\n }\n\n utterance.onend = function() {\n if (callback) callback();\n };\n window.speechSynthesis.speak(utterance);\n }\n\n function appendMessage(text, sender) {\n const messageContainer = document.getElementById('chat-messages');\n const messageElement = document.createElement('div');\n messageElement.classList.add('message');\n messageElement.classList.add(sender === 'bot' ? 'bot-message' : 'user-message');\n messageElement.innerText = text;\n messageContainer.appendChild(messageElement);\n messageContainer.scrollTop = messageContainer.scrollHeight;\n }\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Korean WH-Questions – Family Vocabulary Sentences Yes\/No Questions WH-Questions Like-Questions Interactions Check the questions in this box Choose Korean Voice: Default Korean WH-Questions – Family Submit Start Lesson Stop<\/p>\n","protected":false},"author":1,"featured_media":1385,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[46,45,34],"tags":[],"class_list":["post-1759","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-family-korean","category-korean","category-robots"],"featured_image_src":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/DALL\u00b7E-2024-06-09-11.08.10-Two-girls-practicing-speaking-English-in-a-classroom.-The-classroom-has-a-whiteboard-with-some-English-sentences-written-on-it-desks-and-chairs-arran-1024x585.webp","blog_images":{"medium":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/DALL\u00b7E-2024-06-09-11.08.10-Two-girls-practicing-speaking-English-in-a-classroom.-The-classroom-has-a-whiteboard-with-some-English-sentences-written-on-it-desks-and-chairs-arran-300x171.webp","large":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/DALL\u00b7E-2024-06-09-11.08.10-Two-girls-practicing-speaking-English-in-a-classroom.-The-classroom-has-a-whiteboard-with-some-English-sentences-written-on-it-desks-and-chairs-arran-1024x585.webp"},"ams_acf":[],"_links":{"self":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1759","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/comments?post=1759"}],"version-history":[{"count":2,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1759\/revisions"}],"predecessor-version":[{"id":1766,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1759\/revisions\/1766"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media\/1385"}],"wp:attachment":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media?parent=1759"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/categories?post=1759"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/tags?post=1759"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1759,"date":"2024-09-30T07:04:28","date_gmt":"2024-09-30T07:04:28","guid":{"rendered":"https:\/\/phamho.com\/book\/?p=1759"},"modified":"2024-09-30T07:12:34","modified_gmt":"2024-09-30T07:12:34","slug":"korean-wh-question-family","status":"publish","type":"post","link":"https:\/\/phamho.com\/book\/korean-wh-question-family\/","title":{"rendered":"Korean WH-Question – Family"},"content":{"rendered":"\n\n \n\n \n \n Korean WH-Questions – Family<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n background-color: #ffffff;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column; \/* Stack elements vertically *\/\n min-height: 100vh;\n }\n .menu {\n width: 100%;\n background-color: #0f7bd9; \/* Updated color for differentiation *\/\n padding: 10px;\n text-align: center;\n box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);\n flex-shrink: 0;\n overflow-x: auto;\n white-space: nowrap;\n }\n .menu a {\n color: #fff;\n text-decoration: none;\n margin: 0 8px;\n font-weight: bold;\n font-size: 14px;\n display: inline-block;\n }\n .menu a:hover {\n text-decoration: underline;\n }\n .container {\n display: flex;\n flex-wrap: wrap;\n flex: 1 0 auto;\n padding: 10px;\n box-sizing: border-box;\n justify-content: center;\n }\n .image-container, .chat-container {\n width: 100%;\n max-width: 600px;\n margin-bottom: 20px;\n }\n .image-container {\n text-align: center;\n }\n .image-container img {\n width: 100%;\n height: auto;\n border-radius: 20px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n }\n .question-text {\n margin: 10px 0;\n font-weight: bold;\n color: #333;\n font-size: 16px;\n }\n .question-box {\n margin-top: 10px;\n padding: 10px;\n background-color: #fff;\n border: 2px solid #096c02; \/* Updated color for differentiation *\/\n border-radius: 10px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n font-size: 18px;\n font-weight: bold;\n color: #096c02;\n text-align: left;\n max-height: 300px;\n overflow-y: auto;\n }\n .chat-container {\n background-color: #096c02; \/* Updated color for differentiation *\/\n border-radius: 20px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n overflow: hidden;\n }\n .chat-header {\n background-color: #0f7bd9; \/* Updated color for differentiation *\/\n color: #fff;\n padding: 10px;\n text-align: center;\n border-bottom: 1px solid #0a6901;\n }\n .chat-header h2 {\n margin: 0;\n font-size: 18px;\n }\n .chat-messages {\n padding: 10px;\n overflow-y: auto;\n max-height: 300px;\n background-color: #fff;\n }\n .message {\n margin-bottom: 10px;\n padding: 10px;\n border-radius: 5px;\n font-size: 14px;\n line-height: 1.4;\n }\n .user-message {\n background-color: #4caf50;\n color: #fff;\n text-align: right;\n }\n .bot-message {\n background-color: #2196f3;\n color: #fff;\n text-align: left;\n }\n .chat-input {\n display: flex;\n align-items: center;\n background-color: #a3e106;\n padding: 10px;\n justify-content: center;\n }\n .send-button, .stop-button {\n background-color: #17c686;\n color: #fff;\n font-weight: bold;\n border: none;\n border-radius: 5px;\n padding: 8px 10px;\n cursor: pointer;\n transition: background-color 0.3s;\n flex: 1;\n margin: 0 5px;\n max-width: 150px;\n font-size: 14px;\n }\n .stop-button {\n background-color: #c86722;\n }\n .chat-input input {\n flex: 2;\n padding: 8px;\n margin-right: 10px;\n border: 2px solid #096c02; \/* Updated color for differentiation *\/\n border-radius: 5px;\n font-size: 16px;\n }\n\n \/* Optional: Voice Selection Dropdown Styling *\/\n .voice-selection {\n margin-top: 10px;\n text-align: center;\n }\n .voice-selection select {\n padding: 5px;\n font-size: 14px;\n border-radius: 5px;\n border: 1px solid #ccc;\n width: 80%;\n max-width: 300px;\n }\n\n \/* Adjustments for smaller screens *\/\n @media (max-width: 600px) {\n .menu a {\n margin: 0 5px;\n font-size: 12px;\n }\n .question-text {\n font-size: 14px;\n }\n .question-box {\n font-size: 14px;\n max-height: 200px;\n }\n .chat-header h2 {\n font-size: 16px;\n }\n .chat-messages {\n max-height: 200px;\n }\n .message {\n font-size: 13px;\n }\n .send-button, .stop-button {\n padding: 6px 8px;\n font-size: 12px;\n max-width: 120px;\n }\n .chat-input input {\n font-size: 14px;\n }\n }\n @media (max-width: 400px) {\n .menu a {\n margin: 0 3px;\n font-size: 11px;\n }\n .question-text {\n font-size: 13px;\n }\n .question-box {\n font-size: 13px;\n max-height: 150px;\n }\n .chat-header h2 {\n font-size: 14px;\n }\n .chat-messages {\n max-height: 150px;\n }\n .message {\n font-size: 12px;\n }\n .send-button, .stop-button {\n padding: 5px 6px;\n font-size: 11px;\n max-width: 100px;\n }\n .chat-input input {\n font-size: 12px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"menu\">\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-vocabulary-family\/\">Vocabulary<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-sentences-family\/\">Sentences<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-yes-no-question-family\/\">Yes\/No Questions<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-wh-question-family\/\">WH-Questions<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-like-question-family\/\">Like-Questions<\/a>\n <a href=\"https:\/\/phamho.com\/book\/2024\/09\/30\/korean-interaction-family\/\">Interactions<\/a> \n <\/div>\n\n <div class=\"container\">\n <div class=\"image-container\">\n <img decoding=\"async\" src=\"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/09\/korean.jpg\" alt=\"Lesson Robot\">\n <div class=\"question-text\">Check the questions in this box<\/div>\n <div id=\"question-box\" class=\"question-box\">\n \n <\/div>\n \n <div class=\"voice-selection\">\n <label for=\"voice-select\">Choose Korean Voice: <\/label>\n <select id=\"voice-select\" aria-label=\"Select Korean Voice\">\n <option value=\"\">Default<\/option>\n \n <\/select>\n <\/div>\n <\/div>\n <div class=\"chat-container\">\n <div class=\"chat-header\"> \n <h2>Korean WH-Questions – Family<\/h2>\n <\/div>\n <div class=\"chat-messages\" id=\"chat-messages\">\n \n <\/div>\n <div class=\"chat-input\">\n <input type=\"text\" id=\"user-input\" placeholder=\"Type your answer here...\" style=\"display: none;\" aria-label=\"User Input\" \/>\n <button id=\"submit-btn\" class=\"send-button\" style=\"display: none;\" aria-label=\"Submit Answer\">Submit<\/button>\n <button id=\"start-btn\" class=\"send-button\" aria-label=\"Start Lesson\">Start Lesson<\/button>\n <button id=\"stop-btn\" class=\"stop-button\" aria-label=\"Stop Lesson\">Stop<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n const whQuestions = [\n { question: \"\ub204\uac00 \uac00\uc871\uc744 \ub3cc\ubcf4\ub098\uc694?\", translation: \"Who takes care of the family?\" },\n { question: \"\ubb34\uc5c7\uc744 \uc88b\uc544\ud558\uc138\uc694?\", translation: \"What do you like?\" },\n { question: \"\uc5b4\ub514\uc5d0 \uc0b4\uace0 \uc788\ub098\uc694?\", translation: \"Where do you live?\" },\n { question: \"\uc5b8\uc81c \uac00\uc871\uacfc \uc2dc\uac04\uc744 \ubcf4\ub0b4\uc138\uc694?\", translation: \"When do you spend time with your family?\" },\n { question: \"\uc5b4\ub5bb\uac8c \uac00\uc871\uc744 \uc9c0\uc6d0\ud558\uc2dc\ub098\uc694?\", translation: \"How do you support your family?\" },\n { question: \"\uc65c \uac00\uc871\uc774 \uc911\uc694\ud558\ub2e4\uace0 \uc0dd\uac01\ud558\ub098\uc694?\", translation: \"Why do you think family is important?\" },\n { question: \"\ub204\uad6c\uc640 \uac00\uc7a5 \uce5c\ud55c\uac00\uc694?\", translation: \"With whom are you closest?\" },\n { question: \"\uc5b4\ub5a4 \ud65c\ub3d9\uc744 \uac00\uc871\uacfc \ud568\uaed8 \ud558\uc138\uc694?\", translation: \"What activities do you do with your family?\" },\n { question: \"\uc5b4\ub514\uc5d0\uc11c \uac00\uc871\uacfc \ubaa8\uc784\uc744 \uac00\uc9c0\ub098\uc694?\", translation: \"Where do you have family gatherings?\" },\n { question: \"\ubb34\uc5c7\uc744 \ud1b5\ud574 \uac00\uc871\uacfc \uc18c\ud1b5\ud558\ub098\uc694?\", translation: \"Through what do you communicate with your family?\" },\n { question: \"\uc5b8\uc81c \uac00\uc871\uacfc \uc5ec\ud589\uc744 \uac00\ub098\uc694?\", translation: \"When do you go on trips with your family?\" },\n { question: \"\uc5b4\ub5bb\uac8c \uac00\uc871\uc758 \uc804\ud1b5\uc744 \uc720\uc9c0\ud558\ub098\uc694?\", translation: \"How do you maintain family traditions?\" },\n { question: \"\uc65c \uac00\uc871\uacfc\uc758 \uad00\uacc4\ub97c \uc18c\uc911\ud788 \uc5ec\uae30\ub098\uc694?\", translation: \"Why do you value your relationship with your family?\" },\n { question: \"\ub204\uad6c\uc640 \uac00\uc871 \uc678\uc5d0\ub3c4 \uc2dc\uac04\uc744 \ubcf4\ub0b4\ub098\uc694?\", translation: \"With whom else do you spend time besides family?\" },\n { question: \"\uc5b4\ub5a4 \ubc29\uc2dd\uc73c\ub85c \uac00\uc871\uc744 \ucd95\ud558\ud558\ub098\uc694?\", translation: \"In what ways do you celebrate your family?\" },\n { question: \"\uc5b4\ub514\uc5d0\uc11c \uac00\uc871 \uc0ac\uc9c4\uc744 \ucc0d\ub098\uc694?\", translation: \"Where do you take family photos?\" },\n { question: \"\ubb34\uc5c7\uc744 \ud1b5\ud574 \uac00\uc871\uc758 \uac74\uac15\uc744 \uc9c0\ud0a4\ub098\uc694?\", translation: \"How do you maintain your family's health?\" },\n { question: \"\uc5b8\uc81c \uac00\uc871\uacfc \uc911\uc694\ud55c \uacb0\uc815\uc744 \ub0b4\ub9ac\ub098\uc694?\", translation: \"When do you make important decisions with your family?\" },\n { question: \"\uc5b4\ub5bb\uac8c \uac00\uc871\uc758 \uc7ac\uc815\uc744 \uad00\ub9ac\ud558\ub098\uc694?\", translation: \"How do you manage your family's finances?\" },\n { question: \"\uc65c \uac00\uc871\uacfc\uc758 \uad00\uacc4\ub97c \uc18c\uc911\ud788 \uc5ec\uae30\ub098\uc694?\", translation: \"Why do you value your relationship with your family?\" }\n ];\n\n let currentQuestionIndex = 0;\n let repeatAttempts = 0;\n let isSpeechRecognitionSupported = false;\n let recognition;\n\n const stopKeywords = [\"\uc548\ub155\", \"\uc798 \uac00\", \"\uad7f\ubc14\uc774\", \"bye\", \"bye bye\", \"byebye\", \"\ub610 \ub9cc\ub098\uc694\", \"\ucc98\uc74c \ubd59\uaca0\uc2b5\ub2c8\ub2e4\"];\n const speechSynthesisSupported = 'speechSynthesis' in window;\n\n let selectedVoice = null; \/\/ Variable to hold the selected voice\n\n \/\/ Feature detection for Speech Recognition\n if (window.SpeechRecognition || window.webkitSpeechRecognition) {\n isSpeechRecognitionSupported = true;\n recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();\n recognition.lang = 'ko-KR';\n recognition.interimResults = false;\n recognition.maxAlternatives = 1;\n }\n\n \/\/ Function to populate the voice selection dropdown\n function populateVoiceList() {\n const voiceSelect = document.getElementById('voice-select');\n const voices = speechSynthesis.getVoices().filter(voice => voice.lang === 'ko-KR');\n\n \/\/ Sort voices alphabetically by name\n voices.sort((a, b) => a.name.localeCompare(b.name));\n\n voices.forEach((voice, index) => {\n const option = document.createElement('option');\n option.value = index;\n \/\/ Attempt to infer gender from voice name\n let gender = \"Unknown\";\n if (\/female\/i.test(voice.name)) {\n gender = \"Female\";\n } else if (\/male\/i.test(voice.name)) {\n gender = \"Male\";\n }\n option.textContent = `${voice.name} (${gender})`;\n voiceSelect.appendChild(option);\n });\n\n \/\/ If no Korean voices are found, inform the user\n if (voices.length === 0) {\n const option = document.createElement('option');\n option.value = \"\";\n option.textContent = \"No Korean voices available\";\n voiceSelect.appendChild(option);\n }\n }\n\n window.onload = function() {\n if (speechSynthesisSupported) {\n if (window.speechSynthesis.getVoices().length === 0) {\n \/\/ Voices not loaded yet, wait for the event\n window.speechSynthesis.onvoiceschanged = function() {\n populateVoiceList();\n greetUser();\n };\n } else {\n \/\/ Voices already loaded\n populateVoiceList();\n greetUser();\n }\n } else {\n alert('Sorry, your browser does not support speech synthesis. Please use a compatible browser for the best experience.');\n appendMessage('Speech synthesis not supported in your browser.', 'bot');\n }\n\n if (!isSpeechRecognitionSupported) {\n \/\/ Show text input and submit button\n document.getElementById('user-input').style.display = 'block';\n document.getElementById('submit-btn').style.display = 'block';\n \/\/ Optionally hide the start button\n \/\/ document.getElementById('start-btn').style.display = 'none';\n }\n\n \/\/ Event listener for voice selection\n document.getElementById('voice-select').addEventListener('change', function() {\n const selectedIndex = this.value;\n const voices = speechSynthesis.getVoices().filter(voice => voice.lang === 'ko-KR');\n if (selectedIndex !== \"\") {\n selectedVoice = voices[selectedIndex];\n } else {\n selectedVoice = null; \/\/ Default voice\n }\n });\n };\n\n function greetUser() {\n let greeting = \"Welcome! In this lesson, you will learn 20 WH questions about family in Korean. I will say each question twice, and then you will repeat.\";\n if (!isSpeechRecognitionSupported) {\n greeting += \" Your browser does not support voice input, so please type your responses in the text box below.\";\n }\n greeting += \" Are you ready? Click Start Lesson to begin.\";\n appendMessage(greeting, 'bot');\n sayText(greeting, 'en');\n }\n\n document.getElementById('start-btn').onclick = function() {\n currentQuestionIndex = 0;\n repeatAttempts = 0;\n startQuestionLesson();\n };\n\n document.getElementById('stop-btn').onclick = function() {\n endLesson(true); \/\/ Stop the lesson when \"Stop\" button is clicked\n };\n\n \/\/ Handle submit button click\n document.getElementById('submit-btn').onclick = function() {\n let userInput = document.getElementById('user-input').value.trim().toLowerCase();\n document.getElementById('user-input').value = '';\n if (userInput) {\n processUserResponse(userInput);\n }\n };\n\n \/\/ Allow pressing 'Enter' to submit the answer\n document.getElementById('user-input').addEventListener('keypress', function(event) {\n if (event.key === 'Enter') {\n event.preventDefault();\n document.getElementById('submit-btn').click();\n }\n });\n\n function startQuestionLesson() {\n if (currentQuestionIndex < whQuestions.length) {\n const question = whQuestions[currentQuestionIndex].question;\n const translation = whQuestions[currentQuestionIndex].translation;\n\n appendMessage(`'${question}' - '${translation}'`, 'bot');\n addQuestionToBox(question, translation);\n sayText(question, \"ko-KR\", function() {\n setTimeout(() => {\n sayText(question, \"ko-KR\", function() {\n setTimeout(() => {\n if (isSpeechRecognitionSupported) {\n \/\/ Prompt user to repeat\n appendMessage(`Please repeat after me: '${question}'`, 'bot');\n sayText(\"Please repeat after me:\", \"en\", function() {\n sayText(`${question}`, \"ko-KR\", function() {\n listenUserResponse(question);\n });\n });\n } else {\n \/\/ Prompt user to type\n appendMessage(`Please type the question '${question}' in the text box below.`, 'bot');\n sayText(`Please type the question '${question}' in the text box below.`, \"en\");\n \/\/ Focus the text input\n document.getElementById('user-input').focus();\n }\n }, 500); \/\/ Small pause before prompt\n });\n }, 500); \/\/ Small pause before second repetition\n });\n } else {\n endLesson();\n }\n }\n\n function listenUserResponse(expectedQuestion) {\n recognition.start();\n\n recognition.onresult = function(event) {\n let userInput = event.results[0][0].transcript.trim().toLowerCase();\n appendMessage(userInput, 'user');\n\n processUserResponse(userInput, expectedQuestion);\n };\n\n recognition.onspeechend = function() {\n recognition.stop();\n };\n\n recognition.onerror = function(event) {\n let errorMessage = '';\n switch(event.error) {\n case 'no-speech':\n errorMessage = 'No speech detected. Please try again or type your answer.';\n break;\n case 'audio-capture':\n errorMessage = 'Microphone access denied. Please check your settings or type your answer.';\n break;\n case 'not-allowed':\n errorMessage = 'Permission to use microphone denied.';\n break;\n default:\n errorMessage = 'An error occurred: ' + event.error;\n }\n appendMessage(errorMessage, 'bot');\n sayText(errorMessage, 'en');\n };\n }\n\n function processUserResponse(userInput, expectedQuestion = whQuestions[currentQuestionIndex].question) {\n appendMessage(userInput, 'user');\n\n if (stopKeywords.includes(userInput.toLowerCase())) {\n endLesson(true); \/\/ User requested to stop the lesson\n return;\n }\n\n \/\/ Normalize questions by removing spaces and punctuation for comparison\n const normalize = (str) => str.replace(\/\\s+\/g, '').replace(\/[.,\\\/#!$%\\^&\\*;:{}=\\-_`~()]\/g,\"\").toLowerCase();\n if (normalize(userInput) === normalize(expectedQuestion)) {\n const positiveMessage = \"Great! Your pronunciation is good.\";\n appendMessage(positiveMessage, 'bot');\n sayText(positiveMessage, 'en'); \/\/ Feedback in English\n repeatAttempts = 0; \/\/ Reset the attempts counter\n currentQuestionIndex++;\n setTimeout(startQuestionLesson, 2000); \/\/ Move to next question after 2 seconds\n } else {\n repeatAttempts++;\n if (repeatAttempts < 2) {\n appendMessage(`That's not correct. Listen again: '${expectedQuestion}'. Now try again.`, 'bot');\n\n \/\/ Split the message into parts\n sayText(\"That's not correct. Listen again:\", 'en', function() {\n sayText(`${expectedQuestion}`, 'ko-KR', function() {\n sayText(\"Now try again.\", 'en', function() {\n setTimeout(() => {\n if (isSpeechRecognitionSupported) {\n \/\/ Prompt user to repeat\n appendMessage(`Please repeat after me: '${expectedQuestion}'`, 'bot');\n sayText(\"Please repeat after me:\", \"en\", function() {\n sayText(`${expectedQuestion}`, \"ko-KR\", function() {\n listenUserResponse(expectedQuestion);\n });\n });\n } else {\n \/\/ Focus the text input\n document.getElementById('user-input').focus();\n }\n }, 500); \/\/ Small pause before prompt\n });\n });\n });\n } else {\n const nextQuestionMessage = `You've tried twice. The correct question is '${expectedQuestion}'. Let's move on to the next question.`;\n appendMessage(nextQuestionMessage, 'bot');\n\n \/* \n Adjusted speech sequence:\n 1. Speak \"You've tried twice.\"\n 2. Speak \"The correct question is '\ub2f9\uc2e0\uc740 \uac00\uc871\uacfc \ud568\uaed8 \uc0b4\uace0 \uc788\ub098\uc694?'.\"\n 3. Speak \"Let's move on to the next question.\"\n *\/\n \/\/ Step 1: Speak \"You've tried twice.\"\n sayText(\"You've tried twice.\", \"en\", function() {\n \/\/ Step 2: Speak the Korean question\n sayText(`The correct question is '${expectedQuestion}'.`, \"ko-KR\", function() {\n \/\/ Step 3: Speak \"Let's move on to the next question.\"\n sayText(\"Let's move on to the next question.\", \"en\", function() {\n repeatAttempts = 0; \/\/ Reset the attempts counter\n currentQuestionIndex++;\n setTimeout(startQuestionLesson, 2000); \/\/ Move to next question after 2 seconds\n });\n });\n });\n }\n }\n }\n\n function addQuestionToBox(question, translation) {\n const questionBox = document.getElementById('question-box');\n const questionElement = document.createElement('div');\n questionElement.innerText = `'${question}' - '${translation}'`;\n questionElement.style.cursor = 'pointer';\n questionElement.style.padding = '5px';\n questionElement.style.borderBottom = '1px solid #ccc';\n questionElement.addEventListener('click', () => sayText(question, 'ko-KR'));\n questionBox.appendChild(questionElement);\n }\n\n function endLesson(userStopped = false) {\n let message;\n if (userStopped) {\n message = \"Thank you for learning today! I hope you enjoyed the lesson.\";\n } else {\n message = \"Well done! You've learned 20 WH questions related to family. Keep practicing!\";\n }\n appendMessage(message, \"bot\");\n sayText(message, \"en\"); \/\/ End feedback in English\n }\n\n function sayText(text, lang, callback) {\n if (!speechSynthesisSupported) {\n if (callback) callback();\n return;\n }\n const utterance = new SpeechSynthesisUtterance(text);\n utterance.lang = lang;\n \/\/ Adjust rate and pitch for Korean\n if (lang.startsWith('ko')) {\n utterance.rate = 1.0;\n utterance.pitch = 1.0;\n } else {\n utterance.rate = 1.0;\n utterance.pitch = 1.0;\n }\n\n \/\/ Select the desired voice\n if (lang.startsWith('ko')) {\n if (selectedVoice) {\n utterance.voice = selectedVoice;\n } else {\n \/\/ Filter voices to find native Korean voices\n const koreanVoices = speechSynthesis.getVoices().filter(voice => voice.lang === 'ko-KR');\n if (koreanVoices.length > 0) {\n \/\/ Prefer female voices for naturalness\n selectedVoice = koreanVoices.find(voice => \/female\/i.test(voice.name)) || koreanVoices[0];\n utterance.voice = selectedVoice;\n } else {\n \/\/ No native Korean voices found\n appendMessage(\"No native Korean voices available. Please install or enable Korean voices on your device for the best experience.\", 'bot');\n sayText(\"No native Korean voices available. Please install or enable Korean voices on your device for the best experience.\", 'en', callback);\n return;\n }\n }\n } else {\n \/\/ For English or other languages, select the default voice\n const voices = speechSynthesis.getVoices();\n let selectedEnglishVoice = voices.find(voice => voice.lang === lang) || voices.find(voice => voice.lang.startsWith(lang));\n if (selectedEnglishVoice) {\n utterance.voice = selectedEnglishVoice;\n }\n }\n\n utterance.onend = function() {\n if (callback) callback();\n };\n window.speechSynthesis.speak(utterance);\n }\n\n function appendMessage(text, sender) {\n const messageContainer = document.getElementById('chat-messages');\n const messageElement = document.createElement('div');\n messageElement.classList.add('message');\n messageElement.classList.add(sender === 'bot' ? 'bot-message' : 'user-message');\n messageElement.innerText = text;\n messageContainer.appendChild(messageElement);\n messageContainer.scrollTop = messageContainer.scrollHeight;\n }\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Korean WH-Questions – Family Vocabulary Sentences Yes\/No Questions WH-Questions Like-Questions Interactions Check the questions in this box Choose Korean Voice: Default Korean WH-Questions – Family Submit Start Lesson Stop<\/p>\n","protected":false},"author":1,"featured_media":1385,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[46,45,34],"tags":[],"class_list":["post-1759","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-family-korean","category-korean","category-robots"],"featured_image_src":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/DALL\u00b7E-2024-06-09-11.08.10-Two-girls-practicing-speaking-English-in-a-classroom.-The-classroom-has-a-whiteboard-with-some-English-sentences-written-on-it-desks-and-chairs-arran-1024x585.webp","blog_images":{"medium":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/DALL\u00b7E-2024-06-09-11.08.10-Two-girls-practicing-speaking-English-in-a-classroom.-The-classroom-has-a-whiteboard-with-some-English-sentences-written-on-it-desks-and-chairs-arran-300x171.webp","large":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/DALL\u00b7E-2024-06-09-11.08.10-Two-girls-practicing-speaking-English-in-a-classroom.-The-classroom-has-a-whiteboard-with-some-English-sentences-written-on-it-desks-and-chairs-arran-1024x585.webp"},"ams_acf":[],"_links":{"self":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1759","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/comments?post=1759"}],"version-history":[{"count":2,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1759\/revisions"}],"predecessor-version":[{"id":1766,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1759\/revisions\/1766"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media\/1385"}],"wp:attachment":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media?parent=1759"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/categories?post=1759"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/tags?post=1759"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}