Practice Speaking 12-14 years old<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n background-color: #ffffff;\n margin: 0;\n padding: 0;\n }\n .chat-container {\n max-width: 400px;\n border: 2px;\n margin: 50px auto;\n background-color: #026c96;\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: #d97b0f;\n color: #fff;\n padding: 10px;\n text-align: center;\n border-bottom: 1px solid #69010a;\n }\n .chat-messages {\n padding: 10px;\n overflow-y: auto;\n max-height: 300px;\n border: 2px;\n }\n .message {\n margin-bottom: 10px;\n padding: 10px;\n border-radius: 5px;\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: #080900;\n text-align: left;\n }\n .chat-input {\n display: flex;\n align-items: center;\n background-color: #a3e106;\n padding: 10px;\n }\n .input-field {\n flex: 1;\n border: 1px;\n border-radius: 5px;\n padding: 8px;\n margin-right: 10px;\n }\n .send-button {\n background-color: #17c686;\n color: #fff;\n font-weight: bold;\n border: none;\n border-radius: 5px;\n padding: 8px 15px;\n margin-left: 3px;\n cursor: pointer;\n transition: background-color 0.3s;\n }\n .talk-button {\n background-color: #c86722;\n color: #fff;\n border: none;\n font-weight: bold;\n border-radius: 5px;\n padding: 8px 15px;\n cursor: pointer;\n transition: background-color 0.3s;\n }\n .send-button:hover,\n .talk-button:hover {\n background-color: #45a049;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"chat-container\">\n <div class=\"chat-header\">Practice Speaking 12-14 years old<\/div>\n <div class=\"chat-messages\" id=\"chat-messages\">\n \n <\/div>\n <div class=\"chat-input\">\n <input type=\"text\" class=\"input-field\" id=\"user-input\" placeholder=\"Type your message...\">\n <button class=\"talk-button\" onclick=\"startSpeechRecognition()\">Talk<\/button>\n <button class=\"send-button\" onclick=\"sendMessage()\">Send<\/button>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Initialize the speech recognition object\n var recognition = new webkitSpeechRecognition();\n recognition.lang = \"en-US\";\n recognition.continuous = false;\n recognition.interimResults = false;\n\n \/\/ Initialize MediaRecorder object\n let mediaRecorder;\n\n \/\/ Function to add messages to the chat\n function addMessage(message, isUser) {\n var chatMessages = document.getElementById(\"chat-messages\");\n var messageElement = document.createElement(\"div\");\n messageElement.className = \"message \" + (isUser ? \"user-message\" : \"bot-message\");\n messageElement.textContent = message;\n chatMessages.appendChild(messageElement);\n chatMessages.scrollTop = chatMessages.scrollHeight; \/\/ Auto scroll to bottom\n }\n\n \/\/ Function to process user's response\n function processResponse(userResponse) {\n \/\/ Repeat user's input\n var repeatResponse = \"You said: \" + userResponse;\n addMessage(userResponse, true); \/\/ Show the user's response\n addMessage(repeatResponse, false);\n speak(repeatResponse); \/\/ Speak the repeated response\n\n\/\/ Check if the user's response contains goodbye keywords\n const goodbyeKeywords = [\"goodbye\", \"byebye\", \"bye\"];\n if (goodbyeKeywords.some(keyword => userResponse.toLowerCase().includes(keyword))) {\n var endMessage = \"Thank you for talking with me! Goodbye!\";\n addMessage(endMessage, false);\n speak(endMessage);\n return; \/\/ End the conversation\n }\n\n \/\/ Move to the next question or interaction after a delay\n setTimeout(function() {\n if (questions.length > 0) {\n var nextQuestion = questions.shift();\n addMessage(nextQuestion, false);\n speak(nextQuestion); \/\/ Speak the next question\n setTimeout(startSpeechRecognition, 2000); \/\/ Delay before starting speech recognition\n } else {\n var endMessage = \"Thank you for talking with me! Have a great day!\";\n addMessage(endMessage, false);\n speak(endMessage);\n }\n }, 2000);\n }\n\n \/\/ Function to start speech recognition\n function startSpeechRecognition() {\n navigator.mediaDevices.getUserMedia({ audio: true })\n .then(stream => {\n mediaRecorder = new MediaRecorder(stream);\n mediaRecorder.start();\n\n mediaRecorder.onstop = (e) => {\n const audioData = e.data[0]; \/\/ Get the audio blob\n processAudioData(audioData);\n };\n\n recognition.start();\n recognition.onresult = function (event) {\n const userResponse = event.results[0][0].transcript;\n processResponse(userResponse);\n mediaRecorder.stop(); \/\/ Stop recording after the transcript is received\n };\n })\n .catch(err => {\n console.error('Error accessing microphone:', err);\n });\n }\n\n \/\/ Process the audio blob\n function processAudioData(audioData) {\n fetch('\/recognize', {\n method: 'POST',\n headers: { 'Content-Type': 'audio\/wav' },\n body: audioData\n })\n .then(response => response.json())\n .then(data => {\n processResponse(data.text); \/\/ Pass the recognized text to your chatbot\n })\n .catch(err => {\n console.error('Error sending audio to server:', err);\n });\n }\n\n \/\/ Function to speak text\n function speak(text) {\n var utterance = new SpeechSynthesisUtterance(text);\n utterance.lang = \"en-US\";\n window.speechSynthesis.speak(utterance);\n }\n\n \/\/ Function to send user's typed message\n function sendMessage() {\n var userInput = document.getElementById(\"user-input\").value;\n if (userInput.trim() !== \"\") {\n addMessage(userInput, true);\n processResponse(userInput); \/\/ Process user's response\n document.getElementById(\"user-input\").value = \"\"; \/\/ Clear input field after sending message\n }\n }\n\n \/\/ Interview questions for kids aged 12-14\nvar questions = [\n \"Can you introduce yourself? What's your name?\",\n \"How old are you?\",\n \"What's your most interesting subject in school? Explain your reasons\",\n \"What hobbies or activities are you passionate about?\",\n \"Can you tell me about your favorite animal and why you find it fascinating?\",\n \"What's your favorite color and is there a reason you like it?\",\n \"Do you have a favorite book or book series? What is it about and why do you like it?\",\n \"Do you have any pets? Tell me more about them.\",\n \"What's your favorite sport or physical activity and why do you enjoy it?\",\n \"What's your favorite food or snack and what makes it special for you?\",\n \"What types of things do you enjoy creating or making?\",\n \"Do you have a favorite song, band, or musician? What do you like about them?\",\n \"What TV shows or movies are you into these days?\",\n \"Who is your favorite character from a book, TV show, or movie and why do you like them?\",\n \"What do you enjoy most about spending time outdoors?\",\n \"Do you like playing video games or board games? Which game is your favorite and why?\",\n \"What's the most fun or memorable thing you've done recently?\",\n \"Do you have a favorite holiday or celebration? What do you love about it?\",\n \"What are your career aspirations and why do you want to pursue them?\",\n \"If you could be any animal for a day, which one would you choose and why?\",\n \"What's your favorite family activity or tradition and what makes it special?\",\n \"Do you like helping out around the house? What's your favorite chore or task?\",\n \"What's your favorite dessert or sweet treat and why do you love it?\",\n \"If you could travel anywhere in the world, where would you go and why?\",\n \"Do you enjoy reading? What's the best book you've read recently and why?\",\n \"What's a new skill or hobby you'd like to learn and what interests you about it?\",\n \"Do you have a favorite superhero or fictional character? What qualities do you admire in them?\"\n];\n\n\n\n \/\/ Start the interview when the page loads\n window.onload = function () {\n var greeting = \"Hello! Welcome to the Practice Speaking. Are you ready? Let's get started.\";\n addMessage(greeting, false);\n speak(greeting);\n\n let startTimeout = setTimeout(() => {\n if (questions.length > 0) {\n const firstQuestion = questions.shift();\n addMessage(firstQuestion, false);\n speak(firstQuestion);\n startSpeechRecognition();\n }\n }, 5000);\n\n const talkButton = document.querySelector('.talk-button');\n talkButton.addEventListener('click', () => {\n clearTimeout(startTimeout);\n if (questions.length > 0) {\n const firstQuestion = questions.shift();\n addMessage(firstQuestion, false);\n speak(firstQuestion);\n startSpeechRecognition();\n }\n });\n };\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Practice Speaking 12-14 years old Practice Speaking 12-14 years old Talk Send<\/p>\n","protected":false},"author":1,"featured_media":1341,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[27],"tags":[],"class_list":["post-1340","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-speaking"],"featured_image_src":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/teacher2-1024x585.webp","blog_images":{"medium":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/teacher2-300x171.webp","large":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/teacher2-1024x585.webp"},"ams_acf":[],"_links":{"self":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1340","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=1340"}],"version-history":[{"count":2,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1340\/revisions"}],"predecessor-version":[{"id":1401,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1340\/revisions\/1401"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media\/1341"}],"wp:attachment":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media?parent=1340"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/categories?post=1340"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/tags?post=1340"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1340,"date":"2024-06-07T06:18:36","date_gmt":"2024-06-07T06:18:36","guid":{"rendered":"https:\/\/phamho.com\/book\/?p=1340"},"modified":"2024-06-09T05:48:22","modified_gmt":"2024-06-09T05:48:22","slug":"practice-english-for-12-to-14-years-old","status":"publish","type":"post","link":"https:\/\/phamho.com\/book\/practice-english-for-12-to-14-years-old\/","title":{"rendered":"Practice English for 12 to 14 years old"},"content":{"rendered":"\n\n\n\n \n \n Practice Speaking 12-14 years old<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n background-color: #ffffff;\n margin: 0;\n padding: 0;\n }\n .chat-container {\n max-width: 400px;\n border: 2px;\n margin: 50px auto;\n background-color: #026c96;\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: #d97b0f;\n color: #fff;\n padding: 10px;\n text-align: center;\n border-bottom: 1px solid #69010a;\n }\n .chat-messages {\n padding: 10px;\n overflow-y: auto;\n max-height: 300px;\n border: 2px;\n }\n .message {\n margin-bottom: 10px;\n padding: 10px;\n border-radius: 5px;\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: #080900;\n text-align: left;\n }\n .chat-input {\n display: flex;\n align-items: center;\n background-color: #a3e106;\n padding: 10px;\n }\n .input-field {\n flex: 1;\n border: 1px;\n border-radius: 5px;\n padding: 8px;\n margin-right: 10px;\n }\n .send-button {\n background-color: #17c686;\n color: #fff;\n font-weight: bold;\n border: none;\n border-radius: 5px;\n padding: 8px 15px;\n margin-left: 3px;\n cursor: pointer;\n transition: background-color 0.3s;\n }\n .talk-button {\n background-color: #c86722;\n color: #fff;\n border: none;\n font-weight: bold;\n border-radius: 5px;\n padding: 8px 15px;\n cursor: pointer;\n transition: background-color 0.3s;\n }\n .send-button:hover,\n .talk-button:hover {\n background-color: #45a049;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"chat-container\">\n <div class=\"chat-header\">Practice Speaking 12-14 years old<\/div>\n <div class=\"chat-messages\" id=\"chat-messages\">\n \n <\/div>\n <div class=\"chat-input\">\n <input type=\"text\" class=\"input-field\" id=\"user-input\" placeholder=\"Type your message...\">\n <button class=\"talk-button\" onclick=\"startSpeechRecognition()\">Talk<\/button>\n <button class=\"send-button\" onclick=\"sendMessage()\">Send<\/button>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Initialize the speech recognition object\n var recognition = new webkitSpeechRecognition();\n recognition.lang = \"en-US\";\n recognition.continuous = false;\n recognition.interimResults = false;\n\n \/\/ Initialize MediaRecorder object\n let mediaRecorder;\n\n \/\/ Function to add messages to the chat\n function addMessage(message, isUser) {\n var chatMessages = document.getElementById(\"chat-messages\");\n var messageElement = document.createElement(\"div\");\n messageElement.className = \"message \" + (isUser ? \"user-message\" : \"bot-message\");\n messageElement.textContent = message;\n chatMessages.appendChild(messageElement);\n chatMessages.scrollTop = chatMessages.scrollHeight; \/\/ Auto scroll to bottom\n }\n\n \/\/ Function to process user's response\n function processResponse(userResponse) {\n \/\/ Repeat user's input\n var repeatResponse = \"You said: \" + userResponse;\n addMessage(userResponse, true); \/\/ Show the user's response\n addMessage(repeatResponse, false);\n speak(repeatResponse); \/\/ Speak the repeated response\n\n\/\/ Check if the user's response contains goodbye keywords\n const goodbyeKeywords = [\"goodbye\", \"byebye\", \"bye\"];\n if (goodbyeKeywords.some(keyword => userResponse.toLowerCase().includes(keyword))) {\n var endMessage = \"Thank you for talking with me! Goodbye!\";\n addMessage(endMessage, false);\n speak(endMessage);\n return; \/\/ End the conversation\n }\n\n \/\/ Move to the next question or interaction after a delay\n setTimeout(function() {\n if (questions.length > 0) {\n var nextQuestion = questions.shift();\n addMessage(nextQuestion, false);\n speak(nextQuestion); \/\/ Speak the next question\n setTimeout(startSpeechRecognition, 2000); \/\/ Delay before starting speech recognition\n } else {\n var endMessage = \"Thank you for talking with me! Have a great day!\";\n addMessage(endMessage, false);\n speak(endMessage);\n }\n }, 2000);\n }\n\n \/\/ Function to start speech recognition\n function startSpeechRecognition() {\n navigator.mediaDevices.getUserMedia({ audio: true })\n .then(stream => {\n mediaRecorder = new MediaRecorder(stream);\n mediaRecorder.start();\n\n mediaRecorder.onstop = (e) => {\n const audioData = e.data[0]; \/\/ Get the audio blob\n processAudioData(audioData);\n };\n\n recognition.start();\n recognition.onresult = function (event) {\n const userResponse = event.results[0][0].transcript;\n processResponse(userResponse);\n mediaRecorder.stop(); \/\/ Stop recording after the transcript is received\n };\n })\n .catch(err => {\n console.error('Error accessing microphone:', err);\n });\n }\n\n \/\/ Process the audio blob\n function processAudioData(audioData) {\n fetch('\/recognize', {\n method: 'POST',\n headers: { 'Content-Type': 'audio\/wav' },\n body: audioData\n })\n .then(response => response.json())\n .then(data => {\n processResponse(data.text); \/\/ Pass the recognized text to your chatbot\n })\n .catch(err => {\n console.error('Error sending audio to server:', err);\n });\n }\n\n \/\/ Function to speak text\n function speak(text) {\n var utterance = new SpeechSynthesisUtterance(text);\n utterance.lang = \"en-US\";\n window.speechSynthesis.speak(utterance);\n }\n\n \/\/ Function to send user's typed message\n function sendMessage() {\n var userInput = document.getElementById(\"user-input\").value;\n if (userInput.trim() !== \"\") {\n addMessage(userInput, true);\n processResponse(userInput); \/\/ Process user's response\n document.getElementById(\"user-input\").value = \"\"; \/\/ Clear input field after sending message\n }\n }\n\n \/\/ Interview questions for kids aged 12-14\nvar questions = [\n \"Can you introduce yourself? What's your name?\",\n \"How old are you?\",\n \"What's your most interesting subject in school? Explain your reasons\",\n \"What hobbies or activities are you passionate about?\",\n \"Can you tell me about your favorite animal and why you find it fascinating?\",\n \"What's your favorite color and is there a reason you like it?\",\n \"Do you have a favorite book or book series? What is it about and why do you like it?\",\n \"Do you have any pets? Tell me more about them.\",\n \"What's your favorite sport or physical activity and why do you enjoy it?\",\n \"What's your favorite food or snack and what makes it special for you?\",\n \"What types of things do you enjoy creating or making?\",\n \"Do you have a favorite song, band, or musician? What do you like about them?\",\n \"What TV shows or movies are you into these days?\",\n \"Who is your favorite character from a book, TV show, or movie and why do you like them?\",\n \"What do you enjoy most about spending time outdoors?\",\n \"Do you like playing video games or board games? Which game is your favorite and why?\",\n \"What's the most fun or memorable thing you've done recently?\",\n \"Do you have a favorite holiday or celebration? What do you love about it?\",\n \"What are your career aspirations and why do you want to pursue them?\",\n \"If you could be any animal for a day, which one would you choose and why?\",\n \"What's your favorite family activity or tradition and what makes it special?\",\n \"Do you like helping out around the house? What's your favorite chore or task?\",\n \"What's your favorite dessert or sweet treat and why do you love it?\",\n \"If you could travel anywhere in the world, where would you go and why?\",\n \"Do you enjoy reading? What's the best book you've read recently and why?\",\n \"What's a new skill or hobby you'd like to learn and what interests you about it?\",\n \"Do you have a favorite superhero or fictional character? What qualities do you admire in them?\"\n];\n\n\n\n \/\/ Start the interview when the page loads\n window.onload = function () {\n var greeting = \"Hello! Welcome to the Practice Speaking. Are you ready? Let's get started.\";\n addMessage(greeting, false);\n speak(greeting);\n\n let startTimeout = setTimeout(() => {\n if (questions.length > 0) {\n const firstQuestion = questions.shift();\n addMessage(firstQuestion, false);\n speak(firstQuestion);\n startSpeechRecognition();\n }\n }, 5000);\n\n const talkButton = document.querySelector('.talk-button');\n talkButton.addEventListener('click', () => {\n clearTimeout(startTimeout);\n if (questions.length > 0) {\n const firstQuestion = questions.shift();\n addMessage(firstQuestion, false);\n speak(firstQuestion);\n startSpeechRecognition();\n }\n });\n };\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Practice Speaking 12-14 years old Practice Speaking 12-14 years old Talk Send<\/p>\n","protected":false},"author":1,"featured_media":1341,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[27],"tags":[],"class_list":["post-1340","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-speaking"],"featured_image_src":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/teacher2-1024x585.webp","blog_images":{"medium":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/teacher2-300x171.webp","large":"https:\/\/phamho.com\/book\/wp-content\/uploads\/2024\/06\/teacher2-1024x585.webp"},"ams_acf":[],"_links":{"self":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1340","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=1340"}],"version-history":[{"count":2,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1340\/revisions"}],"predecessor-version":[{"id":1401,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/posts\/1340\/revisions\/1401"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media\/1341"}],"wp:attachment":[{"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/media?parent=1340"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/categories?post=1340"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phamho.com\/book\/wp-json\/wp\/v2\/tags?post=1340"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}