Commit f9067cbe by David Ormsbee

Merge pull request #940 from edx/ormsbee/flash_detect_camera

Detect cameras and flash
parents fbe5cafd 7ab5ae92
...@@ -58,6 +58,7 @@ package ...@@ -58,6 +58,7 @@ package
ExternalInterface.addCallback("reset", reset); ExternalInterface.addCallback("reset", reset);
ExternalInterface.addCallback("imageDataUrl", imageDataUrl); ExternalInterface.addCallback("imageDataUrl", imageDataUrl);
ExternalInterface.addCallback("cameraAuthorized", cameraAuthorized); ExternalInterface.addCallback("cameraAuthorized", cameraAuthorized);
ExternalInterface.addCallback("hasCamera", hasCamera);
// Notify the container that the SWF is ready to be called. // Notify the container that the SWF is ready to be called.
ExternalInterface.call("setSWFIsReady"); ExternalInterface.call("setSWFIsReady");
...@@ -108,6 +109,10 @@ package ...@@ -108,6 +109,10 @@ package
return permissionGiven; return permissionGiven;
} }
public function hasCamera():Boolean {
return (Camera.names.length != 0);
}
public function statusHandler(event:StatusEvent):void { public function statusHandler(event:StatusEvent):void {
switch (event.code) switch (event.code)
{ {
......
var onVideoFail = function(e) { var onVideoFail = function(e) {
console.log('Failed to get camera access!', e); if(e == 'NO_DEVICES_FOUND') {
$('#no-webcam').show();
}
else {
console.log('Failed to get camera access!', e);
}
}; };
// Returns true if we are capable of video capture (regardless of whether the // Returns true if we are capable of video capture (regardless of whether the
...@@ -110,6 +115,7 @@ function initSnapshotHandler(names, hasHtml5CameraSupport) { ...@@ -110,6 +115,7 @@ function initSnapshotHandler(names, hasHtml5CameraSupport) {
if (hasHtml5CameraSupport) { if (hasHtml5CameraSupport) {
ctx = canvas[0].getContext('2d'); ctx = canvas[0].getContext('2d');
} }
var localMediaStream = null; var localMediaStream = null;
function snapshot(event) { function snapshot(event) {
...@@ -188,13 +194,38 @@ function initSnapshotHandler(names, hasHtml5CameraSupport) { ...@@ -188,13 +194,38 @@ function initSnapshotHandler(names, hasHtml5CameraSupport) {
} }
function browserHasFlash() {
var hasFlash = false;
try {
var fo = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
if(fo) hasFlash = true;
} catch(e) {
if(navigator.mimeTypes["application/x-shockwave-flash"] != undefined) hasFlash = true;
}
return hasFlash;
}
function objectTagForFlashCamera(name) { function objectTagForFlashCamera(name) {
return '<object type="application/x-shockwave-flash" id="' + // detect whether or not flash is available
name + '" name="' + name + '" data=' + if(browserHasFlash()) {
'"/static/js/verify_student/CameraCapture.swf?v=2"' + // I manually update this to have ?v={2,3,4, etc} to avoid caching of flash
'width="500" height="375"><param name="quality" ' + // objects on local dev.
'value="high"><param name="allowscriptaccess" ' + return '<object type="application/x-shockwave-flash" id="' +
'value="sameDomain"></object>'; name + '" name="' + name + '" data=' +
'"/static/js/verify_student/CameraCapture.swf?v=3"' +
'width="500" height="375"><param name="quality" ' +
'value="high"><param name="allowscriptaccess" ' +
'value="sameDomain"></object>';
}
else {
// display a message informing the user to install flash
$('#no-flash').show();
}
}
function linkNewWindow(e) {
window.open($(e.target).attr('href'));
e.preventDefault();
} }
$(document).ready(function() { $(document).ready(function() {
...@@ -233,9 +264,18 @@ $(document).ready(function() { ...@@ -233,9 +264,18 @@ $(document).ready(function() {
if (!hasHtml5CameraSupport) { if (!hasHtml5CameraSupport) {
$("#face_capture_div").html(objectTagForFlashCamera("face_flash")); $("#face_capture_div").html(objectTagForFlashCamera("face_flash"));
$("#photo_id_capture_div").html(objectTagForFlashCamera("photo_id_flash")); $("#photo_id_capture_div").html(objectTagForFlashCamera("photo_id_flash"));
// wait for the flash object to be loaded
// TODO: we need a better solution for this
setTimeout(function() {
if(browserHasFlash() && !$('#face_flash')[0].hasOwnProperty('hasCamera')) {
onVideoFail('NO_DEVICES_FOUND');
}
}, 1000);
} }
analytics.pageview("Capture Face Photo"); analytics.pageview("Capture Face Photo");
initSnapshotHandler(["photo_id", "face"], hasHtml5CameraSupport); initSnapshotHandler(["photo_id", "face"], hasHtml5CameraSupport);
$('a[rel="external"]').attr('title', gettext('This link will open in a new browser window/tab')).bind('click', linkNewWindow);
}); });
...@@ -13,6 +13,32 @@ ...@@ -13,6 +13,32 @@
</%block> </%block>
<%block name="content"> <%block name="content">
<div id="no-webcam" style="display: none;" class="wrapper-msg wrapper-msg-activate">
<div class=" msg msg-activate">
<i class="msg-icon icon-warning-sign"></i>
<div class="msg-content">
<h3 class="title">${_("No Webcam Detected")}</h3>
<div class="copy">
<p>${_("You don't seem to have a webcam connected. Double-check that your webcam is connected and working to continue registering, or select to {a_start} audit the course for free {a_end} without verifying.").format(a_start='<a rel="external" href="/course_modes/choose/' + course_id + '">', a_end="</a>")}</p>
</div>
</div>
</div>
</div>
<div id="no-flash" style="display: none;" class="wrapper-msg wrapper-msg-activate">
<div class=" msg msg-activate">
<i class="msg-icon icon-warning-sign"></i>
<div class="msg-content">
<h3 class="title">${_("No Flash Detected")}</h3>
<div class="copy">
<p>${_("You don't seem to have Flash installed. {a_start} Get Flash {a_end} to continue your registration.").format(a_start='<a rel="external" href="http://get.adobe.com/flashplayer/">', a_end="</a>")}</p>
</div>
</div>
</div>
</div>
<div class="container"> <div class="container">
<section class="wrapper"> <section class="wrapper">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment