Examples now use modern navigator.mediaDevices

Solves #26
jcmellado · Jan 29, 2018 · 8a2d770 · 8a2d770
1 parent 34ea629
commit 8a2d770
Show file tree

Hide file tree

Showing 3 changed files with 92 additions and 55 deletions.
diff --git a/samples/debug-posit/debug-posit.html b/samples/debug-posit/debug-posit.html
@@ -28,24 +28,35 @@
       canvas.width = parseInt(canvas.style.width);
       canvas.height = parseInt(canvas.style.height);
 
-      navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
-      if (navigator.getUserMedia){
-        init();
+      if (navigator.mediaDevices === undefined) {
+        navigator.mediaDevices = {};
       }
-    };
-
-    function init(){
-      navigator.getUserMedia({video:true}, 
-        function (stream){
-          if (window.webkitURL) {
-            video.src = window.webkitURL.createObjectURL(stream);
-          } else if (video.mozSrcObject !== undefined) {
-            video.mozSrcObject = stream;
+
+      if (navigator.mediaDevices.getUserMedia === undefined) {
+        navigator.mediaDevices.getUserMedia = function(constraints) {
+          var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
+
+          if (!getUserMedia) {
+            return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
+          }
+
+          return new Promise(function(resolve, reject) {
+            getUserMedia.call(navigator, constraints, resolve, reject);
+          });
+        }
+      }
+
+      navigator.mediaDevices
+        .getUserMedia({ video: true })
+        .then(function(stream) {
+          if ("srcObject" in video) {
+            video.srcObject = stream;
           } else {
-            video.src = stream;
+            video.src = window.URL.createObjectURL(stream);
           }
-        },
-        function(error){
+        })
+        .catch(function(err) {
+          console.log(err.name + ": " + err.message);
         }
       );
 

diff --git a/samples/debug/debug.html b/samples/debug/debug.html
@@ -23,34 +23,47 @@
       canvas.width = parseInt(canvas.style.width);
       canvas.height = parseInt(canvas.style.height);
 
-      navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
-      if (navigator.getUserMedia){
-
-        function successCallback(stream){
-          if (window.webkitURL) {
-            video.src = window.webkitURL.createObjectURL(stream);
-          } else if (video.mozSrcObject !== undefined) {
-            video.mozSrcObject = stream;
+      if (navigator.mediaDevices === undefined) {
+        navigator.mediaDevices = {};
+      }
+
+      if (navigator.mediaDevices.getUserMedia === undefined) {
+        navigator.mediaDevices.getUserMedia = function(constraints) {
+          var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
+
+          if (!getUserMedia) {
+            return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
+          }
+
+          return new Promise(function(resolve, reject) {
+            getUserMedia.call(navigator, constraints, resolve, reject);
+          });
+        }
+      }
+
+      navigator.mediaDevices
+        .getUserMedia({ video: true })
+        .then(function(stream) {
+          if ("srcObject" in video) {
+            video.srcObject = stream;
           } else {
-            video.src = stream;
+            video.src = window.URL.createObjectURL(stream);
           }
+        })
+        .catch(function(err) {
+          console.log(err.name + ": " + err.message);
         }
+      );
 
-        function errorCallback(error){
-        }
+      imageData = context.getImageData(0, 0, camera.width, camera.height);
+      pixels = [];
+      detector = new AR.Detector();
 
-        navigator.getUserMedia({video:true}, successCallback, errorCallback);
-
-        imageData = context.getImageData(0, 0, camera.width, camera.height);
-        pixels = [];
-        detector = new AR.Detector();
-
-        debugImage = context.createImageData(camera.width, camera.height);
-        warpImage = context.createImageData(49, 49);
-        homographyImage = new CV.Image();
-
-        requestAnimationFrame(tick);
-      }
+      debugImage = context.createImageData(camera.width, camera.height);
+      warpImage = context.createImageData(49, 49);
+      homographyImage = new CV.Image();
+
+      requestAnimationFrame(tick);
     }
 
     function tick(){

diff --git a/samples/getusermedia/getusermedia.html b/samples/getusermedia/getusermedia.html
@@ -19,28 +19,41 @@
       canvas.width = parseInt(canvas.style.width);
       canvas.height = parseInt(canvas.style.height);
 
-      navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
-      if (navigator.getUserMedia){
-        
-        function successCallback(stream){
-          if (window.webkitURL) {
-            video.src = window.webkitURL.createObjectURL(stream);
-          } else if (video.mozSrcObject !== undefined) {
-            video.mozSrcObject = stream;
-          } else {
-            video.src = stream;
+      if (navigator.mediaDevices === undefined) {
+        navigator.mediaDevices = {};
+      }
+
+      if (navigator.mediaDevices.getUserMedia === undefined) {
+        navigator.mediaDevices.getUserMedia = function(constraints) {
+          var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
+
+          if (!getUserMedia) {
+            return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
           }
+
+          return new Promise(function(resolve, reject) {
+            getUserMedia.call(navigator, constraints, resolve, reject);
+          });
         }
-
-        function errorCallback(error){
+      }
+
+      navigator.mediaDevices
+        .getUserMedia({ video: true })
+        .then(function(stream) {
+          if ("srcObject" in video) {
+            video.srcObject = stream;
+          } else {
+            video.src = window.URL.createObjectURL(stream);
+          }
+        })
+        .catch(function(err) {
+          console.log(err.name + ": " + err.message);
         }
+      );
 
-        navigator.getUserMedia({video: true}, successCallback, errorCallback);
-
-        detector = new AR.Detector();
+      detector = new AR.Detector();
 
-        requestAnimationFrame(tick);
-      }
+      requestAnimationFrame(tick);
     }
 
     function tick(){