From ed7e6b5f55a71be4a4c25c586f4e09d2a3b860fc Mon Sep 17 00:00:00 2001
From: benjamin ifland <smuddyx@gmail.com>
Date: Tue, 10 Dec 2019 09:40:55 +0100
Subject: [PATCH] Fix for issue #670 It seems not to be necessary to wait for
 the stream, so it could be shown directly. Also added some missing
 semicolons.

---
 three.js/src/threex/threex-artoolkitsource.js | 57 +++++++------------
 1 file changed, 20 insertions(+), 37 deletions(-)

diff --git a/three.js/src/threex/threex-artoolkitsource.js b/three.js/src/threex/threex-artoolkitsource.js
index 291606874..f1633774d 100644
--- a/three.js/src/threex/threex-artoolkitsource.js
+++ b/three.js/src/threex/threex-artoolkitsource.js
@@ -97,21 +97,15 @@ ARjs.Source.prototype.init = function(onReady, onError){
 
 ARjs.Source.prototype._initSourceImage = function(onReady) {
 	// TODO make it static
-        var domElement = document.createElement('img')
-	domElement.src = this.parameters.sourceUrl
+        var domElement = document.createElement('img');
+	domElement.src = this.parameters.sourceUrl;
 
-	domElement.width = this.parameters.sourceWidth
-	domElement.height = this.parameters.sourceHeight
-	domElement.style.width = this.parameters.displayWidth+'px'
-	domElement.style.height = this.parameters.displayHeight+'px'
-
-	// wait until the video stream is ready
-	var interval = setInterval(function() {
-		if (!domElement.naturalWidth)	return;
-		onReady()
-		clearInterval(interval)
-	}, 1000/50);
+	domElement.width = this.parameters.sourceWidth;
+	domElement.height = this.parameters.sourceHeight;
+	domElement.style.width = this.parameters.displayWidth+'px';
+	domElement.style.height = this.parameters.displayHeight+'px';
 
+	onReady();
 	return domElement
 }
 
@@ -123,33 +117,28 @@ ARjs.Source.prototype._initSourceImage = function(onReady) {
 ARjs.Source.prototype._initSourceVideo = function(onReady) {
 	// TODO make it static
 	var domElement = document.createElement('video');
-	domElement.src = this.parameters.sourceUrl
+	domElement.src = this.parameters.sourceUrl;
 
-	domElement.style.objectFit = 'initial'
+	domElement.style.objectFit = 'initial';
 
 	domElement.autoplay = true;
 	domElement.webkitPlaysinline = true;
 	domElement.controls = false;
 	domElement.loop = true;
-	domElement.muted = true
+	domElement.muted = true;
 
 	// trick to trigger the video on android
 	document.body.addEventListener('click', function onClick(){
 		document.body.removeEventListener('click', onClick);
 		domElement.play()
-	})
+	});
 
-	domElement.width = this.parameters.sourceWidth
-	domElement.height = this.parameters.sourceHeight
-	domElement.style.width = this.parameters.displayWidth+'px'
-	domElement.style.height = this.parameters.displayHeight+'px'
+	domElement.width = this.parameters.sourceWidth;
+	domElement.height = this.parameters.sourceHeight;
+	domElement.style.width = this.parameters.displayWidth+'px';
+	domElement.style.height = this.parameters.displayHeight+'px';
 
-	// wait until the video stream is ready
-	var interval = setInterval(function() {
-		if (!domElement.videoWidth)	return;
-		onReady()
-		clearInterval(interval)
-	}, 1000/50);
+	onReady();
 	return domElement
 }
 
@@ -185,7 +174,7 @@ ARjs.Source.prototype._initSourceWebcam = function(onReady, onError) {
 		onError({
 			name: '',
 			message: 'WebRTC issue-! '+fctName+' not present in your browser'
-		})
+		});
 		return null
 	}
 
@@ -194,7 +183,7 @@ ARjs.Source.prototype._initSourceWebcam = function(onReady, onError) {
                 var userMediaConstraints = {
 			audio: false,
 			video: {
-				facingMode: 'environment',
+				facingMode: {exact: 'environment'},
 				width: {
 					ideal: _this.parameters.sourceWidth,
 					// min: 1024,
@@ -206,7 +195,7 @@ ARjs.Source.prototype._initSourceWebcam = function(onReady, onError) {
 					// max: 1080
 				}
 		  	}
-		}
+		};
 
 		if (null !== _this.parameters.deviceId) {
 			userMediaConstraints.video.deviceId = {
@@ -227,13 +216,7 @@ ARjs.Source.prototype._initSourceWebcam = function(onReady, onError) {
 			});
 			// domElement.play();
 
-// TODO listen to loadedmetadata instead
-			// wait until the video stream is ready
-			var interval = setInterval(function() {
-				if (!domElement.videoWidth)	return;
-				onReady()
-				clearInterval(interval)
-			}, 1000/50);
+			onReady();
 		}).catch(function(error) {
 			onError({
 				name: error.name,