script.js

// Greetings
// Question 1 Answers
const gq1w = document.getElementById("gq1w");
const gq1c = document.getElementById("gq1c");
// Question 2 Answers
const gq2w = document.getElementById("gq2w");
const gq2c = document.getElementById("gq2c");
// Question 3 Answers
const gq3w = document.getElementById("gq3w");
const gq3c = document.getElementById("gq3c");
// Question 4 Answers
const gq4w = document.getElementById("gq4w");
const gq4c = document.getElementById("gq4c");
// Question 5 Answers
const gq5w = document.getElementById("gq5w");
const gq5c = document.getElementById("gq5c");

const output = document.getElementById("output");
const modal = document.getElementById("modal");

function speakWord(word){
    const synth = window.speechSynthesis;
    const utterance = new SpeechSynthesisUtterance(word);
    synth.speak(utterance);
}

gq1w.addEventListener("click", function() {
    speakWord("Hello");
});

gq1c.addEventListener("click", function() {
    output.textContent = "Great Job, that is correct. Next, view the sign language";
    modal.style.display = "block";
});

gq2w.addEventListener("click", function() {
     speakWord("Please");
});

gq2c.addEventListener("click", function() {
    output.textContent = "Great Job, that is correct. Next, view the sign language";
    modal.style.display = "block";
});

gq3w.addEventListener("click", function() {
    speakWord("Thank you");
});
gq3c.addEventListener("click", function() {
    output.textContent = "Great Job, that is correct. Next, view the sign language";
    modal.style.display = "block";
});

gq4w.addEventListener("click", function() {
    speakWord("Goodbye");
});

gq4c.addEventListener("click", function() {
    output.textContent = "Great Job, that is correct. Next, view the sign language";
    modal.style.display = "block";
});

gq5w.addEventListener("click", function() {
     speakWord("All Done");
});
gq5c.addEventListener("click", function() {
    output.textContent = "Great Job, that is correct. Next, view the sign language";
    modal.style.display = "block";
});

window.onclick = function(event) {
    if(event.target == modal){
        modal.style.display = "none";
    }
};



const video = document.getElementById("myVideo");
function togglePlayPause() {
    if (video.paused) {
        video.play();
    } else {
        video.pause();
    }
}
video.addEventListener("click", togglePlayPause);