diff --git a/client/index.html b/client/index.html index e2d4aa8..6e8945f 100644 --- a/client/index.html +++ b/client/index.html @@ -14,18 +14,17 @@ -

Speech Recognition

-

Press the button to activate microphone.

- - - - - - -
-

Server offline

-

... erkannte worte ...

-
+

Digitaler Demenztest

+

Press the button to activate microphone.

+ + + + +
+

Server offline

+

Question:

+

Erkannte worte ...

+
diff --git a/client/style.css b/client/style.css index 85d842c..65c46b9 100644 --- a/client/style.css +++ b/client/style.css @@ -4,7 +4,7 @@ body, html { html { height: 100%; - background-color: teal; + background-color: rgb(65, 143, 143); } body { @@ -19,7 +19,7 @@ h1, p { div p { padding: 20px; - background-color: rgba(0,0,0,0.2); + background-color: rgba(51, 51, 51, 0.2); } div { diff --git a/client/ws-client.js b/client/ws-client.js index 5ddf652..6a750ac 100644 --- a/client/ws-client.js +++ b/client/ws-client.js @@ -87,7 +87,7 @@ var diagnosticPara = document.querySelector('.output'); var testBtn = document.querySelector('button'); var testBtn2 = document.getElementById('speechBtn'); var infoPara = document.getElementById('info'); -var userPrompt = document.getElementById('query'); +var questionNumDisplay = document.querySelector('.quest'); // #endregion // websocket to communicate with the server @@ -154,7 +154,7 @@ ws.onopen = function () { ws.onmessage = function (payload) { var dialogflowResult = JSON.parse(payload.data); checkIntent(dialogflowResult); - document.querySelector('h1').innerHTML = dialogflowResult.intent.displayName; + // document.querySelector('h1').innerHTML = dialogflowResult.intent.displayName; }; // #endregion @@ -215,6 +215,7 @@ function checkIntent (result) { function startQuestion (number) { question = number; state = 'answer'; + questionNumDisplay.textContent = 'Question: ' + question; handleQuestion(); } @@ -263,8 +264,11 @@ function readQuestionTwo () { window.setTimeout( function () { recognition.stop(); - console.log('recognition stopped'); - handleAnswer(answerQuery); + window.setTimeout( + function () { + handleAnswer(answerQuery); + answerQuery = ''; + }, 3000); }, 6000); recognition.start(); console.log('reocgnition started. Question: ' + question); @@ -369,39 +373,6 @@ function handleAnswerToThirdQuestion (query) { } // #endregion -// #region global functions -function startDemenzScreening () { - ws.send('starte demenz test'); - // startQuestion(2); - testBtn.disabled = true; - testBtn.textContent = 'Test in progress'; - infoPara.textContent = 'wait...'; - diagnosticPara.textContent = 'detecting...'; -} - -function speak (sentence) { - speechsynth.text = sentence; - window.speechSynthesis.speak(speechsynth); -} - -function testSpeechOut () { - answerQuery = 'apfel wiese tisch apfel lampe pferd'; - question = 1; - for (let i = 0; i < 2; i++) { - var tokens = answerQuery.split(new RegExp(separators.join('|'), 'g')); - questionPoints[question] += calculatePoints(tokens, QUESTION_ONE_ANSWERS); - } - - console.log(questionPoints[question]); - - // speechsynth.text = 'test 123'; - // speechsynth.volume = 1; - // speechsynth.rate = 1; - // console.log(speechsynth); - // window.speechSynthesis.speak(speechsynth); - // console.log(window.speechSynthesis); -} - // function recognizeSpeech () { // if (state === 'answer') { // var arr; @@ -427,6 +398,7 @@ function testSpeechOut () { // // recognition.grammars = speechRecognitionList; // } +// #region speech recognition event recognition.onresult = function (event) { var last = event.results.length - 1; var speechResult = event.results[last][0].transcript.toLowerCase(); @@ -439,57 +411,7 @@ recognition.onresult = function (event) { // testBtn.disabled = false // testBtn.textContent = 'record...' }; - -function processSpeech (speechResult) { - console.log('To dialogflow: ' + speechResult); - ws.send(speechResult); - - let timeOut; - switch (question) { - case 1: - timeOut = 6500; - break; - case 2: - answerQuery += speechResult; - return; - case 3: - if (speechResult.includes('uhr')) { - speechResult = speechResult.replace('uhr', ''); - } - timeOut = 6500; - break; - case 4: - break; - case 5: - timeOut = 6500; - break; - } - - if (state === 'answer') { - if (timerId != undefined) { - clearTimeout(timerId); - } - answerQuery += speechResult; - timerId = window.setTimeout( - function () { - // if (!rePrompt) { - // ws.send('ich brauche noch etwas Zeit') - // } else { - console.log('recording end. Evaluate: ' + answerQuery); - handleAnswer(answerQuery); - answerQuery = ''; - diagnosticPara.textContent = ''; - // } - recognition.stop(); - console.log('timer fallback'); - }, timeOut); - } else { - console.log('recording end.'); - recognition.stop(); - } -} - -// #region speech recognition event +1; recognition.onspeechend = function () { // recognition.stop(); // testBtn.disabled = false; @@ -542,6 +464,88 @@ recognition.onstart = function (event) { // } // #endregion +// #region global functions +function processSpeech (speechResult) { + console.log('To dialogflow: ' + speechResult); + ws.send(speechResult); + + let timeOut; + switch (question) { + case 1: + timeOut = 6500; + break; + case 2: + answerQuery += speechResult; + return; + case 3: + if (speechResult.includes('uhr')) { + speechResult = speechResult.replace('uhr', ''); + } + timeOut = 6500; + break; + case 4: + break; + case 5: + timeOut = 6500; + break; + } + + if (state === 'answer') { + if (timerId != undefined) { + clearTimeout(timerId); + } + answerQuery += speechResult; + timerId = window.setTimeout( + function () { + // if (!rePrompt) { + // ws.send('ich brauche noch etwas Zeit') + // } else { + console.log('recording end. Evaluate: ' + answerQuery); + handleAnswer(answerQuery); + answerQuery = ''; + diagnosticPara.textContent = ''; + // } + recognition.stop(); + console.log('timer fallback'); + }, timeOut); + } else { + console.log('recording end.'); + recognition.stop(); + } +} + +function startDemenzScreening () { + // ws.send('starte demenz test'); + startQuestion(2); + testBtn.disabled = true; + testBtn.textContent = 'Test in progress'; + infoPara.textContent = 'wait...'; + diagnosticPara.textContent = 'detecting...'; +} + +function testSpeechOut () { + answerQuery = 'apfel wiese tisch apfel lampe pferd'; + question = 1; + for (let i = 0; i < 2; i++) { + var tokens = answerQuery.split(new RegExp(separators.join('|'), 'g')); + questionPoints[question] += calculatePoints(tokens, QUESTION_ONE_ANSWERS); + } + + console.log(questionPoints[question]); + + // speechsynth.text = 'test 123'; + // speechsynth.volume = 1; + // speechsynth.rate = 1; + // console.log(speechsynth); + // window.speechSynthesis.speak(speechsynth); + // console.log(window.speechSynthesis); +} + +function speak (sentence) { + speechsynth.text = sentence; + window.speechSynthesis.speak(speechsynth); +} + function calculatePoints (tokens, d) { let points = 0; let dict = {};