Fix prompt UI in combined open ended to close by default and be collapsible

common/lib/xmodule/xmodule/js/src/combinedopenended/display.coffee

@@ -55,6 +55,9 @@ class @CombinedOpenEnded
     @show_results_button=@$('.show-results-button')
     @show_results_button.click @show_results
 
+    @question_header = @$('.question-header')
+    @question_header.click @collapse_question
+
     # valid states: 'initial', 'assessing', 'post_assessment', 'done'
     Collapsible.setCollapsibles(@el)
     @submit_evaluation_button = $('.submit-evaluation-button')
@@ -66,7 +69,7 @@ class @CombinedOpenEnded
     @el = $(element).find('section.open-ended-child')
     @errors_area = @$('.error')
     @answer_area = @$('textarea.answer')
-
+    @prompt_container = @$('.prompt')
     @rubric_wrapper = @$('.rubric-wrapper')
     @hint_wrapper = @$('.hint-wrapper')
     @message_wrapper = @$('.message-wrapper')
@@ -81,6 +84,11 @@ class @CombinedOpenEnded
     @can_upload_files = false
     @open_ended_child= @$('.open-ended-child')
 
+    if @task_number>1
+      @prompt_hide()
+    else if @task_number==1 and @child_state!='initial'
+      @prompt_hide()
+
     @find_assessment_elements()
     @find_hint_elements()
 
@@ -155,6 +163,8 @@ class @CombinedOpenEnded
     @next_problem_button.hide()
     @hide_file_upload()
     @hint_area.attr('disabled', false)
+    if @task_number==1 and @child_state=='assessing'
+      @prompt_hide()
     if @child_state == 'done'
       @rubric_wrapper.hide()
     if @child_type=="openended"
@@ -389,3 +399,26 @@ class @CombinedOpenEnded
   # wrap this so that it can be mocked
   reload: ->
     location.reload()
+
+  collapse_question: () =>
+    @prompt_container.slideToggle()
+    @prompt_container.toggleClass('open')
+    if @question_header.text() == "(Hide)"
+      new_text = "(Show)"
+    else
+      new_text = "(Hide)"
+    @question_header.text(new_text)
+
+  prompt_show: () =>
+    if @prompt_container.is(":hidden")==true
+      @prompt_container.slideToggle()
+      @prompt_container.toggleClass('open')
+      @question_header.text("(Hide)")
+
+  prompt_hide: () =>
+    if @prompt_container.is(":visible")==true
+      @prompt_container.slideToggle()
+      @prompt_container.toggleClass('open')
+      @question_header.text("(Show)")
+
+

common/lib/xmodule/xmodule/js/src/peergrading/peer_grading_problem.coffee

@@ -413,7 +413,7 @@ class @PeerGradingProblem
     if score == actual_score
       calibration_wrapper.append("<p>Congratulations! Your score matches the actual score!</p>")
     else
-      calibration_wrapper.append("<p>Please try to understand the grading critera better to be more accurate next time.</p>")
+      calibration_wrapper.append("<p>Please try to understand the grading criteria better to be more accurate next time.</p>")
 
     # disable score selection and submission from the grading interface
     $("input[name='score-selection']").attr('disabled', true)

lms/templates/combined_open_ended.html

@@ -6,14 +6,13 @@
     </div>
 
     <div class="item-container">
-        <h4>Problem</h4>
+        <h4>Prompt <a href="#" class="question-header">(Hide)</a> </h4>
         <div class="problem-container">
         % for item in items:
-        <div class="item">${item['content'] | n}</div>
+            <div class="item">${item['content'] | n}</div>
         % endfor
         </div>
 
-
         <input type="button" value="Reset" class="reset-button" name="reset"/>
         <input type="button" value="Next Step" class="next-step-button" name="reset"/>
     </div>