From fcb6bec4746314244d9abca42e97cf7949ec2a3e Mon Sep 17 00:00:00 2001 From: Srayash <146334722+Srayash@users.noreply.github.com> Date: Mon, 28 Oct 2024 02:52:13 +0530 Subject: [PATCH 1/3] Update TextToSpeechButton.tsx --- .../src/components/TextToSpeechButton.tsx | 33 ++++++++++--------- 1 file changed, 18 insertions(+), 15 deletions(-) diff --git a/frontend/src/components/TextToSpeechButton.tsx b/frontend/src/components/TextToSpeechButton.tsx index 2ab7d1c2..cc062c87 100644 --- a/frontend/src/components/TextToSpeechButton.tsx +++ b/frontend/src/components/TextToSpeechButton.tsx @@ -1,6 +1,7 @@ import { useState } from 'react'; import Speaker from '../assets/speaker.svg?react'; import Stopspeech from '../assets/stopspeech.svg?react'; +import EasySpeech from 'easy-speech'; export default function SpeakButton({ text, @@ -14,26 +15,28 @@ export default function SpeakButton({ const [isSpeaking, setIsSpeaking] = useState(false); const [isSpeakHovered, setIsSpeakHovered] = useState(false); - const handleSpeakClick = (text: string) => { + const handleSpeakClick = async (text: string) => { if (isSpeaking) { - window.speechSynthesis.cancel(); + EasySpeech.cancel(); setIsSpeaking(false); return; } // Stop ongoing speech if already speaking - const utterance = new SpeechSynthesisUtterance(text); - setIsSpeaking(true); - - utterance.onend = () => { - setIsSpeaking(false); // Reset when speech ends - }; - - utterance.onerror = () => { - console.error('Speech synthesis failed.'); - setIsSpeaking(false); - }; - - window.speechSynthesis.speak(utterance); + try { + await EasySpeech.init(); // Initialize EasySpeech + setIsSpeaking(true); + + EasySpeech.speak({ + text, + onend: () => setIsSpeaking(false), // Reset when speech ends + onerror: () => { + console.error('Speech synthesis failed.'); + setIsSpeaking(false); + }, + }); + } catch (error) { + console.error('Failed to initialize speech synthesis', error); + } }; return ( From 6978e7439f9039b8c8cfe1f201b6d40e131db089 Mon Sep 17 00:00:00 2001 From: Srayash <146334722+Srayash@users.noreply.github.com> Date: Mon, 28 Oct 2024 02:53:07 +0530 Subject: [PATCH 2/3] Update package-lock.json --- frontend/package-lock.json | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 4087e4f5..37bf0c07 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@reduxjs/toolkit": "^2.2.7", "chart.js": "^4.4.4", + "easy-speech": "^2.4.0", "i18next": "^23.15.1", "i18next-browser-languagedetector": "^8.0.0", "prop-types": "^15.8.1", @@ -3075,6 +3076,24 @@ "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==", "dev": true }, + "node_modules/easy-speech": { + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/easy-speech/-/easy-speech-2.4.0.tgz", + "integrity": "sha512-wpMv29DEoeP/eyXr4aXpDqd9DvlXl7aQs7BgfKbjGVxqkmQPgNmpbF5YULaTH5bc/5qrteg5MDfCD2Zd0qr4rQ==", + "funding": [ + { + "type": "GitHub", + "url": "https://github.com/sponsors/jankapunkt" + }, + { + "type": "PayPal", + "url": "https://paypal.me/kuesterjan" + } + ], + "engines": { + "node": ">= 14.x" + } + }, "node_modules/electron-to-chromium": { "version": "1.5.11", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.11.tgz", From 0b1a3029959384df00fff0b5e0bce78c0fc52b94 Mon Sep 17 00:00:00 2001 From: Srayash <146334722+Srayash@users.noreply.github.com> Date: Mon, 28 Oct 2024 02:53:51 +0530 Subject: [PATCH 3/3] Update package.json --- frontend/package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/package.json b/frontend/package.json index 83d531d6..9148831f 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -21,6 +21,7 @@ "dependencies": { "@reduxjs/toolkit": "^2.2.7", "chart.js": "^4.4.4", + "easy-speech": "^2.4.0", "i18next": "^23.15.1", "i18next-browser-languagedetector": "^8.0.0", "prop-types": "^15.8.1",