Difference between revisions of "Team:Purdue/Quiz"

 
(63 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
 
+
{{:Team:Purdue/NavBar}}
 
<html>
 
<html>
 +
 +
 +
<!-- TODO: add pictures to the questions -->
  
 
<head>
 
<head>
−
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Team:Purdue/NavBarCSS?action=raw&ctype=text/css" />
 
−
<link rel="stylesheet" type="text/css" href="https://2018.igem.org/Team:Purdue/BootstrapCSS?action=raw&ctype=text/css" />
 
 
   
 
   
−
</head>
+
<style>
 +
#body{
 +
text-align: center;
 +
}
  
−
<body>
+
#HQ_page p
 +
{font-size:18px;
 +
}
  
 +
</style>
 +
</head>
  
 +
<body>
 +
<div class="spacer-small"></div>
 +
<div class="spacer-small"></div>
 +
<div style="display:flex;justify-content:center;">
 +
<table style="border-style:solid;border-width:2px;width:1200px;height:800px;">
 +
<tr>
 +
<td>
 +
<div class="basic-page-body" id="body" >
 
<h1 id = "questionNumber"> Question 1 </h1>
 
<h1 id = "questionNumber"> Question 1 </h1>
−
<p id="question"> Men can also get yeast infections? </p>
+
<p id="question" style="font-size:24px;text-align:center;"> Men can also get yeast infections? </p>
−
<button id="yes" onclick="correct=yesAnswer(counter,correct)"> Yes </button>
+
<div class="clear"></div>
−
<button id="no" onclick="correct=noAnswer(counter,correct)"> No </button>
+
<div class="clear"></div>
 +
<button id="yes" class="btn btn-warning" style="Width:49%;" onclick="correct=yesAnswer(counter,correct)"> Yes </button>
 +
<button id="no" class="btn btn-warning" style="Width:49%;" onclick="correct=noAnswer(counter,correct)"> No </button>
 
<h2 id="Commentary"></h2>
 
<h2 id="Commentary"></h2>
 
<div class="clear"></div>
 
<div class="clear"></div>
 
<div class="clear"></div>
 
<div class="clear"></div>
 
<div class="clear"></div>
 
<div class="clear"></div>
 +
<div style="border-style:solid;visibility:hidden;" id="button">
 
<p id="Description"></p>
 
<p id="Description"></p>
−
<button style="visibility:hidden;" onclick="counter=nextQuestion(counter)" id="button">Next Question</button>
+
<div class="spacer-small" ></div>
−
 
+
<button style="Width:59%;" class="btn btn-warning" onclick="counter=nextQuestion(counter)" id="btn" >Next Question</button>
 +
<div class="clear"></div>
 +
<div class="clear"></div>
 +
</div>
 +
</div>
 +
</td>
 +
</tr>
 +
</table>
 +
</div>
 
<script>
 
<script>
 
var counter=0;
 
var counter=0;
Line 31: Line 58:
 
var question4=1;
 
var question4=1;
 
var question5=1;
 
var question5=1;
 +
var divi = document.createElement("div");
 +
function createLink(url,desc,p){
 +
        link = document.createElement("a");
 +
        link.href=url;
 +
        link.innerHTML= desc;
 +
        link.target= "_blank";
 +
        p.appendChild(link);
 +
        divi.appendChild(p);
 +
 
 +
}
  
−
var link = new Element("a");
+
function questionReset(question,number){
 +
document.getElementById("questionNumber").innerHTML= number;
 +
document.getElementById("question").innerHTML= question;
 +
document.getElementById("button").style.visibility="hidden";
 +
document.getElementById("Commentary").innerHTML="";
 +
document.getElementById("Description").innerHTML="";
 +
                document.getElementById("yes").style.visibility="visible";
 +
                document.getElementById("no").style.visibility="visible";
 +
}
  
  
Line 39: Line 84:
 
// First Question Answer
 
// First Question Answer
 
   if(cnt==0){
 
   if(cnt==0){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Correct!";
 
document.getElementById("Commentary").innerHTML="Correct!";
−
document.getElementById("Description").innerHTML="The main way men get yeast infections is through "+
+
                document.getElementById("Commentary").style.color="green";
−
"intercourse with women whom is infected.";
+
document.getElementById("Description").innerHTML="The most common way men can contract yeast infections is during intercourse with another women who has a yeast infection.";
 
document.getElementById("button").style.visibility = "visible";
 
document.getElementById("button").style.visibility = "visible";
 
numCorrect =numCorrect + 1;
 
numCorrect =numCorrect + 1;
Line 47: Line 94:
 
// Second Question Answer
 
// Second Question Answer
 
else if(cnt==1){
 
else if(cnt==1){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Correct!";
 
document.getElementById("Commentary").innerHTML="Correct!";
−
document.getElementById("Description").innerHTML="C. Albicans exists in two different forms. There is a white form and an opaque form. <br>"+
+
                document.getElementById("Commentary").style.color="green";
−
"white gains the ability to borrow through skin and is often the cause of yeast infections in the blood <br>"+
+
document.getElementById("Description").innerHTML="<i>C. Albicans</i> exists in two different forms. There is a white form and an opaque form. <br>"+
−
"opaque is a more fertile form where it can reproduce upwards to 300% faster. This form normally causes mucosal infections";
+
"The white form gains the ability to borrow through skin and is often the cause of yeast infections in the blood. <br>"+
 +
"The opaque form is a more fertile form where it can reproduce upwards to 300% faster. This form normally causes mucosal infections.";
 
document.getElementById("button").style.visibility= "visible";
 
document.getElementById("button").style.visibility= "visible";
 
numCorrect = numCorrect + 1;
 
numCorrect = numCorrect + 1;
Line 57: Line 107:
 
// Third Question Answer
 
// Third Question Answer
 
else if(cnt==2){
 
else if(cnt==2){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Incorrect!";
 
document.getElementById("Commentary").innerHTML="Incorrect!";
−
document.getElementById("Description").innerHTML=" While the test is okay to use to determine a yeast infection, the test doesn't directly detect for a yeast.<br>"+
+
                document.getElementById("Commentary").style.color="red";
−
"Instead, it checks the pH of the region. If it is a bacterial infection, it will have a raised pH, otherwise it is likely a yeast infection,<br>"+
+
document.getElementById("Description").innerHTML=" The test doesn't detect for the presence of yeast directly.<br>"+
−
"This leaves room for error, as sometimes, the symptoms of a yeast infection can be from an alergic reaction, this will also not raise pH.<br>"+
+
"Instead, it detects the pH of the region. If it is a bacterial infection, it will have a higher pH. Otherwise, it is likely a yeast infection.<br>"+
−
"Also, sometimes things like creams or viral STI's or other things can cause a rise in the pH, making the test read a bacterial infection instead of a yeast infection.";
+
"This leaves room for error because the symptoms of a yeast infection can be from an allergic reaction, this will also not raise pH. <br>"+
 +
"Also, sometimes things like creams or viral STI's or other things can cause a rise in the pH, making the test read a bacterial infection instead of a yeast infection. There are many other factors other than these that can skew pH to cause inaccurate results.";
 
document.getElementById("button").style.visibility="visible";
 
document.getElementById("button").style.visibility="visible";
 
                 question3 = 0;
 
                 question3 = 0;
Line 68: Line 121:
 
// Fourth Question Answer
 
// Fourth Question Answer
 
else if(cnt==3){
 
else if(cnt==3){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Correct";
 
document.getElementById("Commentary").innerHTML="Correct";
−
document.getElementById("Description").innerHTML="We use split Tyrosinase and pqsR and join each half with a split HRP. In the presence in Farnesol and Tyrosol, Tyrosinase and pqsR will bond to it<br>"+
+
                document.getElementById("Commentary").style.color="green";
−
"Each half will come together and reform, this will then allow the HRP to reform and catalyze a reaction to produce a visible blue substrate.";
+
document.getElementById("Description").innerHTML="We use split tyrosinase and pqsR and join each half with a split HRP. In the presence in farnesol and tyrosol, tyrosinase and pqsR will bond to it.<br>"+
 +
"Each half will come together and reform. This will then allow the HRP to reform and catalyze a reaction to produce a visible blue substrate.";
 
document.getElementById("button").style.visibility="visible";
 
document.getElementById("button").style.visibility="visible";
 
numCorrect = numCorrect  + 1;
 
numCorrect = numCorrect  + 1;
 
}
 
}
 
else if(cnt==4){
 
else if(cnt==4){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Incorrect";
 
document.getElementById("Commentary").innerHTML="Incorrect";
 +
                document.getElementById("Commentary").style.color="red";
 
document.getElementById("Description").innerHTML="Current modern methods use antibodies which are somewhat expensive to produce and therefore expensive to purchase.<br>"+
 
document.getElementById("Description").innerHTML="Current modern methods use antibodies which are somewhat expensive to produce and therefore expensive to purchase.<br>"+
 
"Furthermore, the anitbodies are detected via fluoresence and a fluoresence microscope can cost between 1.5k to 5k USD.<br>"+
 
"Furthermore, the anitbodies are detected via fluoresence and a fluoresence microscope can cost between 1.5k to 5k USD.<br>"+
Line 96: Line 155:
 
     // First Question Answer
 
     // First Question Answer
 
if(cnt==0){
 
if(cnt==0){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Incorrect";
 
document.getElementById("Commentary").innerHTML="Incorrect";
 +
                document.getElementById("Commentary").style.color="red";
 
document.getElementById("Description").innerHTML="The main way men get yeast infections is through "+
 
document.getElementById("Description").innerHTML="The main way men get yeast infections is through "+
 
"intercourse with women whom is infected.";
 
"intercourse with women whom is infected.";
Line 104: Line 166:
 
// Second Question Answer
 
// Second Question Answer
 
else if(cnt==1){
 
else if(cnt==1){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Incorrect";
 
document.getElementById("Commentary").innerHTML="Incorrect";
−
document.getElementById("Description").innerHTML="C. Albicans exists in two different forms. There is a white form and an opaque form. <br>"+
+
                document.getElementById("Commentary").style.color="red";
 +
document.getElementById("Description").innerHTML="<i>C. Albicans</i> exists in two different forms. There is a white form and an opaque form. <br>"+
 
"white gains the ability to borrow through skin and is often the cause of yeast infections in the blood <br>"+
 
"white gains the ability to borrow through skin and is often the cause of yeast infections in the blood <br>"+
 
"opaque is a more fertile form where it can reproduce upwards to 300% faster. This form normally causes mucosal infections";
 
"opaque is a more fertile form where it can reproduce upwards to 300% faster. This form normally causes mucosal infections";
Line 113: Line 178:
 
 
 
else if(cnt==2){
 
else if(cnt==2){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Correct";
 
document.getElementById("Commentary").innerHTML="Correct";
 +
                document.getElementById("Commentary").style.color="green";
 
document.getElementById("Description").innerHTML=" While the test is okay to use to determine a yeast infection, the test doesn't directly detect for a yeast infection."+
 
document.getElementById("Description").innerHTML=" While the test is okay to use to determine a yeast infection, the test doesn't directly detect for a yeast infection."+
 
"Instead, it checks the pH of the region. If it is a bacterial infection, it will have a raised pH, otherwise it is likely a yeast infection,"+
 
"Instead, it checks the pH of the region. If it is a bacterial infection, it will have a raised pH, otherwise it is likely a yeast infection,"+
Line 124: Line 192:
 
 
 
else if(cnt==3){
 
else if(cnt==3){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Incorrect";
 
document.getElementById("Commentary").innerHTML="Incorrect";
−
document.getElementById("Description").innerHTML="We use split Tyrosinase and pqsR and join each half with a split HRP. In the presence in Farnesol and Tyrosol, Tyrosinase and pqsR will bond to it<br>"+
+
                document.getElementById("Commentary").style.color="red";
 +
document.getElementById("Description").innerHTML="We use split tyrosinase and pqsR and join each half with a split HRP. In the presence in farnesol and tyrosol, tyrosinase and pqsR will bond to it<br>"+
 
"Each half will come together and reform, this will then allow the HRP to reform and catalyze a reaction to produce a visible blue substrate.";
 
"Each half will come together and reform, this will then allow the HRP to reform and catalyze a reaction to produce a visible blue substrate.";
 
document.getElementById("button").style.visibility="visible";
 
document.getElementById("button").style.visibility="visible";
Line 131: Line 202:
 
}
 
}
 
else if(cnt==4){
 
else if(cnt==4){
 +
                document.getElementById("yes").style.visibility="hidden";
 +
                document.getElementById("no").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="Correct";
 
document.getElementById("Commentary").innerHTML="Correct";
 +
                document.getElementById("Commentary").style.color="green";
 
document.getElementById("Description").innerHTML="Current modern methods use antibodies which are somewhat expensive to produce and therefore expensive to purchase.<br>"+
 
document.getElementById("Description").innerHTML="Current modern methods use antibodies which are somewhat expensive to produce and therefore expensive to purchase.<br>"+
 
"Furthermore, the anitbodies are detected via fluoresence and a fluoresence microscope can cost between 1.5k to 5k USD.<br>"+
 
"Furthermore, the anitbodies are detected via fluoresence and a fluoresence microscope can cost between 1.5k to 5k USD.<br>"+
Line 153: Line 227:
 
// Second Question
 
// Second Question
 
if(cnt==0){
 
if(cnt==0){
−
document.getElementById("questionNumber").innerHTML= "Question 2";
+
                questionReset("<i>C. Albicans</i> can exisit in two different forms which produce different molecules?","Question 2");
−
document.getElementById("question").innerHTML= "C. Albicans can exisit in two different forms which produce different molecules?";
+
−
document.getElementById("button").style.visibility="hidden";
+
−
document.getElementById("Commentary").innerHTML="";
+
−
document.getElementById("Description").innerHTML="";
+
 
}
 
}
 
// Third Question
 
// Third Question
 
else if(cnt==1){
 
else if(cnt==1){
−
document.getElementById("questionNumber").innerHTML= "Question 3";
+
                questionReset("Over-the-counter yeast infection tests specifically test for the presence of invasive yeast when diagnosing a yeast infection?","Question 3");
−
document.getElementById("question").innerHTML= "Yeast infection kits that you buy from over the counter test specifically for yeast when diagnosing a yeast infection?";
+
−
document.getElementById("button").style.visibility="hidden";
+
−
document.getElementById("Commentary").innerHTML="";
+
−
document.getElementById("Description").innerHTML="";
+
−
+
 
}
 
}
 
// Fourth Question
 
// Fourth Question
 
else if(cnt==2){
 
else if(cnt==2){
−
document.getElementById("questionNumber").innerHTML= "Question 4";
+
                questionReset("Split proteins are proteins that are transcribed as two different halves of one protein, but after translation can form together to create a functional protein?","Question 4");
−
document.getElementById("question").innerHTML= "Split Proteins are proteins that are transcribed in two different halfs, but then form together to create a functional protein.";
+
−
document.getElementById("button").style.visibility="hidden";
+
−
document.getElementById("Commentary").innerHTML="";
+
−
document.getElementById("Description").innerHTML="";
+
 
}
 
}
 
 
 
// Fifth Question
 
// Fifth Question
 
else if(cnt==3){
 
else if(cnt==3){
−
+
        questionReset("Invasive yeast infections are cheap to diagnose, (other than using a blood culture test). ","Question5");
−
document.getElementById("questionNumber").innerHTML= "Question 5";
+
−
document.getElementById("question").innerHTML= "Invasive Yeast Infections are cheap to diagnose, (besides growing a culture from blood.) ";
+
−
document.getElementById("button").style.visibility="hidden";
+
−
document.getElementById("Commentary").innerHTML="";
+
−
document.getElementById("Description").innerHTML="";
+
 
 
 
}
 
}
Line 192: Line 248:
 
document.getElementById("questionNumber").innerHTML= "Results";
 
document.getElementById("questionNumber").innerHTML= "Results";
 
document.getElementById("question").innerHTML= "Thank you for taking our quiz";
 
document.getElementById("question").innerHTML= "Thank you for taking our quiz";
−
document.getElementById("button").style.visibility="hidden";
+
document.getElementById("btn").style.visibility="hidden";
 
document.getElementById("Commentary").innerHTML="";
 
document.getElementById("Commentary").innerHTML="";
 
document.getElementById("Description").innerHTML="You got " +correct+" out of 5 correct";
 
document.getElementById("Description").innerHTML="You got " +correct+" out of 5 correct";
 
document.getElementById("yes").style.visibility="hidden";
 
document.getElementById("yes").style.visibility="hidden";
 
document.getElementById("no").style.visibility="hidden";
 
document.getElementById("no").style.visibility="hidden";
−
                divi = document.createElement("div");
 
−
                link1 = document.createElement("a");
 
−
                link1.innerHTML = "Click here for more info on men's yeast infection.";
 
−
                link1.href= "https://www.bmj.com/content/2/6079/93.abstract";
 
−
                link1.target="_blank";
 
−
                link2 = document.createElement("a");
 
−
                link2.innerHTML = "Click here for more info on C.Albicans."
 
−
                link2.href= "http://journals.plos.org/plospathogens/article?id=10.1371/journal.ppat.1003661";
 
−
                link2.target= "_blank";
 
−
                link3 = document.createElement("a");       
 
−
  link3.href="https://www.fda.gov/MedicalDevices/ProductsandMedicalProcedures/InVitroDiagnostics/HomeUseTests/ucm126074.html";
 
−
               
 
−
                link4 = document.createElement("a");
 
−
                link5 = document.createElement("a");
 
 
                 para2 = document.createElement("p");
 
                 para2 = document.createElement("p");
 
                 para3 = document.createElement("p");
 
                 para3 = document.createElement("p");
Line 217: Line 259:
 
                 para1 = document.createElement("p");
 
                 para1 = document.createElement("p");
 
                 para1.innerHTML="For more information about yeast infections in men and as an STI check out this link.";
 
                 para1.innerHTML="For more information about yeast infections in men and as an STI check out this link.";
 +
                createLink("https://www.bmj.com/content/2/6079/93.abstract"," Click here for more info about men's yeast infection",para1);
 
                 para2.innerHTML="For more information about C.Albicans and its two different form, check out this link.";
 
                 para2.innerHTML="For more information about C.Albicans and its two different form, check out this link.";
−
                 para3.innerHTML="For more information about pH used to detect yeast infections, check out this link.";
+
                createLink("http://journals.plos.org/plospathogens/article?id=10.1371/journal.ppat.1003661"," Click here for more info on C.Albicans.",para2);
−
                para1.appendChild(link1);
+
                 para3.innerHTML=" For more information about pH used to detect yeast infections, check out this link.";         createLink("https://www.fda.gov/MedicalDevices/ProductsandMedicalProcedures/InVitroDiagnostics/HomeUseTests/ucm126074.htm", " See what FDA say about pH tests for yeast infections",para3);
−
                para2.appendChild(link2);
+
                 para4.innerHTML="For more info on split proteins, check out this paper."
−
                divi.appendChild(para1);
+
                 createLink("https://www.sciencedirect.com/science/article/pii/S136759311100161X?via%3Dihub"," Check out a literature review on split proteins.",para4);
−
                 divi.appendChild(para2);
+
                 para5.innerHTML="For more information about different tests check out our challenge analysis";
−
                 divi.appendChild(para3);
+
                 createLink("https://2018.igem.org/Team:Purdue/Description"," Click here to go to Project Description",para5);  
−
                 divi.appendChild(para4);
+
                 document.getElementById("body").appendChild(divi);
−
                 divi.appendChild(para5);
+
−
                 document.body.append(divi);
+
 
                  
 
                  
 
}
 
}

Latest revision as of 01:32, 18 October 2018

Bootstrap Example

Question 1

Men can also get yeast infections?