quiz

// setup

console.log("running");

	let q = 1;

	const submit = document.getElementById("next-button");

  const question = document.getElementById("question");

// next button

	document.getElementById("next-button").addEventListener("click", function () {

    // split by q value

    let radioButtons = document.querySelectorAll("input[name='yes-no']");

    if (q == 4) {

      radioButtons = document.querySelectorAll("input[name='time-choice']");

    } 

    let rejection = "We regret to inform you that you do not currently meet the requirements to become a Big Sisters mentor.";

    if (q == 1) {

      rejection += " However, we encourage you to explore other mentoring opportunities through <a href='https://www.bigbrothersvancouver.com/'>Big Brothers of Greater Vancouver</a>.";

    } else if (q == 2) {

      rejection += " However, we encourage you to explore other mentoring opportunities available through the various Big Brothers Big Sisters agencies located in BC. <br> If you reside in Langley, please contact: <a href='https://langley.bigbrothersbigsisters.ca/'>Big Brothers Big Sisters Langley</a>.<br> If you reside in Maple Ridge, Pitt Meadows, Abbotsford, or Chilliwack please contact: <a href='https://fraservalley.bigbrothersbigsisters.ca/'>Big Brothers Big Sisters Fraser Valley</a>."

    }

    for (const radioButton of radioButtons) {

      const yesButton = document.getElementById("yesChoice");

      const noButton = document.getElementById("noChoice");

      const yesLabel = document.getElementById("yesLabel");

      const noLabel = document.getElementById("noLabel");

      if (radioButton.checked && (radioButton.value == "no")) {

        document.getElementById("question").innerHTML = rejection;

        yesButton.remove();

        noButton.remove();

        const submit = document.getElementById("next-button");

        submit.remove();

        const yesLab = document.getElementById("yesLabel");

        const noLab = document.getElementById("noLabel");

        yesLab.remove();

        noLab.remove();

        break;

      }

      if (!radioButton.checked) {

        continue;

      }

      switch (q) {

        case 1: 

          question.innerHTML = "Do you live in BC Lower Mainland?" + "</br>" + "(If you reside in Langley, please contact: Big Brothers Big Sisters Langley <br> If you reside in Maple Ridge, Pitt Meadows, Abbotsford, or Chilliwack please contact: Big Brothers Big Sisters Fraser Valley)";

          break;

        case 2:

          question.innerHTML = "Are you able to provide a Canadian Criminal Record Check? If need be, are you able to provide an International Criminal Record Check? ";

          break;

        case 3:

          question.innerHTML = "How much time are you available to commit?";

          yesButton.remove();

          noButton.remove();

          yesLabel.remove();

          noLabel.remove();

          const q4 = document.createElement("p");

          question.insertAdjacentElement("afterend", q4);

          q4.innerHTML = "<input type='radio' name='time-choice' value='become-a-big-sister/' id='radio1'><label id='radio-label1'>I can commit 2-4 hours per week for a year</label> <br><input type='radio' name='time-choice' value='become-a-study-buddy/' id='radio2'><label id='radio-label2'>I can commit 1 hour per week for 6 months</label> <br><input type='radio' name='time-choice' value='become-a-go-girls-mentor/' id='radio3'><label id='radio-label3'>I can commit 2 hours per week for 8 weeks</label>";

          break;

        default:

          // assuming that we are at q4 with diff radioButtons          

          let result = "";

          if (radioButton.value == "become-a-big-sister/") {

            result = "Big Sisters";

          } else if (radioButton.value == "become-a-study-buddy/") {

            result = "Study Buddy";

          } else {

            result = "Go Girls"

          }

          // find the radio buttons

          // iterate

          // whichever is checked - use that value for the link

          question.innerHTML = "Based on your responses, we think you would be best fit for: ";

          let link = "<a href=https://www.bigsisters.bc.ca/" + radioButton.value + ">" + result + "!" + "</a>";

          question.innerHTML += link;

          // remove other elements

          const submit = document.getElementById("next-button");

          submit.remove();

          let ids = ["radio1", "radio2", "radio3", "radio-label1", "radio-label2", "radio-label3"]

          const buttons = document.getElementsByName("time-choice");

          for (let id of ids) {

            const element = document.getElementById(id);

            element.remove();

          }

        }

      q += 1;

      if (q < 4) {

        radioButton.checked = false;

      }

    }

});