make answer results global

This commit is contained in:
ajuvercr 2020-03-11 01:44:54 +01:00
parent 47406d1610
commit 413944e396
2 changed files with 42 additions and 29 deletions

View file

@ -1,5 +1,5 @@
<h2> <%= question[:vraag] %> </h2> <h2> <%= question[:vraag] %> </h2>
<select id="<%= question[:vraag] %>"> <select id="<%= (question[:tekst] || "") + (question[:vraag] || "") %>_option">
<option value="" selected="selected disabled hidden">Maak uw keuze</option> <option value="" selected="selected disabled hidden">Maak uw keuze</option>
<% for answer in question[:antwoorden]%> <% for answer in question[:antwoorden]%>
<option value='<%= answer[:tekst] + (answer[:vraag] || "") %>'> <option value='<%= answer[:tekst] + (answer[:vraag] || "") %>'>
@ -9,68 +9,61 @@
</select> </select>
<% for answer in question[:antwoorden]%> <% for answer in question[:antwoorden]%>
<% if answer[:vraag] %> <% if answer[:vraag] %>
<%# Should store all sub-questions with a reference to their parent question in the data-parent <div id='<%= answer[:tekst] + answer[:vraag] %>' style="display:none;">
attribute, however, these atrtibutes remain empty. %>
<div id='<%= answer[:tekst] + answer[:vraag] %>' style="display:none;" data-parent="<% question[:vraag] %>">
<%= render '/partials/question.*', question: answer %> <%= render '/partials/question.*', question: answer %>
</div> </div>
<% end %> <% end %>
<% end %> <% end %>
<script> <script>
(function() { {
// Reference back to the last selected option
// This way we can 'deselect' the question results
let last_answered = null; let last_answered = null;
// Create list of all subquestions // Create list of all subquestions
const sub_questions = {}; const sub_questions = {};
const question_answers = {}; // Create list of all student organisations this answer entails
const question_results = {};
<% for answer in question[:antwoorden] %> <% for answer in question[:antwoorden] %>
<% if answer[:vraag] %> <% if answer[:vraag] %>
sub_questions['<%= answer[:tekst] + answer[:vraag] %>'] = document.getElementById('<%= answer[:tekst] + answer[:vraag] %>'); sub_questions['<%= answer[:tekst] + answer[:vraag] %>'] = document.getElementById('<%= answer[:tekst] + answer[:vraag] %>');
<% end %> <% end %>
question_answers['<%= answer[:tekst] + (answer[:vraag] || "") %>'] = []; question_results['<%= answer[:tekst] + (answer[:vraag] || "") %>'] = [];
<% if answer[:verenigingen] %> <% if answer[:verenigingen] %>
<% for vereniging in answer[:verenigingen] %> <% for vereniging in answer[:verenigingen] %>
question_answers['<%= answer[:tekst] + (answer[:vraag] || "") %>'].push( question_results['<%= answer[:tekst] + (answer[:vraag] || "") %>'].push(
'<%= vereniging[:naam] %>' '<%= vereniging[:naam] %>'
); );
<% end %> <% end %>
<% end %> <% end %>
<% end %> <% end %>
console.log('<%= (question[:vraag] || "") + (question[:tekst] || "") %>'); document.getElementById("<%= (question[:tekst] || "") + (question[:vraag] || "") %>_option").addEventListener('change', (event) => {
console.log(question_answers);
document.getElementById("<%= question[:vraag] %>").addEventListener('change', (event) => {
if (last_answered && sub_questions[last_answered]) { if (last_answered && sub_questions[last_answered]) {
sub_questions[last_answered].style.display = "none"; sub_questions[last_answered].style.display = "none";
}
for (let ver of question_answers[event.target.value] || []) { // sub is the select dom element, that listens for changes
console.log(ver); // When a parent is changed, it should notify it's last_answered child that it is changed
if (answer_values[ver]) { const sub = document.getElementById(last_answered+"_option");
answer_values[ver] += 1; if (sub) {
} else { sub.value = null;
answer_values[ver] = 1; sub.dispatchEvent(new event.constructor(event.type, event));
} }
} }
for (let ver of question_answers[last_answered] || []) { // Update results
answer_values[ver] -= 1; save_answers(question_results[event.target.value] || []);
} del_answers(question_results[last_answered] || []);
console.log(answer_values);
// Make possible sub question visible
const quest = sub_questions[event.target.value]; const quest = sub_questions[event.target.value];
last_answered = event.target.value; last_answered = event.target.value;
if (quest) { if (quest) {
delete quest.style.removeProperty("display"); delete quest.style.removeProperty("display");
} }
}); });
}
})();
</script> </script>

View file

@ -1,6 +1,26 @@
<script> <script>
const answer_values = {}; const _save_answers = {};
function save_answers(vers) {
for (let ver of vers) {
if (_save_answers[ver]) {
_save_answers[ver] += 1;
} else {
_save_answers[ver] = 1;
}
}
console.log(_save_answers);
}
function del_answers(vers) {
for (let ver of vers) {
_save_answers[ver] -= 1;
}
console.log(_save_answers);
}
</script> </script>
<% @items.find_all("/quiz/*").each_with_index do |quest, i| %> <% @items.find_all("/quiz/*").each_with_index do |quest, i| %>