From f8c9d25eca858108cb966c3c14657574a2908076 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 17:37:33 -0700 Subject: [PATCH 01/27] first try --- assets/scripts/expose.js | 44 +++++++++++++++++++++++++++++++++++++++- 1 file changed, 43 insertions(+), 1 deletion(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 962d7a33c..125ba8085 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -3,5 +3,47 @@ window.addEventListener('DOMContentLoaded', init); function init() { - // TODO + // Get necessary elements from the HTML DOM + const horn_select = document.querySelector('#horn-select'); + const volume_controls = document.querySelector('#volume'); + const play_sound = document.querySelector('button'); + const audio = document.querySelector('audio'); + + // Set up event listeners + horn_select.addEventListener('change', updateSound); + volume_controls.addEventListener('input', updateVolume); + play_sound.addEventListener('click', playSound); + + // Define the event listener functions + function updateSound() { + const selectedHorn = horn_select.value; + + // Update the image and audio file based on the selected horn + const horn_image = document.querySelector('section img'); + const horn_sound = `./assets/audio/${selectedHorn}.mp3`; + + horn_image.setAttribute('src', `./assets/images/${selectedHorn}.svg`); + audio.setAttribute('src', horn_sound); + } + + function updateVolume() { + const selectedVolume = volume_controls.value; + + // Update the volume icon displayed on the page + const volumeIcon = document.querySelector('#volume-controls img'); + if (selectedVolume == 0) { + volumeIcon.setAttribute('src', `./assets/icons/volume-level-0.svg`); + } else if (selectedVolume >= 1 && selectedVolume <= 33) { + volumeIcon.setAttribute('src', `./assets/icons/volume-level-1.svg`); + } else if (selectedVolume >= 34 && selectedVolume <= 66) { + volumeIcon.setAttribute('src', `./assets/icons/volume-level-2.svg`); + } else { + volumeIcon.setAttribute('src', `./assets/icons/volume-level-3.svg`); + } + } + + function playSound() { + audio.play(); +} + } \ No newline at end of file From 8dd93a9ef19e2f13a039c19495a21377f9855ab4 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 17:52:55 -0700 Subject: [PATCH 02/27] s --- assets/scripts/expose.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 125ba8085..da8d9e313 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -22,7 +22,7 @@ function init() { const horn_image = document.querySelector('section img'); const horn_sound = `./assets/audio/${selectedHorn}.mp3`; - horn_image.setAttribute('src', `./assets/images/${selectedHorn}.svg`); + horn_image.setAttribute('src', `./assets/images/air-horn.svg`); audio.setAttribute('src', horn_sound); } From 34940d997499e951c703804a76260bf72d954377 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 17:56:08 -0700 Subject: [PATCH 03/27] a --- assets/scripts/expose.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index da8d9e313..125ba8085 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -22,7 +22,7 @@ function init() { const horn_image = document.querySelector('section img'); const horn_sound = `./assets/audio/${selectedHorn}.mp3`; - horn_image.setAttribute('src', `./assets/images/air-horn.svg`); + horn_image.setAttribute('src', `./assets/images/${selectedHorn}.svg`); audio.setAttribute('src', horn_sound); } From 0434c0d3ca3d9b6d982bb066d06e062fcd57e011 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 17:56:15 -0700 Subject: [PATCH 04/27] d --- assets/scripts/expose.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 125ba8085..39e8d08e5 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -22,7 +22,7 @@ function init() { const horn_image = document.querySelector('section img'); const horn_sound = `./assets/audio/${selectedHorn}.mp3`; - horn_image.setAttribute('src', `./assets/images/${selectedHorn}.svg`); + horn_image.setAttribute('src', `./assets/images/$a.svg`); audio.setAttribute('src', horn_sound); } From 7026b4307c81a05b31dd9b841f6f4b754a593403 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 18:06:09 -0700 Subject: [PATCH 05/27] a --- assets/scripts/expose.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 39e8d08e5..3ee24cc72 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -22,7 +22,7 @@ function init() { const horn_image = document.querySelector('section img'); const horn_sound = `./assets/audio/${selectedHorn}.mp3`; - horn_image.setAttribute('src', `./assets/images/$a.svg`); + horn_image.setAttribute('src', `/assets/images/${selectedHorn}.svg`); audio.setAttribute('src', horn_sound); } @@ -32,13 +32,13 @@ function init() { // Update the volume icon displayed on the page const volumeIcon = document.querySelector('#volume-controls img'); if (selectedVolume == 0) { - volumeIcon.setAttribute('src', `./assets/icons/volume-level-0.svg`); + volumeIcon.setAttribute('src', `/assets/icons/volume-level-0.svg`); } else if (selectedVolume >= 1 && selectedVolume <= 33) { - volumeIcon.setAttribute('src', `./assets/icons/volume-level-1.svg`); + volumeIcon.setAttribute('src', `/assets/icons/volume-level-1.svg`); } else if (selectedVolume >= 34 && selectedVolume <= 66) { - volumeIcon.setAttribute('src', `./assets/icons/volume-level-2.svg`); + volumeIcon.setAttribute('src', `/assets/icons/volume-level-2.svg`); } else { - volumeIcon.setAttribute('src', `./assets/icons/volume-level-3.svg`); + volumeIcon.setAttribute('src', `/assets/icons/volume-level-3.svg`); } } From 907cbdb701110d2331c7d40645ea0b0357a17bed Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 18:08:16 -0700 Subject: [PATCH 06/27] t --- assets/scripts/expose.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 3ee24cc72..26fd4f998 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -20,7 +20,7 @@ function init() { // Update the image and audio file based on the selected horn const horn_image = document.querySelector('section img'); - const horn_sound = `./assets/audio/${selectedHorn}.mp3`; + const horn_sound = `/assets/audio/${selectedHorn}.mp3`; horn_image.setAttribute('src', `/assets/images/${selectedHorn}.svg`); audio.setAttribute('src', horn_sound); From 46f32ccc61031ad50546c38de3f97fbfd1d45944 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 18:16:51 -0700 Subject: [PATCH 07/27] syntax --- assets/scripts/expose.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 26fd4f998..125ba8085 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -20,9 +20,9 @@ function init() { // Update the image and audio file based on the selected horn const horn_image = document.querySelector('section img'); - const horn_sound = `/assets/audio/${selectedHorn}.mp3`; + const horn_sound = `./assets/audio/${selectedHorn}.mp3`; - horn_image.setAttribute('src', `/assets/images/${selectedHorn}.svg`); + horn_image.setAttribute('src', `./assets/images/${selectedHorn}.svg`); audio.setAttribute('src', horn_sound); } @@ -32,13 +32,13 @@ function init() { // Update the volume icon displayed on the page const volumeIcon = document.querySelector('#volume-controls img'); if (selectedVolume == 0) { - volumeIcon.setAttribute('src', `/assets/icons/volume-level-0.svg`); + volumeIcon.setAttribute('src', `./assets/icons/volume-level-0.svg`); } else if (selectedVolume >= 1 && selectedVolume <= 33) { - volumeIcon.setAttribute('src', `/assets/icons/volume-level-1.svg`); + volumeIcon.setAttribute('src', `./assets/icons/volume-level-1.svg`); } else if (selectedVolume >= 34 && selectedVolume <= 66) { - volumeIcon.setAttribute('src', `/assets/icons/volume-level-2.svg`); + volumeIcon.setAttribute('src', `./assets/icons/volume-level-2.svg`); } else { - volumeIcon.setAttribute('src', `/assets/icons/volume-level-3.svg`); + volumeIcon.setAttribute('src', `./assets/icons/volume-level-3.svg`); } } From 88139e1446af754b68b6e6077522c92378a99f68 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 18:27:15 -0700 Subject: [PATCH 08/27] Chnages --- assets/scripts/expose.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 125ba8085..5f8fd61ac 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -31,12 +31,16 @@ function init() { // Update the volume icon displayed on the page const volumeIcon = document.querySelector('#volume-controls img'); + audio.volume = selectedVolume/100; if (selectedVolume == 0) { volumeIcon.setAttribute('src', `./assets/icons/volume-level-0.svg`); + } else if (selectedVolume >= 1 && selectedVolume <= 33) { volumeIcon.setAttribute('src', `./assets/icons/volume-level-1.svg`); + } else if (selectedVolume >= 34 && selectedVolume <= 66) { volumeIcon.setAttribute('src', `./assets/icons/volume-level-2.svg`); + } else { volumeIcon.setAttribute('src', `./assets/icons/volume-level-3.svg`); } From ce27b48d20efad36b68cdd60769c850960c8aaa6 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 18:35:25 -0700 Subject: [PATCH 09/27] s --- assets/scripts/expose.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 5f8fd61ac..180d1dc7d 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -1,5 +1,5 @@ // expose.js - +import JSConfetti from 'js-confetti' window.addEventListener('DOMContentLoaded', init); function init() { @@ -48,6 +48,7 @@ function init() { function playSound() { audio.play(); + jsConfetti.addConfetti(); } } \ No newline at end of file From d2722f70209301ac3b974f70da0c128f58e64015 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 18:39:35 -0700 Subject: [PATCH 10/27] s --- assets/scripts/expose.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 180d1dc7d..3154d5cef 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -49,6 +49,6 @@ function init() { function playSound() { audio.play(); jsConfetti.addConfetti(); -} + } } \ No newline at end of file From cad8723f9be6e3f3ab5e17fbaef84fc2b57a6424 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 18:51:54 -0700 Subject: [PATCH 11/27] Update expose.js --- assets/scripts/expose.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 3154d5cef..fdbf842fc 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -1,5 +1,4 @@ // expose.js -import JSConfetti from 'js-confetti' window.addEventListener('DOMContentLoaded', init); function init() { @@ -48,7 +47,6 @@ function init() { function playSound() { audio.play(); - jsConfetti.addConfetti(); } -} \ No newline at end of file +} From e2316542a1ee680fb20c7a745f4f027a810eeef6 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 19:27:00 -0700 Subject: [PATCH 12/27] horn --- assets/scripts/expose.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index fdbf842fc..946c26846 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -47,6 +47,10 @@ function init() { function playSound() { audio.play(); + if (horn_select.value == "party-horn"){ + const jsConfetti = new JSConfetti() + jsConfetti.addConfetti() + } } } From 82065486e4e8e48673c8e55827129573c3be2d1d Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 19:49:58 -0700 Subject: [PATCH 13/27] Update explore.js Trial 1 --- assets/scripts/explore.js | 55 +++++++++++++++++++++++++++++++++++++-- 1 file changed, 53 insertions(+), 2 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 777f5ee3a..44a7bce50 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -3,5 +3,56 @@ window.addEventListener('DOMContentLoaded', init); function init() { - // TODO -} \ No newline at end of file + const synth = window.speechSynthesis; + let voices = []; + + function populateVoiceList() { + voices = synth.getVoices(); + + const voiceSelect = document.querySelector("#voice-select"); + voiceSelect.innerHTML = ""; + voices.forEach((voice) => { + const option = document.createElement("option"); + option.textContent = voice.name + " (" + voice.lang + ")"; + option.value = voice.name; + voiceSelect.appendChild(option); + }); + voiceSelect.selectedIndex = 0; + } + + populateVoiceList(); + if (synth.onvoiceschanged !== undefined) { + synth.onvoiceschanged = populateVoiceList; + } + + const speakBtn = document.querySelector("button"); + const textToSpeak = document.querySelector("#text-to-speak"); + const smilingFace = document.querySelector("img[src='assets/images/smiling.png']"); + const openMouthFace = document.querySelector("img[src='assets/images/open-mouth.png']"); + + speakBtn.addEventListener("click", () => { + if (synth.speaking) { + console.log("speechSynthesis.speaking"); + return; + } + if (textToSpeak.value !== "") { + const utterThis = new SpeechSynthesisUtterance(textToSpeak.value); + const selectedVoice = voices.find((voice) => voice.name === document.querySelector("#voice-select").value); + utterThis.voice = selectedVoice; + synth.speak(utterThis); + + smilingFace.style.display = "none"; + openMouthFace.style.display = "block"; + + utterThis.onend = () => { + console.log("SpeechSynthesisUtterance.onend"); + smilingFace.style.display = "block"; + openMouthFace.style.display = "none"; + }; + + utterThis.onerror = (event) => { + console.error("SpeechSynthesisUtterance.onerror", event); + }; + } + }); +} From 84d24ec0a13244f2887b2d941dab3aa5daf8dafa Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 20:37:19 -0700 Subject: [PATCH 14/27] trail 2 --- assets/scripts/explore.js | 89 ++++++++++++++++++--------------------- 1 file changed, 41 insertions(+), 48 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 44a7bce50..7e2a09c43 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -1,58 +1,51 @@ -// explore.js - -window.addEventListener('DOMContentLoaded', init); - -function init() { - const synth = window.speechSynthesis; - let voices = []; - - function populateVoiceList() { - voices = synth.getVoices(); - - const voiceSelect = document.querySelector("#voice-select"); - voiceSelect.innerHTML = ""; - voices.forEach((voice) => { - const option = document.createElement("option"); - option.textContent = voice.name + " (" + voice.lang + ")"; - option.value = voice.name; - voiceSelect.appendChild(option); - }); - voiceSelect.selectedIndex = 0; - } - - populateVoiceList(); - if (synth.onvoiceschanged !== undefined) { - synth.onvoiceschanged = populateVoiceList; - } - - const speakBtn = document.querySelector("button"); - const textToSpeak = document.querySelector("#text-to-speak"); - const smilingFace = document.querySelector("img[src='assets/images/smiling.png']"); - const openMouthFace = document.querySelector("img[src='assets/images/open-mouth.png']"); - - speakBtn.addEventListener("click", () => { - if (synth.speaking) { - console.log("speechSynthesis.speaking"); - return; +window.addEventListener('DOMContentLoaded', function() { + var synth = window.speechSynthesis; + var voiceSelect = document.querySelector("#voice-select"); + var speakBtn = document.querySelector("button"); + var textToSpeak = document.querySelector("#text-to-speak"); + var smilingFace = document.querySelector("img[src='assets/images/smiling.png']"); + var openMouthFace = document.querySelector("img[src='assets/images/open-mouth.png']"); + + function populateVoiceList() { + voices = synth.getVoices(); + var voiceSelectInnerHTML = ''; + for (var i = 0; i < voices.length; i++) { + voiceSelectInnerHTML += ''; + } + voiceSelect.innerHTML = voiceSelectInnerHTML; + } + + populateVoiceList(); + if (synth.onvoiceschanged !== undefined) { + synth.onvoiceschanged = populateVoiceList; } - if (textToSpeak.value !== "") { - const utterThis = new SpeechSynthesisUtterance(textToSpeak.value); - const selectedVoice = voices.find((voice) => voice.name === document.querySelector("#voice-select").value); - utterThis.voice = selectedVoice; + + speakBtn.addEventListener("click", function() { + if (synth.speaking || textToSpeak.value === "") { + return; + } + + var utterThis = new SpeechSynthesisUtterance(textToSpeak.value); + var voices = synth.getVoices(); + for (var i = 0; i < voices.length; i++) { + if (voices[i].name === voiceSelect.value) { + utterThis.voice = voices[i]; + break; + } + } synth.speak(utterThis); - + smilingFace.style.display = "none"; openMouthFace.style.display = "block"; - - utterThis.onend = () => { - console.log("SpeechSynthesisUtterance.onend"); + + utterThis.onend = function(event) { smilingFace.style.display = "block"; openMouthFace.style.display = "none"; }; - - utterThis.onerror = (event) => { + + utterThis.onerror = function(event) { console.error("SpeechSynthesisUtterance.onerror", event); }; - } + }); }); -} + \ No newline at end of file From 99f37ec051d86c7009a8cf647e45fd9f4083e8e3 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 20:56:41 -0700 Subject: [PATCH 15/27] h --- assets/scripts/expose.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 946c26846..9e34fe42c 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -48,8 +48,8 @@ function init() { function playSound() { audio.play(); if (horn_select.value == "party-horn"){ - const jsConfetti = new JSConfetti() - jsConfetti.addConfetti() + const jsConfetti = new JSConfetti(); + jsConfetti.addConfetti(); } } From d0790747b8e8539ab75e1378f8443349dd7788fa Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:04:25 -0700 Subject: [PATCH 16/27] s --- assets/scripts/expose.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/assets/scripts/expose.js b/assets/scripts/expose.js index 9e34fe42c..f2d5ad309 100644 --- a/assets/scripts/expose.js +++ b/assets/scripts/expose.js @@ -1,6 +1,6 @@ // expose.js window.addEventListener('DOMContentLoaded', init); - +const jsConfetti = new JSConfetti(); function init() { // Get necessary elements from the HTML DOM const horn_select = document.querySelector('#horn-select'); @@ -48,7 +48,6 @@ function init() { function playSound() { audio.play(); if (horn_select.value == "party-horn"){ - const jsConfetti = new JSConfetti(); jsConfetti.addConfetti(); } } From 9f45d10d412fbb77af7d3830b7540ac5e8b5a9cd Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:06:56 -0700 Subject: [PATCH 17/27] c --- assets/scripts/explore.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 7e2a09c43..3f85de999 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -5,6 +5,7 @@ window.addEventListener('DOMContentLoaded', function() { var textToSpeak = document.querySelector("#text-to-speak"); var smilingFace = document.querySelector("img[src='assets/images/smiling.png']"); var openMouthFace = document.querySelector("img[src='assets/images/open-mouth.png']"); + var voices = []; function populateVoiceList() { voices = synth.getVoices(); @@ -26,7 +27,6 @@ window.addEventListener('DOMContentLoaded', function() { } var utterThis = new SpeechSynthesisUtterance(textToSpeak.value); - var voices = synth.getVoices(); for (var i = 0; i < voices.length; i++) { if (voices[i].name === voiceSelect.value) { utterThis.voice = voices[i]; From 619fef3b48a6d93761c232423850a4632d1bccc1 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:22:52 -0700 Subject: [PATCH 18/27] s --- assets/scripts/explore.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 3f85de999..ea60dc687 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -3,8 +3,8 @@ window.addEventListener('DOMContentLoaded', function() { var voiceSelect = document.querySelector("#voice-select"); var speakBtn = document.querySelector("button"); var textToSpeak = document.querySelector("#text-to-speak"); - var smilingFace = document.querySelector("img[src='assets/images/smiling.png']"); - var openMouthFace = document.querySelector("img[src='assets/images/open-mouth.png']"); + var smilingFace = document.querySelector("img[src='./assets/images/smiling.png']"); + var openMouthFace = document.querySelector("img[src='./assets/images/open-mouth.png']"); var voices = []; function populateVoiceList() { From eb5505bf2a912c7f49451cd9a516b4acb0ac8e22 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:25:33 -0700 Subject: [PATCH 19/27] cccc --- assets/scripts/explore.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index ea60dc687..fc531fdb8 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -35,12 +35,12 @@ window.addEventListener('DOMContentLoaded', function() { } synth.speak(utterThis); - smilingFace.style.display = "none"; - openMouthFace.style.display = "block"; + smilingFace.style.display = "assets/images/smiling.png"; + openMouthFace.style.display = "assets/images/open-mouth.png"; utterThis.onend = function(event) { - smilingFace.style.display = "block"; - openMouthFace.style.display = "none"; + smilingFace.style.display = "assets/images/smiling.png"; + openMouthFace.style.display = "assets/images/open-mouth.png"; }; utterThis.onerror = function(event) { From 5f23e70d6fe57ca050fb3975b6dc5533715dc3fb Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:28:29 -0700 Subject: [PATCH 20/27] trash --- assets/scripts/explore.js | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index fc531fdb8..f70a299da 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -1,19 +1,19 @@ window.addEventListener('DOMContentLoaded', function() { var synth = window.speechSynthesis; - var voiceSelect = document.querySelector("#voice-select"); - var speakBtn = document.querySelector("button"); - var textToSpeak = document.querySelector("#text-to-speak"); - var smilingFace = document.querySelector("img[src='./assets/images/smiling.png']"); - var openMouthFace = document.querySelector("img[src='./assets/images/open-mouth.png']"); + var voice_select = document.querySelector("#voice-select"); + var button = document.querySelector("button"); + var text_to_speak = document.querySelector("#text_to_speak"); + var smilling = document.querySelector("img[src='./assets/images/smiling.png']"); + var open_mouth = document.querySelector("img[src='./assets/images/open-mouth.png']"); var voices = []; function populateVoiceList() { voices = synth.getVoices(); - var voiceSelectInnerHTML = ''; + var voice_selectInnerHTML = ''; for (var i = 0; i < voices.length; i++) { - voiceSelectInnerHTML += ''; + voice_selectInnerHTML += ''; } - voiceSelect.innerHTML = voiceSelectInnerHTML; + voice_select.innerHTML = voice_selectInnerHTML; } populateVoiceList(); @@ -21,26 +21,26 @@ window.addEventListener('DOMContentLoaded', function() { synth.onvoiceschanged = populateVoiceList; } - speakBtn.addEventListener("click", function() { - if (synth.speaking || textToSpeak.value === "") { + button.addEventListener("click", function() { + if (synth.speaking || text_to_speak.value === "") { return; } - var utterThis = new SpeechSynthesisUtterance(textToSpeak.value); + var utterThis = new SpeechSynthesisUtterance(text_to_speak.value); for (var i = 0; i < voices.length; i++) { - if (voices[i].name === voiceSelect.value) { + if (voices[i].name === voice_select.value) { utterThis.voice = voices[i]; break; } } synth.speak(utterThis); - smilingFace.style.display = "assets/images/smiling.png"; - openMouthFace.style.display = "assets/images/open-mouth.png"; + smilling.style.display = "assets/images/smiling.png"; + open_mouth.style.display = "assets/images/open-mouth.png"; utterThis.onend = function(event) { - smilingFace.style.display = "assets/images/smiling.png"; - openMouthFace.style.display = "assets/images/open-mouth.png"; + smilling.style.display = "assets/images/smiling.png"; + open_mouth.style.display = "assets/images/open-mouth.png"; }; utterThis.onerror = function(event) { From e0d4a6546d142d1992cb0f8dca925fa28d808b99 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:42:39 -0700 Subject: [PATCH 21/27] ddd --- assets/scripts/explore.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index f70a299da..ed0e75789 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -4,7 +4,7 @@ window.addEventListener('DOMContentLoaded', function() { var button = document.querySelector("button"); var text_to_speak = document.querySelector("#text_to_speak"); var smilling = document.querySelector("img[src='./assets/images/smiling.png']"); - var open_mouth = document.querySelector("img[src='./assets/images/open-mouth.png']"); + var open_mouth = document.querySelector("img[src='./assets/images/smiling-open.png']"); var voices = []; function populateVoiceList() { @@ -35,12 +35,12 @@ window.addEventListener('DOMContentLoaded', function() { } synth.speak(utterThis); - smilling.style.display = "assets/images/smiling.png"; - open_mouth.style.display = "assets/images/open-mouth.png"; + smilling.style.display = "none"; + open_mouth.style.display = "block"; utterThis.onend = function(event) { - smilling.style.display = "assets/images/smiling.png"; - open_mouth.style.display = "assets/images/open-mouth.png"; + smilling.style.display = "block"; + open_mouth.style.display = "none"; }; utterThis.onerror = function(event) { From efb7b48feb4147b724e4e6c62eaac6cb7594c82b Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:47:58 -0700 Subject: [PATCH 22/27] c --- assets/scripts/explore.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index ed0e75789..95271e480 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -2,7 +2,7 @@ window.addEventListener('DOMContentLoaded', function() { var synth = window.speechSynthesis; var voice_select = document.querySelector("#voice-select"); var button = document.querySelector("button"); - var text_to_speak = document.querySelector("#text_to_speak"); + var text_to_speak = document.querySelector("#tex-to-speak"); var smilling = document.querySelector("img[src='./assets/images/smiling.png']"); var open_mouth = document.querySelector("img[src='./assets/images/smiling-open.png']"); var voices = []; From c6a4a007ae2e260174ae25c0dcddae9976c698de Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 21:48:19 -0700 Subject: [PATCH 23/27] c --- assets/scripts/explore.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 95271e480..e31291d84 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -2,7 +2,7 @@ window.addEventListener('DOMContentLoaded', function() { var synth = window.speechSynthesis; var voice_select = document.querySelector("#voice-select"); var button = document.querySelector("button"); - var text_to_speak = document.querySelector("#tex-to-speak"); + var text_to_speak = document.querySelector("#text-to-speak"); var smilling = document.querySelector("img[src='./assets/images/smiling.png']"); var open_mouth = document.querySelector("img[src='./assets/images/smiling-open.png']"); var voices = []; From 3cff1823b900dd505ab49a0b334039245f6fb813 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 22:03:05 -0700 Subject: [PATCH 24/27] hehehehe --- assets/scripts/explore.js | 72 ++++++++++++++++++++++++++++++++------- 1 file changed, 60 insertions(+), 12 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index e31291d84..4aeb03897 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -1,10 +1,61 @@ +// window.addEventListener('DOMContentLoaded', function() { +// var synth = window.speechSynthesis; +// var voice_select = document.querySelector("#voice-select"); +// var button = document.querySelector("button"); +// var text_to_speak = document.querySelector("#text-to-speak"); +// var smilling = document.querySelector("img[src='./assets/images/smiling.png']"); +// var open_mouth = document.querySelector("img[src='./assets/images/smiling-open.png']"); +// var voices = []; + +// function populateVoiceList() { +// voices = synth.getVoices(); +// var voice_selectInnerHTML = ''; +// for (var i = 0; i < voices.length; i++) { +// voice_selectInnerHTML += ''; +// } +// voice_select.innerHTML = voice_selectInnerHTML; +// } + +// populateVoiceList(); +// if (synth.onvoiceschanged !== undefined) { +// synth.onvoiceschanged = populateVoiceList; +// } + +// button.addEventListener("click", function() { +// if (synth.speaking || text_to_speak.value === "") { +// return; +// } + +// var utterThis = new SpeechSynthesisUtterance(text_to_speak.value); +// for (var i = 0; i < voices.length; i++) { +// if (voices[i].name === voice_select.value) { +// utterThis.voice = voices[i]; +// break; +// } +// } +// synth.speak(utterThis); + +// smilling.style.display = "none"; +// open_mouth.style.display = "block"; + +// utterThis.onend = function(event) { +// smilling.style.display = "block"; +// open_mouth.style.display = "none"; +// }; + +// utterThis.onerror = function(event) { +// console.error("SpeechSynthesisUtterance.onerror", event); +// }; +// }); +// }); + window.addEventListener('DOMContentLoaded', function() { var synth = window.speechSynthesis; var voice_select = document.querySelector("#voice-select"); var button = document.querySelector("button"); var text_to_speak = document.querySelector("#text-to-speak"); - var smilling = document.querySelector("img[src='./assets/images/smiling.png']"); - var open_mouth = document.querySelector("img[src='./assets/images/smiling-open.png']"); + var smilling = document.querySelector("img"); + //var open_mouth = document.querySelector("img[src='./assets/images/smiling-open.png']"); var voices = []; function populateVoiceList() { @@ -34,18 +85,15 @@ window.addEventListener('DOMContentLoaded', function() { } } synth.speak(utterThis); - - smilling.style.display = "none"; - open_mouth.style.display = "block"; - - utterThis.onend = function(event) { - smilling.style.display = "block"; - open_mouth.style.display = "none"; - }; + smilling.src = "assets/images/smiling-open.png"; + say.addEventListener("end", function () { + console.log(speechSynthesis.speaking); + smiley.src = "assets/images/smiling.png"; + }); utterThis.onerror = function(event) { console.error("SpeechSynthesisUtterance.onerror", event); }; }); - }); - \ No newline at end of file +}); + From 7921dcb0e217907ef585dbfec381afe98c3a751f Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 22:03:20 -0700 Subject: [PATCH 25/27] ddd --- assets/scripts/explore.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 4aeb03897..0ca54e206 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -88,7 +88,7 @@ window.addEventListener('DOMContentLoaded', function() { smilling.src = "assets/images/smiling-open.png"; say.addEventListener("end", function () { console.log(speechSynthesis.speaking); - smiley.src = "assets/images/smiling.png"; + smilling.src = "assets/images/smiling.png"; }); utterThis.onerror = function(event) { From ab46eb0ed1336713482743bec2dd1eb1ca65e8f1 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 22:03:40 -0700 Subject: [PATCH 26/27] dd --- assets/scripts/explore.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 0ca54e206..75b57d542 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -86,7 +86,7 @@ window.addEventListener('DOMContentLoaded', function() { } synth.speak(utterThis); smilling.src = "assets/images/smiling-open.png"; - say.addEventListener("end", function () { + utterThis.addEventListener("end", function () { console.log(speechSynthesis.speaking); smilling.src = "assets/images/smiling.png"; }); From d37968eca558cfc51fcadd5108497ab6dda93842 Mon Sep 17 00:00:00 2001 From: aaadit24 <97692709+aaadit24@users.noreply.github.com> Date: Sun, 7 May 2023 22:20:06 -0700 Subject: [PATCH 27/27] efef --- assets/scripts/explore.js | 52 --------------------------------------- 1 file changed, 52 deletions(-) diff --git a/assets/scripts/explore.js b/assets/scripts/explore.js index 75b57d542..87b009a77 100644 --- a/assets/scripts/explore.js +++ b/assets/scripts/explore.js @@ -1,54 +1,3 @@ -// window.addEventListener('DOMContentLoaded', function() { -// var synth = window.speechSynthesis; -// var voice_select = document.querySelector("#voice-select"); -// var button = document.querySelector("button"); -// var text_to_speak = document.querySelector("#text-to-speak"); -// var smilling = document.querySelector("img[src='./assets/images/smiling.png']"); -// var open_mouth = document.querySelector("img[src='./assets/images/smiling-open.png']"); -// var voices = []; - -// function populateVoiceList() { -// voices = synth.getVoices(); -// var voice_selectInnerHTML = ''; -// for (var i = 0; i < voices.length; i++) { -// voice_selectInnerHTML += ''; -// } -// voice_select.innerHTML = voice_selectInnerHTML; -// } - -// populateVoiceList(); -// if (synth.onvoiceschanged !== undefined) { -// synth.onvoiceschanged = populateVoiceList; -// } - -// button.addEventListener("click", function() { -// if (synth.speaking || text_to_speak.value === "") { -// return; -// } - -// var utterThis = new SpeechSynthesisUtterance(text_to_speak.value); -// for (var i = 0; i < voices.length; i++) { -// if (voices[i].name === voice_select.value) { -// utterThis.voice = voices[i]; -// break; -// } -// } -// synth.speak(utterThis); - -// smilling.style.display = "none"; -// open_mouth.style.display = "block"; - -// utterThis.onend = function(event) { -// smilling.style.display = "block"; -// open_mouth.style.display = "none"; -// }; - -// utterThis.onerror = function(event) { -// console.error("SpeechSynthesisUtterance.onerror", event); -// }; -// }); -// }); - window.addEventListener('DOMContentLoaded', function() { var synth = window.speechSynthesis; var voice_select = document.querySelector("#voice-select"); @@ -87,7 +36,6 @@ window.addEventListener('DOMContentLoaded', function() { synth.speak(utterThis); smilling.src = "assets/images/smiling-open.png"; utterThis.addEventListener("end", function () { - console.log(speechSynthesis.speaking); smilling.src = "assets/images/smiling.png"; });