live coder refactor fixes #36 and #50

This commit is contained in:
Mark Moser
2016-08-08 17:08:20 -05:00
parent d301547660
commit 5f395dcf41
17 changed files with 117 additions and 165 deletions

View File

@ -7,6 +7,7 @@
name: "answer[checkbox][]",
checked: Array(question.answer).include?(option)
}
answers = answer.try(:answer) || answer
%>
<div class="form-group-multiples">
<%= form.check_box(:answer, checkbox_html, option, '') %>
@ -14,4 +15,4 @@
</div>
<% end %>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: @answer} %>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: answer} %>

View File

@ -1,19 +1,17 @@
<%
option_id = "#{question.question_id}_finish-later"
checkbox_html = {class: 'checkbox',
id: "answer_#{option_id}",
name: "answer[#{question.input_type}][later]",
checked: Array(question.answer).include?('finish-later')
}
disabled = local_assigns.fetch :disable_input, false
answers = answer.try(:answer) || answer
%>
<!-- <div class="js-error">
Please revisit this page with JavaScript enabled to modify your answer.
</div> -->
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: @answer} %>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: answer} %>
<div data-id="live-coder-finish-later">
<div id="nojs<%= question.question_id %>" data-id="live-coder-finish-later">
<p class="warning">
This is a question where you will be asked to write code, and it utilizes a JavaScript-enabled
environment. It looks like JavaScript is not loaded.
@ -30,8 +28,27 @@
<% end %>
</div>
<div data-id="live-coder-answer">
<% # answers inserted dynamically via jQuery .load()
# to check for JS capability/enabled
%>
<div id="answer<%= question.question_id %>" data-id="live-coder-answer" style="display: none;">
<div class="code-input">
<label for="answer_live_code_html">HTML</label>
<%= text_area_tag 'answer[live_code][html]', (answers['html']), { disabled: disabled, 'data-id' => 'code-html', class: 'code-answer code-html' } %>
</div>
<div class="code-input">
<label for="answer_live_code_css">CSS</label>
<%= text_area_tag 'answer[live_code][css]', (answers['css']), { disabled: disabled, 'data-id' => 'code-css', class: 'code-answer code-css' } %>
</div>
<div class="code-input">
<label for="answer_live_code_js">JS</label>
<%= text_area_tag 'answer[live_code][js]', (answers['js']), { disabled: disabled, 'data-id' => 'code-js', class: 'code-answer code-js' } %>
</div>
<div class="results" data-id="results"></div>
</div>
<script>
<% # removes the no-js message SUPER FAST %>
document.getElementById("nojs<%= question.question_id %>").style.display = "none";
document.getElementById("answer<%= question.question_id %>").style.display = "";
</script>

View File

@ -1 +1,57 @@
<%= render partial: "quiz/live_code", locals: {question: question, form: form} %>
<%
option_id = "#{question.question_id}_finish-later"
checkbox_html = {class: 'checkbox',
id: "answer_#{option_id}",
name: "answer[#{question.input_type}][later]",
checked: Array(question.answer).include?('finish-later')
}
disabled = local_assigns.fetch :disable_input, false
answers = answer.try(:answer) || answer
%>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: answer} %>
<div id="nojs<%= question.question_id %>" data-id="live-coder-finish-later">
<p class="warning">
This is a question where you will be asked to write code, and it utilizes a JavaScript-enabled
environment. It looks like JavaScript is not loaded.
<% unless params[:action] == 'summary' %>
Please check the box below to acknowledge that you agree to come back at a later time to finish
answering this question before you can submit the test.
<% else %>
You will need to enable JavaScript and answer this question before you can submit the test.
<% end %>
</p>
<% unless params[:action] == 'summary' %>
<%= form.check_box(:answer, checkbox_html, true, '') %>
<%= form.label(option_id, 'I will come back later to finish this code question') %>
<% end %>
</div>
<div id="answer<%= question.question_id %>" data-id="live-coder-answer" style="display: none;">
<label for="answer_live_code_text">Reasoning</label>
<%= text_area_tag 'answer[live_code_text][text]', (answers['text']) %>
<div class="code-input">
<label for="answer_live_code_html">HTML</label>
<%= text_area_tag 'answer[live_code_text][html]', (answers['html']), { disabled: disabled, 'data-id' => 'code-html', class: 'code-answer code-html' } %>
</div>
<div class="code-input">
<label for="answer_live_code_css">CSS</label>
<%= text_area_tag 'answer[live_code_text][css]', (answers['css']), { disabled: disabled, 'data-id' => 'code-css', class: 'code-answer code-css' } %>
</div>
<div class="code-input">
<label for="answer_live_code_js">JS</label>
<%= text_area_tag 'answer[live_code_text][js]', (answers['js']), { disabled: disabled, 'data-id' => 'code-js', class: 'code-answer code-js' } %>
</div>
<div class="results" data-id="results"></div>
</div>
<script>
<% # removes the no-js message SUPER FAST %>
document.getElementById("nojs<%= question.question_id %>").style.display = "none";
document.getElementById("answer<%= question.question_id %>").style.display = "";
</script>

View File

@ -2,6 +2,7 @@
question.input_options.each do | option |
option_id = "#{option.parameterize}_#{question.to_i}"
radio_html = {class: 'radio', id: option_id}
answers = answer.try(:answer) || answer
%>
<div class="form-group-multiples">
<%= radio_button_tag('answer[radio]', option, (question.answer == option), radio_html) %>
@ -9,4 +10,4 @@
</div>
<% end %>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: @answer} %>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: answer} %>

View File

@ -1,8 +1,11 @@
<% hidden = params[:action] == 'summary' ? 'hidden' : '' %>
<%
hidden = params[:action] == 'summary' ? 'hidden' : ''
answers = answer.try(:answer) || answer
%>
<label for="answer_text">Enter answer here</label>
<textarea id="answer_text" name="answer[text]" rows="10"><%= question.answer %></textarea>
<textarea id="answer_text" name="answer[text]" rows="10"><%= answers %></textarea>
<div class="chars <%= hidden %>">Characters remaining: <span></span></div>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: @answer} %>
<%= render partial: "quiz/answer_errors", locals: {question: question, answer: answer} %>

View File

@ -1,18 +0,0 @@
<% answer = @answer.answer || {} %>
<div class="code-input">
<label for="answer_live_code_html">HTML</label>
<%= text_area_tag 'answer[live_code][html]', (answer['html']), { 'data-id' => 'code-html', class: 'code-answer code-html' } %>
</div>
<div class="code-input">
<label for="answer_live_code_css">CSS</label>
<%= text_area_tag 'answer[live_code][css]', (answer['css']), { 'data-id' => 'code-css', class: 'code-answer code-css' } %>
</div>
<div class="code-input">
<label for="answer_live_code_js">JS</label>
<%= text_area_tag 'answer[live_code][js]', (answer['js']), { 'data-id' => 'code-js', class: 'code-answer code-js' } %>
</div>
<div class="results" data-id="results"></div>

View File

@ -1,21 +0,0 @@
<% answer = @answer.answer || {} %>
<label for="answer_live_code_text">Reasoning</label>
<%= text_area_tag 'answer[live_code_text][text]', (answer['text']) %>
<div class="code-input">
<label for="answer_live_code_html">HTML</label>
<%= text_area_tag 'answer[live_code_text][html]', (answer['html']), { 'data-id' => 'code-html', class: 'code-answer code-html' } %>
</div>
<div class="code-input">
<label for="answer_live_code_css">CSS</label>
<%= text_area_tag 'answer[live_code_text][css]', (answer['css']), { 'data-id' => 'code-css', class: 'code-answer code-css' } %>
</div>
<div class="code-input">
<label for="answer_live_code_js">JS</label>
<%= text_area_tag 'answer[live_code_text][js]', (answer['js']), { 'data-id' => 'code-js', class: 'code-answer code-js' } %>
</div>
<div class="results" data-id="results"></div>

View File

@ -16,7 +16,7 @@
<div class="content-well">
<%= hidden_field_tag 'answer[question_id]', @question.question_id %>
<%= hidden_field_tag 'answer[answer_id]', @question.answer_id %>
<%= render partial: @question.input_type, locals: {question: @question, form: form} %>
<%= render partial: @question.input_type, locals: {question: @question, form: form, answer: @answer } %>
</div>
<% if @status.on_summary %>

View File

@ -34,7 +34,8 @@
<fieldset disabled class="answer-block">
<%= hidden_field_tag 'answer[question_id]', question.question_id %>
<%= render partial: question.input_type, locals: {question: question, form: form} %>
<%= hidden_field_tag 'answer[answer_id]', question.answer_id %>
<%= render partial: question.input_type, locals: {question: question, form: form, answer: question.answer, disable_input: true} %>
</fieldset>
</div>
</article>

View File

@ -21,7 +21,7 @@
<% end %>
<fieldset disabled class="answer-block">
<%= hidden_field_tag 'answer[question_id]', question.question_id %>
<%= render partial: "quiz/#{question.input_type}", locals: {question: question, form: form} %>
<%= render partial: "quiz/#{question.input_type}", locals: {question: question, answer: question.answer, form: form} %>
</fieldset>
</div>
</article>