From 0387d766107b60c3f1eae57b350563723c8e09f8 Mon Sep 17 00:00:00 2001 From: David Ormsbee Date: Mon, 26 Aug 2013 15:48:05 -0400 Subject: [PATCH] Fix disable/enable buttons in verification workflow. --- lms/templates/verify_student/face_upload.html | 2 +- .../verify_student/photo_verification.html | 87 ++++++++++++------- 2 files changed, 58 insertions(+), 31 deletions(-) diff --git a/lms/templates/verify_student/face_upload.html b/lms/templates/verify_student/face_upload.html index bd3845773f..6bfc18fd72 100644 --- a/lms/templates/verify_student/face_upload.html +++ b/lms/templates/verify_student/face_upload.html @@ -123,7 +123,7 @@ $(document).ready(function() {
-

+

Once you verify your photo looks good, you can move on to step 2.

diff --git a/lms/templates/verify_student/photo_verification.html b/lms/templates/verify_student/photo_verification.html index bb69d04f2a..39507fd1f8 100644 --- a/lms/templates/verify_student/photo_verification.html +++ b/lms/templates/verify_student/photo_verification.html @@ -16,21 +16,9 @@ window.URL = window.URL || window.webkitURL; navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia; - - // // Make all the video pieces active - // $('video').each(function(i, video) { - // if (navigator.getUserMedia) { - // navigator.getUserMedia({video: true}, function(stream) { - // video.src = window.URL.createObjectURL(stream); - // }, onVideoFail); - // } else { - // video.src = 'somevideo.webm'; // fallback. - // } - // }); } var submitToPaymentProcessing = function() { - // $("#pay_form") var xhr = $.post( "create_order", { @@ -59,6 +47,7 @@ var captureButton = $("#" + name + "_capture_button"); var resetButton = $("#" + name + "_reset_button"); var approveButton = $("#" + name + "_approve_button"); + var nextButton = $("#" + name + "_next_button"); var ctx = canvas[0].getContext('2d'); var localMediaStream = null; @@ -69,19 +58,50 @@ image[0].src = canvas[0].toDataURL('image/png'); } video[0].pause(); + + captureButton.hide(); + resetButton.show(); + approveButton.show(); return false; } function reset() { $('#face_image')[0].src = ""; video[0].play(); + + approveButton.removeClass('approved'); + nextButton.addClass('disabled'); + + captureButton.show(); +// captureButton.removeClass('is-hidden'); + resetButton.hide(); +// resetButton.addClass('is-hidden'); + approveButton.hide(); +// approveButton.addClass('is-hidden'); + return false; } function approve() { + approveButton.addClass('approved'); + nextButton.removeClass('disabled'); + return false; } + // Initialize state for this picture taker + captureButton.show(); + //captureButton.removeClass('is-hidden'); + + resetButton.hide(); + //resetButton.addClass('is-hidden'); + + approveButton.hide(); + //approveButton.addClass('is-hidden'); + + nextButton.addClass('disabled'); + + // Connect event handlers... video.click(snapshot); captureButton.click(snapshot); resetButton.click(reset); @@ -95,7 +115,7 @@ function initPhotoBlocks() { // Photo wrapping - $('.block-photo .control-redo').addClass('is-hidden'); +/* $('.block-photo .control-redo').addClass('is-hidden'); $('.block-photo .control-approve').addClass('is-hidden'); $('.block-photo .m-btn-primary').addClass('disabled'); $( "#wrapper-facephoto .control-do" ).click(function(e) { @@ -119,12 +139,19 @@ e.preventDefault(); $(this).addClass('approved'); $('#wrapper-idphoto .m-btn-primary').removeClass('disabled'); - }); + }); */ } $(document).ready(function() { $(".carousel-nav").addClass('sr'); $("#pay_button").click(submitToPaymentProcessing); + $("#confirm_pics_good").click(function() { + if (this.checked) { + $("#pay_button").removeClass('disabled'); + } + }); + + $("#pay_button").addClass('disabled'); initPhotoBlocks(); initVideoCapture(); @@ -172,14 +199,14 @@ @@ -210,7 +237,7 @@
-

+

Once you verify your photo looks good, you can move on to step 2.

@@ -233,14 +260,14 @@ @@ -274,7 +301,7 @@
-

+

Once you verify your ID photo looks good, you can move on to step 3.

@@ -357,9 +384,9 @@

Photos don't meet the requirements? Retake the photos.

- + -

Go to Step 4: Secure Payment

+

Go to Step 4: Secure Payment

Once you verify your details match the requirements, you can move on to step 4, payment on our secure server.