Address final UX issues

openassessment/templates/openassessmentblock/peer/oa_peer_complete.html

@@ -33,7 +33,7 @@
 
                 <ul class="list list--actions">
                     <li class="list--actions__item">
-                        <button type="submit" id="peer-assessment__continue__grading" class="action action--continue--grading">
+                        <button type="submit" class="action action--submit action--continue--grading">
                             <span class="copy">{%  trans "Continue Assessing Peers" %}</span>
                         </button>
                     </li>

openassessment/templates/openassessmentblock/response/oa_response.html

@@ -109,22 +109,22 @@
                                 </div>
                             </li>
                             {% if allow_latex %}
-                            <li class="list--actions__item">
-                                <button type="submit" id="submission__preview" class="action action--save submission__save is--disabled">{% trans "Preview in Latex"%}</button>
-                                <div id="response__preview_explanation" class="response__submission__status">
-                                    <h3 class="response__submission__status__title">
-                                        {% trans "Click to preview your submission in Latex"%}
-                                    </h3>
-                                </div>
-                            </li>
-                            <li id = "submission__preview__item" class="list--actions__item">
-                                <article class="submission__answer__display">
-                                    <h3 class="submission__answer__display__title">Preview Response</h3>
-                                    <div class="submission__answer__display__content">
-                                        <p id="preview_content"></p>
+                                <li class="list--actions__item">
+                                    <button type="submit" id="submission__preview" class="action action--save submission__save is--disabled">{% trans "Preview in LaTeX"%}</button>
+                                    <div id="response__preview_explanation" class="response__submission__status">
+                                        <h3 class="response__submission__status__title">
+                                            {% trans "Click to preview your submission in LaTeX"%}
+                                        </h3>
                                     </div>
-                                </article>
-                            </li>
+                                </li>
+                                <li id = "submission__preview__item" class="list--actions__item">
+                                    <article class="submission__answer__display">
+                                        <h3 class="submission__answer__display__title">{% trans "Preview Response"%}</h3>
+                                        <div class="submission__answer__display__content">
+                                            <p id="preview_content"></p>
+                                        </div>
+                                    </article>
+                                </li>
                             {% endif %}
                         </ul>
                     </div>

openassessment/templates/openassessmentblock/staff_area/oa_staff_area.html

@@ -26,12 +26,8 @@
                             <label class="label">{% trans "Enter an individual learner's username or email" %}
                                 <input type="text" class="openassessment__student_username value" maxlength="255">
                             </label>
-                            <ul class="list list--actions">
-                                <li class="list--actions__item">
-                                    <button class="action--submit action--submit-username"><span class="copy">{% trans "Submit" %}</span></button>
-                                    <div class="student-form-error"></div>
-                                </li>
-                            </ul>
+                            <button class="action--submit action--submit-username"><span class="copy">{% trans "Submit" %}</span></button>
+                            <div class="student-form-error"></div>
                         </form>
                     </div>
                     <div class="openassessment__student-info staff-info__student__report"></div>

openassessment/xblock/static/js/spec/lms/oa_peer.js

@@ -12,6 +12,14 @@ describe("OpenAssessment.PeerView", function() {
             }
         ).promise();
 
+        this.mockLoadTemplate = function(template) {
+            var server = this;
+            return $.Deferred(function(defer) {
+                var fragment = readFixtures(template);
+                defer.resolveWith(server, [fragment]);
+            });
+        };
+
         this.peerAssess = function() {
             return successPromise;
         };
@@ -21,7 +29,7 @@ describe("OpenAssessment.PeerView", function() {
         };
 
         this.renderContinuedPeer = function() {
-            return successPromise;
+            return this.mockLoadTemplate('oa_peer_assessment.html');
         };
     };
 
@@ -32,9 +40,9 @@ describe("OpenAssessment.PeerView", function() {
     var createPeerAssessmentView = function(template) {
         loadFixtures(template);
 
-        var assessmentElement = $('#openassessment__peer-assessment').get(0);
-        var baseView = new OpenAssessment.BaseView(runtime, assessmentElement, server, {});
-        var view = new OpenAssessment.PeerView(assessmentElement, server, baseView);
+        var rootElement = $('#openassessment__peer-assessment').parent().get(0);
+        var baseView = new OpenAssessment.BaseView(runtime, rootElement, server, {});
+        var view = new OpenAssessment.PeerView(rootElement, server, baseView);
         view.installHandlers();
         return view;
     };
@@ -115,18 +123,13 @@ describe("OpenAssessment.PeerView", function() {
         expect(view.continueAssessmentEnabled()).toBe(true);
     });
 
-    it("can submit assessments in turbo mode", function() {
-        var view = createPeerAssessmentView('oa_turbo_mode.html');
-        submitPeerAssessment(view);
-    });
-
     it("warns of unsubmitted assessments", function() {
         var view = createPeerAssessmentView('oa_peer_assessment.html');
 
         expect(view.baseView.unsavedWarningEnabled()).toBe(false);
 
         // Click on radio buttons, to create unsubmitted changes.
-        $('.question__answers', view.el).each(function() {
+        $('.question__answers', view.element).each(function() {
             $('input[type="radio"]', this).first().click();
         });
 
@@ -149,4 +152,19 @@ describe("OpenAssessment.PeerView", function() {
 
         expect(view.baseView.unsavedWarningEnabled()).toBe(false);
     });
+
+    describe("Turbo Mode", function() {
+        it("can submit assessments in turbo mode", function() {
+            var view = createPeerAssessmentView('oa_turbo_mode.html');
+            submitPeerAssessment(view);
+        });
+
+        it("can continue assessing upon completion of required assessments", function() {
+            var view = createPeerAssessmentView('oa_peer_complete.html');
+            $(".action--continue--grading", view.element).click();
+
+            // Verify that a peer assessment can now be submitted
+            submitPeerAssessment(view);
+        });
+    });
 });

openassessment/xblock/static/js/src/lms/oa_peer.js

@@ -74,7 +74,7 @@ OpenAssessment.PeerView.prototype = {
 
     **/
     continueAssessmentEnabled: function(enabled) {
-        var button = $('#peer-assessment__continue__grading', this.element);
+        var button = $('.action--continue--grading', this.element);
         if (typeof enabled === 'undefined') {
             return !button.hasClass('is--disabled');
         } else {
@@ -128,7 +128,7 @@ OpenAssessment.PeerView.prototype = {
         );
 
         // Install a click handler for continued assessment
-        sel.find('#peer-assessment__continue__grading').click(
+        sel.find('.action--continue--grading').click(
             function(eventObject) {
                 eventObject.preventDefault();
                 view.loadContinuedAssessment();

openassessment/xblock/static/sass/oa/views/_oa-base.scss

@@ -65,6 +65,7 @@
       @extend %btn--primary;
       @extend %action-2;
       margin-left: ($baseline-v/2);
+      margin-top: ($baseline-v/2);
 
       .copy, .icon {
         display: inline;
@@ -1136,12 +1137,12 @@
     .list--actions {
       padding: 0;
     }
+  }
 
-    .action--submit {
-      @extend %btn--secondary;
-      @extend %action-2;
-      @include margin-right(($baseline-v/2));
-    }
+  .action--submit {
+    @extend %btn--secondary;
+    @extend %action-2;
+    @include margin-right(($baseline-v/2));
   }
 
   // --------------------

test/acceptance/pages.py

@@ -100,9 +100,9 @@ class SubmissionPage(OpenAssessmentPage):
         self.q(css="textarea.submission__answer__part__text__value").fill(latex_query)
 
     def preview_latex(self):
-        # Click 'Preview in Latex' button on the page.
+        # Click 'Preview in LaTeX' button on the page.
         self.q(css="button#submission__preview").click()
-        self.wait_for_element_visibility("#preview_content .MathJax", "Verify Preview Latex expression")
+        self.wait_for_element_visibility("#preview_content .MathJax", "Verify Preview LaTeX expression")
 
     def select_file(self, file_path_name):
         """