added Jaun, and tidied up the live coder view

Guardfile

@@ -42,6 +42,8 @@ guard :rubocop do
   watch(%r{(?:.+/)?\.rubocop\.yml$}) { |m| File.dirname(m[0]) }
 end
 
+# This breaks in the container.
+# instead, try using: https://github.com/appfolio/eslint-rails
 # # ESLint
 # guard :shell, all_on_start: true do
 #   watch %r{app/assets/javascripts/*/.*} do |file|

app/views/quiz/_live_code.html.erb

@@ -31,28 +31,32 @@
 
 <div id="answer<%= question.question_id %>" data-id="live-coder-answer" style="display: none;">
   <label for="answer_live_code">Enter answer here</label>
-  <%= text_area_tag 'answer[live_code][text]', (answers['text']), {data: {last: answers['text']}} %>
+  <%= text_area_tag 'answer[live_code][text]', (answers['text']), { disabled: true, data: {last: answers['text']}} %>
 
   <div class="code-input">
     <label for="answer_live_code_html">HTML</label>
-    <%= text_area_tag 'answer[live_code][html]', (answers['html']), { data: {id: 'code-html', last: answers['html']}, class: 'code-answer code-html' } %>
+    <%= text_area_tag 'answer[live_code][html]', (answers['html']), { disabled: true, data: {id: 'code-html', last: answers['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']), { data: {id: 'code-css', last: answers['css']}, class: 'code-answer code-css' } %>
+    <%= text_area_tag 'answer[live_code][css]', (answers['css']), { disabled: true, data: {id: 'code-css', last: answers['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']), { data: {id: 'code-js', last: answers['js']}, class: 'code-answer code-js' } %>
+    <%= text_area_tag 'answer[live_code][js]', (answers['js']), { disabled: true, data: {id: 'code-js', last: answers['js']}, class: 'code-answer code-js' } %>
   </div>
 
   <div class="results" data-id="results"></div>
 </div>
 
 <script>
-  <% # removes the no-js message SUPER FAST %>
+  <% # removes the no-js message %>
   document.getElementById("nojs<%= question.question_id %>").style.display = "none";
   document.getElementById("answer<%= question.question_id %>").style.display = "";
+
+  <% # we want the coders disabled until JS is confirmed, so form post is easier to validate %>
+  var coders = document.querySelectorAll("[data-id=live-coder-answer] textarea");
+  coders.forEach(function(textarea){ textarea.disabled = false; });
 </script>

test/fixtures/answers.yml

@@ -288,3 +288,93 @@ richard10:
   submitted: true
   created_at: <%= DateTime.now() - 36.hours - 40.minutes %>
   updated_at: <%= DateTime.now() - 36.hours - 20.minutes %>
+
+juan1:
+  candidate: juan
+  question: fed1
+  answer: Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+
+juan2:
+  candidate: juan
+  question: fed2
+  answer: ["indexOf()"]
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+
+juan3:
+  candidate: juan
+  question: fed3
+  answer: {later: "true"}
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+
+juan4:
+  candidate: juan
+  question: fed4
+  answer: Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis.
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+
+juan5:
+  candidate: juan
+  question: fed5
+  answer: 'Dynamic listeners'
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 50.minutes %>
+
+juan6:
+  candidate: juan
+  question: fed6
+  answer: Integer posuere erat a ante venenatis dapibus posuere velit aliquet.
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 32.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 12.minutes %>
+
+juan7:
+  candidate: juan
+  question: fed7
+  answer: {later: "true"}
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 34.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 14.minutes %>
+
+juan8:
+  candidate: juan
+  question: fed8
+  answer: option2
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 38.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 16.minutes %>
+
+juan9:
+  candidate: juan
+  question: fed9
+  answer: Grunt
+  saved: 0
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 38.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 18.minutes %>
+
+juan10:
+  candidate: juan
+  question: fed10
+  answer:
+  saved: 1
+  submitted: true
+  created_at: <%= DateTime.now() - 38.hours - 40.minutes %>
+  updated_at: <%= DateTime.now() - 38.hours - 20.minutes %>

test/fixtures/candidates.yml

@@ -1,6 +1,6 @@
 # Read about fixtures at http://api.rubyonrails.org/classes/ActiveRecord/FixtureSet.html
 
-roy:
+roy: # Roy should have started, and is ready for a reminder
   name: Roy Cruz
   email: roy.cruz@mailinator.com
   experience: 0-3
@@ -10,7 +10,7 @@ roy:
   reminded: false
   test_hash: NmEjDkOEKY4
 
-gillian:
+gillian: # Gillian has not begun the test
   name: Gillian Anderson
   email: gillian.anderson@mailinator.com
   experience: 4-6
@@ -20,7 +20,7 @@ gillian:
   reminded: false
   test_hash: fbBOCmkhVC0
 
-martha:
+martha: # Martha has not begun the test
   name: Martha Watts
   email: martha.watts@mailinator.com
   experience: 4-6
@@ -30,7 +30,7 @@ martha:
   reminded: false
   test_hash: R67PmfDHGiw
 
-dawn:
+dawn: # Dawn has completed, and been reminded, but not submitted the test
   name: Dawn Hopkins
   email: dawn.hopkins@mailinator.com
   experience: 0-2
@@ -40,7 +40,7 @@ dawn:
   reminded: true
   test_hash: OvP0ZqGKwJ0
 
-peggy:
+peggy: # Peggy has completed, and been reminded, but not submitted the test
   name: Peggy Blisters
   email: peggy.blisters@mailinator.com
   experience: 0-2
@@ -50,7 +50,7 @@ peggy:
   reminded: true
   test_hash: 242a9d5d085
 
-richard:
+richard: # Richard has completed AND submitted the test
   name: Richard Burns
   email: richard.burns@mailinator.com
   experience: 15+
@@ -59,3 +59,13 @@ richard:
   completed: true
   reminded: false
   test_hash: 6NjnourLE6Y
+
+juan: # Juan has chosen "finish later" for live coders
+  name: Juan Campbell
+  email: juan.campbell@mailinator.com
+  experience: 15+
+  recruiter: recruiter
+  quiz: fed
+  completed: false
+  reminded: true
+  test_hash: qKQo0l4dyol

test/fixtures/questions.yml

@@ -14,7 +14,10 @@ fed2:
   question: What function can be used to determine if a value is present in a given array?
   category: JavaScript
   input_type: checkbox
-  input_options: [ 'indexOf()', 'present()', 'inArray()' ]
+  input_options:
+    - 'indexOf()'
+    - 'present()'
+    - 'inArray()'
   sort: 1
   active: true
 
@@ -41,7 +44,11 @@ fed5:
   question: What is the best way to track user interaction within a group of dynamically generated child elements?
   category: JavaScript
   input_type: radio
-  input_options: [ 'Dynamic listeners', 'Event delegation', 'Callback functions', 'HTML data attributes' ]
+  input_options:
+    - 'Dynamic listeners'
+    - 'Event delegation'
+    - 'Callback functions'
+    - 'HTML data attributes'
   sort: 4
   active: true
 
@@ -69,7 +76,11 @@ fed8:
   question: Select the HTML from below that would create an input field which restricts the number of characters inside it to 10.
   category: HTML
   input_type: radio
-  input_options: [ option-1, option2, "option 3", option-4]
+  input_options:
+    - option-1
+    - option2
+    - "option 3"
+    - option-4
   sort: 7
   active: true
 
@@ -78,7 +89,11 @@ fed9:
   question: Grunt or Gulp?
   category: Javascript
   input_type: radio
-  input_options: [Grunt, Gulp, Neither, Either]
+  input_options:
+    - Grunt
+    - Gulp
+    - Neither
+    - Either
   sort: 8
   active: true
 
@@ -87,6 +102,11 @@ fed10:
   question: StarWars or Star Trek?
   category: Performance
   input_type: checkbox
-  input_options: ["Live long and prosper", "Who ya gonna call?", "Who you calling Scruffy?", "J.J. Abrams"]
+  input_options:
+    - "Live long and prosper"
+    - "Who ya gonna call?"
+    - "Who you calling Scruffy?"
+    - "J.J. Abrams"
+    - "wibbly wobbly, timey wimey"
   sort: 9
   active: true

test/validators/answer_format_validator_test.rb

@@ -149,7 +149,7 @@ class AnswerFormatValidatorTest < ActiveSupport::TestCase
 
   test "live_code should FAIL without values" do
     obj = AnswerValidatable.new('live_code')
-    obj.answer = { later: "", html: "", css: "", js: "", text: "" }
+    obj.answer = { text: "", html: "", css: "", js: "" }
 
     refute obj.valid?
     assert_match(/write.*code/, obj.errors.messages[:answer][0])
@@ -157,7 +157,7 @@ class AnswerFormatValidatorTest < ActiveSupport::TestCase
 
   test "live_code should PASS with text only" do
     obj = AnswerValidatable.new('live_code')
-    obj.answer = { later: "", html: "", css: "", js: "", text: "reasons" }
+    obj.answer = { html: "", css: "", js: "", text: "reasons" }
 
     assert obj.valid?
     assert obj.errors.messages.empty?