From 019cb08560e6bca6c91f91d9be03d468b4031494 Mon Sep 17 00:00:00 2001 From: Matt Hughes Date: Thu, 28 Feb 2019 11:54:53 -0500 Subject: [PATCH 1/5] Avoid user experience trap on proctoring instructions page This makes the "start system check" button check whether the student is already ready to start their exam before sending the user to the backend application's download page. JIRA:EDUCATOR-4105 --- .../proctored_exam/instructions.html | 35 ++++++++++++------- 1 file changed, 22 insertions(+), 13 deletions(-) diff --git a/edx_proctoring/templates/proctored_exam/instructions.html b/edx_proctoring/templates/proctored_exam/instructions.html index 9df8a86a917..578184e146c 100644 --- a/edx_proctoring/templates/proctored_exam/instructions.html +++ b/edx_proctoring/templates/proctored_exam/instructions.html @@ -120,8 +120,18 @@

} ); - function check_exam_started(e) { + function handle_start_exam(e) { e.preventDefault(); + check_exam_started(function() { + // The proctoring setup is not yet complete. + // Show a modal indicating that the user is not done yet. + edx.courseware.proctored_exam.accessibleError( + gettext("Cannot Start Proctored Exam"), + gettext("You must complete the proctoring setup before you can start the exam.") + ); + }); + } + function check_exam_started(failureCallback) { var url = $('.instructions').data('exam-started-poll-url') + '?sourceid=instructions'; $.ajax(url).success(function(data){ if (data.status === 'ready_to_start') { @@ -129,27 +139,18 @@

// to reflect the new state (which will expose the test) location.reload(); } else { - // The proctoring setup is not yet complete. - // Show a modal indicating that the user is not done yet. - edx.courseware.proctored_exam.accessibleError( - gettext("Cannot Start Proctored Exam"), - gettext("You must complete the proctoring setup before you can start the exam.") - ); + failureCallback(); } }); } - $('.start-proctored-exam').click(check_exam_started); - - $("#software_download_link").click(function (e) { - e.preventDefault(); + function launchSystemCheck() { var url = $('.instructions').data('exam-started-poll-url'); - var action = $(this).data('action'); + var action = $('#software_download_link').data('action'); // open the new tab in the click event with an empty URL but show the message. var newWindow = window.open("", "_blank"); $(newWindow.document.body).html("

Please wait while you are being redirected...

"); - var self = this; $.ajax({ url: url, type: 'PUT', @@ -162,6 +163,14 @@

}).fail(function(){ newWindow.close(); }); + + } + + $('.start-proctored-exam').click(handle_start_exam); + + $("#software_download_link").click(function (e) { + e.preventDefault(); + check_exam_started(launchSystemCheck); }); {{backend_js|safe}} From 6bad263bdccee8a0fb72e090f3d8d7e10ca1049b Mon Sep 17 00:00:00 2001 From: Matt Hughes Date: Fri, 1 Mar 2019 16:29:04 -0500 Subject: [PATCH 2/5] Second pass: switch button styles when clicking forward Also check on each CTA click whether we can proceed, adding an error modal to the "system check" CTA when pressed after the learner's ready to start their exam. --- .../proctored_exam/instructions.html | 55 ++++++++++++------- 1 file changed, 35 insertions(+), 20 deletions(-) diff --git a/edx_proctoring/templates/proctored_exam/instructions.html b/edx_proctoring/templates/proctored_exam/instructions.html index 578184e146c..b30434599b2 100644 --- a/edx_proctoring/templates/proctored_exam/instructions.html +++ b/edx_proctoring/templates/proctored_exam/instructions.html @@ -69,7 +69,7 @@

{% endif %}
- {% trans "Start Proctored Exam" %} +
@@ -88,7 +88,6 @@

{% include 'proctored_exam/footer.html' %} From a97e187015a8ebf4b6c20a3201b83255b4d137c0 Mon Sep 17 00:00:00 2001 From: Matt Hughes Date: Mon, 4 Mar 2019 15:02:07 -0500 Subject: [PATCH 3/5] Copy changes and visual restructuring --- .../proctored_exam/instructions.html | 50 ++++++++++++------- edx_proctoring/tests/test_student_view.py | 10 ++-- 2 files changed, 36 insertions(+), 24 deletions(-) diff --git a/edx_proctoring/templates/proctored_exam/instructions.html b/edx_proctoring/templates/proctored_exam/instructions.html index b30434599b2..bf2ed662edf 100644 --- a/edx_proctoring/templates/proctored_exam/instructions.html +++ b/edx_proctoring/templates/proctored_exam/instructions.html @@ -4,7 +4,7 @@

{% blocktrans %} - Follow these steps to set up and start your proctored exam. + Set up and start your proctored exam. {% endblocktrans %}

{% if backend_instructions %} @@ -31,45 +31,57 @@

{% endif %} {% else %} -

- {% blocktrans %} - 1. Copy this unique exam code. You will be prompted to paste this code later before you start the exam. - {% endblocktrans %} -

+

+ {% blocktrans %} + Step 1 + {% endblocktrans %} +

+

+ {% blocktrans %} + Copy this unique exam code. You will be prompted to paste this code later before you start the exam. + {% endblocktrans %} +

{{exam_code}}

{% blocktrans %} - Select the exam code, then copy it using Command+C (Mac) or Control+C (Windows). + Select the exam code, then copy it using Control + C (Windows) or Command + C (Mac). {% endblocktrans %}

+

+ {% blocktrans %} + Step 2 + {% endblocktrans %} +

{% blocktrans %} - 2. Click the button below to set up proctoring. - {% endblocktrans %} -

- -

- {% blocktrans %} - A new window will open. You will run a system check before downloading the proctoring application. + Start your system check now. A new window will open for this step and you will verify your identity. {% endblocktrans %}

{% blocktrans %} - You will be asked to verify your identity as part of the proctoring exam set up. - Make sure you are on a computer with a webcam, and that you have valid photo identification - such as a driver's license or passport, before you continue. + Make sure you: {% endblocktrans %}

+
    +
  • {% blocktrans %}Have a computer with a functioning webcam{% endblocktrans %}
    • +
  • {% blocktrans %}Have your valid photo ID (e.g. driver's license or passport) ready{% endblocktrans %}
    • +
+ +

+ {% blocktrans %} + Step 3 + {% endblocktrans %} +

{% blocktrans %} - 3. When you have finished setting up proctoring, start the exam. + When you've finished the system check and verified your identity, begin your exam. {% endblocktrans %}

{% endif %}
- +
diff --git a/edx_proctoring/tests/test_student_view.py b/edx_proctoring/tests/test_student_view.py index ab30a3969b8..35d91d34f8a 100644 --- a/edx_proctoring/tests/test_student_view.py +++ b/edx_proctoring/tests/test_student_view.py @@ -58,7 +58,7 @@ def setUp(self): self.submitted_timed_exam_msg_with_due_date = 'After the due date has passed,' self.exam_time_expired_msg = 'You did not complete the exam in the allotted time' self.exam_time_error_msg = 'A technical error has occurred with your proctored exam' - self.chose_proctored_exam_msg = 'Follow these steps to set up and start your proctored exam' + self.chose_proctored_exam_msg = 'Set up and start your proctored exam' self.proctored_exam_optout_msg = 'Take this exam without proctoring' self.proctored_exam_completed_msg = 'Are you sure you want to end your proctored exam' self.proctored_exam_submitted_msg = 'You have submitted this proctored exam for review' @@ -775,9 +775,9 @@ def test_get_onboarding_no_perm(self): @ddt.data( (ProctoredExamStudentAttemptStatus.created, - 'Follow these steps to set up and start your proctored exam'), + 'Set up and start your proctored exam'), (ProctoredExamStudentAttemptStatus.download_software_clicked, - 'Follow these steps to set up and start your proctored exam'), + 'Set up and start your proctored exam'), (ProctoredExamStudentAttemptStatus.ready_to_start, 'Proctored Exam Rules'), (ProctoredExamStudentAttemptStatus.error, @@ -806,9 +806,9 @@ def test_get_studentview_created_status_onboarding(self, status, expected_messag @ddt.data( (ProctoredExamStudentAttemptStatus.created, - 'Follow these steps to set up and start your proctored exam'), + 'Set up and start your proctored exam'), (ProctoredExamStudentAttemptStatus.download_software_clicked, - 'Follow these steps to set up and start your proctored exam'), + 'Set up and start your proctored exam'), (ProctoredExamStudentAttemptStatus.submitted, 'You have submitted this practice proctored exam'), (ProctoredExamStudentAttemptStatus.error, From ba3057e1bb48bb134f8c26cc26df687f5400cca3 Mon Sep 17 00:00:00 2001 From: Matt Hughes Date: Tue, 5 Mar 2019 16:24:32 -0500 Subject: [PATCH 4/5] Tightening up whitespace on PSI version of the page --- .../templates/proctored_exam/instructions.html | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/edx_proctoring/templates/proctored_exam/instructions.html b/edx_proctoring/templates/proctored_exam/instructions.html index bf2ed662edf..1c1067fe1c7 100644 --- a/edx_proctoring/templates/proctored_exam/instructions.html +++ b/edx_proctoring/templates/proctored_exam/instructions.html @@ -1,10 +1,10 @@ {% load i18n %}
-
+

{% blocktrans %} - Set up and start your proctored exam. + Set up and start your proctored exam {% endblocktrans %}

{% if backend_instructions %} @@ -30,6 +30,9 @@

{% endif %} +
+ +
{% else %}

{% blocktrans %} @@ -79,10 +82,8 @@

When you've finished the system check and verified your identity, begin your exam. {% endblocktrans %}

+ {% endif %} -
- -

{% include 'proctored_exam/error_modal.html' %} From 4056c165b4356859d659ab17beb69fe761f6728e Mon Sep 17 00:00:00 2001 From: Matt Hughes Date: Tue, 5 Mar 2019 16:25:31 -0500 Subject: [PATCH 5/5] Bump version --- edx_proctoring/__init__.py | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/edx_proctoring/__init__.py b/edx_proctoring/__init__.py index 7891cfb8dcd..24d173093a8 100644 --- a/edx_proctoring/__init__.py +++ b/edx_proctoring/__init__.py @@ -5,6 +5,6 @@ from __future__ import absolute_import # Be sure to update the version number in edx_proctoring/package.json -__version__ = '1.5.17' +__version__ = '1.5.18' default_app_config = 'edx_proctoring.apps.EdxProctoringConfig' # pylint: disable=invalid-name diff --git a/package.json b/package.json index 31c9b476863..d5589e5c5b9 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "@edx/edx-proctoring", "//": "Be sure to update the version number in edx_proctoring/__init__.py", "//": "Note that the version format is slightly different than that of the Python version when using prereleases.", - "version": "1.5.17", + "version": "1.5.18", "main": "edx_proctoring/static/index.js", "repository": { "type": "git",