From 6dfad66e789ce1c937f1efec6982a8850bb6a648 Mon Sep 17 00:00:00 2001
From: PlushZ <55543056+PlushZ@users.noreply.github.com>
Date: Thu, 9 Dec 2021 21:20:50 +0100
Subject: [PATCH] Quiz for level1

---
 _data/quizzes/questions.yml      | 220 +++++++++++++++++++++++++++++++
 _includes/quiz.html              |  19 +++
 _includes/quiz/mc-questions.html |  91 +++++++++++++
 index.md                         |   4 +-
 4 files changed, 333 insertions(+), 1 deletion(-)
 create mode 100644 _data/quizzes/questions.yml
 create mode 100644 _includes/quiz.html
 create mode 100644 _includes/quiz/mc-questions.html

diff --git a/_data/quizzes/questions.yml b/_data/quizzes/questions.yml
new file mode 100644
index 00000000..8f1d83f5
--- /dev/null
+++ b/_data/quizzes/questions.yml
@@ -0,0 +1,220 @@
+title: Introduction of biology
+randomized: false
+questions:
+
+ - type: "multiple-choice"
+   question: 
+      text: "What is the proper definition of evolution?"
+      image: 
+   items:
+    - choice: changes in a population of organisms over a period of time
+      correct: true
+    - choice: changes in individual organisms during their lifetime
+      correct: false
+    - choice: organisms coming into existence at a defined moment in time and not changing
+      correct: false
+   hint: |
+      Even though evolution is taking place all around us, for many species the process operates so slowly that it is not observable except over thousands or hundreds of thousands of years, much too long to witness in a human lifetime.
+   followup: 
+      text: "Evolution is a change in a population of organisms through time leading to the appearance of new forms."
+      image:
+   points:
+      without_hint: 4
+      with_hint: 3
+
+ - type: "multiple-choice"
+   question: 
+      text: "What is the biological reason for survival benefits (like beaks belonging to birds, lizards' ability to change a color)?"
+   items:
+    - choice: mutation
+      correct: true
+    - choice: genetic disease
+      correct: false
+    - choice: environmental changes
+      correct: false
+   hint: |
+      Change in an organism's environment forces the organism to adapt to fit the new environment, eventually causing it to evolve into a new species. But it might be just one of conditions for evolution, not the biological reason. 
+   followup: 
+      text: "Mutations occur throughout the natural world. Some mutations are beneficial and increase the possibility that an organism will thrive and pass on its genes to the next generation. When mutations improve survival or reproduction, the process of natural selection will cause the mutation to become more common over time."
+      image:
+   points:
+      without_hint: 2
+      with_hint: 1
+      
+ - type: "multiple-choice"
+   question: 
+      text: "This salamander did not use its eyes so it lost its vision. Who said if you don't use it you lose it?"
+      image: "https://whyevolutionistrue.com/wp-content/uploads/2016/09/tx-blind-salamander-picture-1.jpg"
+   items:
+    - choice: Malthus
+      correct: false
+    - choice: Darwin
+      correct: false
+    - choice: Lamarck
+      correct: true
+   hint: |
+      Lamarck thought that organisms changed out of need and after a change in the environment.On the other hand, Darwin thought organisms changed by chance when they were born and before there was a change in the environment.
+   followup: 
+      text: "The Lamarck's idea about organisms gaining some abilities if they need them and losing others if they don't need them is applicable here."
+      image:
+   points:
+      without_hint: 2
+      with_hint: 1
+      
+ - type: "multiple-choice"
+   question: 
+      text: "How did Lamarck's theory of evolution differ from Darwin's?"
+   items:
+    - choice: Lamarck believed that Earth was old enough to provide a sufficient time scale for the process of evolution.
+      correct: false
+    - choice: Lamarck believed that characteristics acquired during an organism’s lifetime could be passed on to the next generation.
+      correct: true
+    - choice: Lamarck believed that the environment played a significant role.
+      correct: false
+   hint: |
+      Darwin thought, that environment performs the cruel but immensely important task of selecting the fittest organisms. 
+   followup: 
+      text: "For Lamarck, the environment governs adaptive change by inheritance of acquired traits, while in Darwin thought, it performs the cruel but immensely important task of selecting the fittest organisms."
+      image:
+   points:
+      without_hint: 3
+      with_hint: 2
+      
+ - type: "multiple-choice"
+   question: 
+      text: "What is survival of the fittest?"
+   items:
+    - choice: It is where the fittest die out and therefore reproduce and pass on their genes
+      correct: false
+    - choice: It is where the fittest die out and therefore can't reproduce and pass on their genes
+      correct: false
+    - choice: It is where the fittest don't die out and therefore can't reproduce and pass on their genes
+      correct: false
+    - choice: It is where the fittest don't die out and therefore reproduce and pass on their genes
+      correct: true 
+   hint: |
+      No hint yet       
+   followup: 
+      text: "Correct!"
+      image:
+   points:
+      without_hint: 4
+      with_hint: 3
+      
+ - type: "multiple-choice"
+   question: 
+      text: "Lamarck’s ideas about evolution include the concept that differences among the traits of organisms arise as a result of"
+   items:
+    - choice: continual increases in population size.
+      correct: false
+    - choice: the actions of organisms as they use or fail to use body structures.
+      correct: true
+    - choice: an unchanging local environment.
+      correct: false
+    - choice: the natural variations already present within the population of organisms.
+      correct: false
+   hint: |
+      Lamarck thought that organisms changed out of need and after a change in the environment. 
+   followup: 
+      text: "The Lamarck's idea about organisms gaining some abilities if they need them and losing others if they don't need them is applicable here."
+      image:
+   points:
+      without_hint: 3
+      with_hint: 2
+      
+ - type: "multiple-choice"
+   question: 
+      text: "Archaea or Bacteria domains contains"
+   items:
+    - choice: prokaryotic organisms
+      correct: true
+    - choice: eukaryotic
+      correct: false
+    - choice: both
+      correct: false
+   hint: |
+      There are 3 domains existing: Archaea, Bacteria, and Eukarya 
+   followup: 
+      text: "Prokaryotic organisms belong either to the domain Archaea or the domain Bacteria; organisms with eukaryotic cells belong to the domain Eukarya."
+      image:
+   points:
+      without_hint: 2
+      with_hint: 1
+      
+ - type: "multiple-choice"
+   question: 
+      text: "Size of prokaryotic cell"
+   items:
+    - choice: from 0.1 to 5 nanometres
+      correct: false
+    - choice: from 0.1 to 5 micrometres
+      correct: true
+    - choice: from 10 to 100 micrometres
+      correct: false
+   hint: |
+      eukaryotic cell size is from 10 to 100 micrometres 
+   followup: 
+      text: "Prokaryotic cell size is smaller - from 0.1 to 5 micrometres."
+      image:
+   points:
+      without_hint: 2
+      with_hint: 1
+      
+ - type: "multiple-choice"
+   question: 
+      text: "Sort these things in order from smallest to largest - atom, DNA, protein, flu virus, leaf cell, frog egg, monkey"
+   items:    
+    - choice: DNA, atom, protein, flu virus, leaf cell, frog egg, monkey
+      correct: false
+    - choice: protein, flu virus, atom, DNA, leaf cell, frog egg, monkey
+      correct: false
+    - choice: atom, DNA, protein, flu virus, leaf cell, frog egg, monkey
+      correct: true
+    - choice: atom, DNA, protein, flu virus, frog egg, leaf cell, monkey
+      correct: false
+   hint: |
+      DNA is a chemical, and, these are made of molecules which are made of atoms. 
+   followup: 
+      text: "Look at the picture!"
+      image: /images/micriscope-sizes.png
+   points:
+      without_hint: 3
+      with_hint: 2
+   
+ - type: "multiple-choice"
+   question: 
+      text: "What type of microscope Sam has to use to see chicken egg?"
+   items:
+    - choice: light
+      correct: false
+    - choice: electronic
+      correct: false
+    - choice: naked eye
+      correct: true
+   hint: |
+      I don't think some people would have chicken eggs for breakfast if they are so small. 
+   followup: 
+      text: "Look at the picture!"
+      image: /images/micriscope-sizes.png
+   points:
+      without_hint: 2
+      with_hint: 1
+   
+ - type: "multiple-choice"
+   question: 
+      text: "What type of microscope Sam has to use to see atom?"
+   items:
+    - choice: light
+      correct: false
+    - choice: electronic
+      correct: true
+    - choice: naked eye
+      correct: false
+   hint: |
+      Atoms are the smallest building blocks of matter 
+   followup: 
+      text: "Look at the picture!"
+      image: /images/micriscope-sizes.png
+   points:
+      without_hint: 2
+      with_hint: 1
\ No newline at end of file
diff --git a/_includes/quiz.html b/_includes/quiz.html
new file mode 100644
index 00000000..7ec352cb
--- /dev/null
+++ b/_includes/quiz.html
@@ -0,0 +1,19 @@
+# Let's start the Quiz!
+
+<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
+<div>
+{% assign quiz = site.data.quizzes[include.file] %}
+{% assign questions = quiz.questions %}
+<h3>
+{% if quiz.title %}
+	{{ quiz.title }}
+{% endif %}
+</h3>
+</div>
+<div>
+{% for item in questions %}
+	{% if item.type == "multiple-choice" %}
+		{% include quiz/mc-questions.html item=item count=forloop.index text = item.question.text image = item.image %}
+	{% endif %}
+{% endfor %}
+</div>
\ No newline at end of file
diff --git a/_includes/quiz/mc-questions.html b/_includes/quiz/mc-questions.html
new file mode 100644
index 00000000..ae3348cc
--- /dev/null
+++ b/_includes/quiz/mc-questions.html
@@ -0,0 +1,91 @@
+<div class="mcq panel panel-primary">
+    <div class="panel-heading">
+      {% if include.header %} {{ include.header }} {% else %}Question {{ include.count }} {% endif %}
+    </div>
+    <div class="panel-body">
+      <div class="qtext">{{ include.text | markdownify}}
+      {% if include.image %} <br><img src="{{ include.image }}" width="200" height="150"> {% endif %}
+      </div>
+    </div>
+    <table class="choices table" style="border-bottom:1px solid #ddd">
+      <tbody>
+        {% for choice in include.item.items %}
+        
+          {% if choice.correct == true %}
+              {% assign answer-index = forloop.index0 %}
+          {% endif %}
+        
+          <tr class="choice">
+          <td class="choice-radio col-xs-1">
+            <input type="radio" name="radio-choices">
+          </td>
+          <td class="choice-text">{{ choice.choice | markdownify }}</td>
+          <td class="choice-feedback"><span class="hidden text-muted">
+          {% if choice.correct == true %}
+              {{ include.item.followup.text | markdownify }}{% if include.item.followup.image %} <br><img src="{{ include.item.followup.image }}" width="200" height="200"> {% endif %}
+          {% else %} 
+              Try again!
+          {% endif %}
+          </span></td>
+          </tr>
+          
+          
+        {% endfor %}
+      </tbody>
+    </table>
+    <div class="feedback text-center">
+      <span class="success-msg lead text-success hidden">You have successfully completed this question!</span>
+    </div>
+    <div class="text-center" style="padding: 5px;">
+      <button class="check btn btn-primary" onClick="(function (btn){
+                        answerIndex = {{answer-index}};
+                        feedback = btn.parentNode.previousElementSibling
+                        feedbackMsg = feedback.firstElementChild;
+                        choices = feedback.previousElementSibling.firstElementChild.children;
+                        pBody = feedback.previousElementSibling.previousElementSibling;
+                        panel = pBody.parentNode;
+                        for (i=0; i<choices.length; i++){
+                          radio = choices[i].firstElementChild.firstElementChild;
+                          radio.setAttribute('disabled', true);
+                          if (radio.checked) {
+                            msg = choices[i].lastElementChild.firstElementChild;
+                            msg.classList.remove('hidden');
+                            panel.classList.remove('paenl-primary');
+                            if (i === answerIndex) {
+                              panel.classList.add('panel-success');
+                              feedbackMsg.classList.remove('hidden');
+                            } else {
+                              panel.classList.add('panel-danger');
+                            }
+                          }
+                        }
+                        btn.classList.add('disabled');
+                        //btn.setAttribute('disabled', true);
+                     }(this))">
+        Check Answer
+      </button>
+      <button class="reset btn btn-default" onClick="(function (btn){
+                        feedback = btn.parentNode.previousElementSibling
+                        feedbackMsg = feedback.firstElementChild;
+                        feedbackMsg.classList.add('hidden');
+                        choices = feedback.previousElementSibling.firstElementChild.children;
+                        pBody = feedback.previousElementSibling.previousElementSibling;
+                        panel = pBody.parentNode;
+                        panel.classList.remove('panel-success');
+                        panel.classList.remove('panel-danger');
+                        panel.classList.add('panel-primary');
+                        for (i=0; i<choices.length; i++){
+                          radio = choices[i].firstElementChild.firstElementChild;
+                          radio.checked = false;
+                          radio.removeAttribute('disabled');
+                          msg = choices[i].lastElementChild.firstElementChild;
+                          msg.classList.add('hidden');
+                          text = feedback.previousElementSibling;
+                          text.classList.remove('text-success');
+                          text.classList.remove('text-danger');
+                        }
+                        btn.previousElementSibling.classList.remove('disabled');
+                        //btn.previousElementSibling.removeAttribute('disabled');
+                     }(this))">Try Again</button>
+    </div>
+  </div>
\ No newline at end of file
diff --git a/index.md b/index.md
index 62b0d3c4..9813b60a 100644
--- a/index.md
+++ b/index.md
@@ -10,4 +10,6 @@ photos:
 
 # Let's start the Game!
 
-[Level 1: Introduction]({{ site.baseurl }}{% link stories/alien/level1/slides.html %})
\ No newline at end of file
+[Level 1: Introduction]({{ site.baseurl }}{% link stories/alien/level1/slides.html %})
+
+{% include quiz.html file='questions' %}
\ No newline at end of file