cleanup + arjs-hittesting cleaner

TODO.md

 ## New API - aframe
 - port webar-playground on new API
+
 - once this refactor is done, publish is as AR.js v2.0 with a blog post
 
 - do a button - display-hittester-plane
@@ -10,7 +11,6 @@
 
 - have a source in images and video. in three.js and aframe.js
 
-
 - DONE ensure backward compatibility of aframe api
   - it seems works ?
 

aframe/build/aframe-ar.js

@@ -6471,6 +6471,7 @@ ARjs.Anchor = function(arSession, markerParameters){
 	// log to debug
 	console.log('ARjs.Anchor -', 'changeMatrixMode:', this.parameters.changeMatrixMode, '/ markersAreaEnabled:', markerParameters.markersAreaEnabled)
 
+
 	var markerRoot = new THREE.Group
 	scene.add(markerRoot)
 
@@ -6552,10 +6553,11 @@ ARjs.Anchor = function(arSession, markerParameters){
 	//		Code Separator
 	//////////////////////////////////////////////////////////////////////////////
 	this.update = function(){	
-		// update _this.object3d.visible
-		_this.object3d.visible = _this.object3d.parent.visible
-
-		// console.log('controlledObject.visible', _this.object3d.parent.visible)
+		// update scene.visible if the marker is seen
+		if( markerParameters.changeMatrixMode === 'cameraTransformMatrix' ){
+			_this.object3d.visible = controlledObject.visible
+		}
+		
 		if( smoothedControls !== undefined ){
 			// update smoothedControls parameters depending on how many markers are visible in multiMarkerControls
 			if( multiMarkerControls !== undefined ){
@@ -6575,13 +6577,13 @@ ARjs.Anchor = function(arSession, markerParameters){
  * @param {ARjs.HitTesting.Result} hitTestResult - the result to apply
  */
 ARjs.Anchor.prototype.applyHitTestResult = function(hitTestResult){
-	
-	
-	this.object3d.position.copy(hitTestResult.position)
-	this.object3d.quaternion.copy(hitTestResult.quaternion)
-	this.object3d.scale.copy(hitTestResult.scale)
-
-	this.object3d.updateMatrix()
+	console.warn('obsolete anchro.applyHitTestResult - use hitTestResult.apply(object3d) instead')
+	hitTestResult.apply(this.object3d)
+	// object3d.position.copy(hitTestResult.position)
+	// object3d.quaternion.copy(hitTestResult.quaternion)
+	// object3d.scale.copy(hitTestResult.scale)
+	// 
+	// object3d.updateMatrix()
 }
 // @namespace
 var ARjs = ARjs || {}
@@ -6879,6 +6881,30 @@ ARjs.HitTesting.Result = function(position, quaternion, scale){
 	this.quaternion = quaternion
 	this.scale = scale
 }
+
+/**
+ * Apply to a controlled object3d
+ * 
+ * @param {THREE.Object3D} object3d - the result to apply
+ */
+ARjs.HitTesting.Result.prototype.apply = function(object3d){
+	object3d.position.copy(this.position)
+	object3d.quaternion.copy(this.quaternion)
+	object3d.scale.copy(this.scale)
+
+	object3d.updateMatrix()
+}
+
+/**
+ * Apply to a controlled object3d
+ * 
+ * @param {THREE.Object3D} object3d - the result to apply
+ */
+ARjs.HitTesting.Result.prototype.applyPosition = function(object3d){
+	object3d.position.copy(this.position)
+
+	object3d.updateMatrix()
+}
 var ARjs = ARjs || {}
 
 /**
@@ -7367,11 +7393,11 @@ ARjs.MarkersAreaControls.prototype.updateSmoothedControls = function(smoothedCon
 		// {lerpPosition: 0.5, lerpQuaternion: 0.2, lerpQuaternion: 0.7}
 		// ]
 		lerpsValues = [
-			[0.1, 0.1, 0.3],
-			[0.2, 0.1, 0.4],
-			[0.2, 0.2, 0.5],
-			[0.3, 0.2, 0.7],
-			[0.3, 0.2, 0.7],
+			[0.3+.1, 0.1, 0.3],
+			[0.4+.1, 0.1, 0.4],
+			[0.4+.1, 0.2, 0.5],
+			[0.5+.1, 0.2, 0.7],
+			[0.5+.1, 0.2, 0.7],
 		]
 	}
 	// count how many subMarkersControls are visible
@@ -8215,7 +8241,7 @@ AFRAME.registerComponent('arjs-hit-testing', {
 				if( hitTestResults.length === 0 )	return
 
 				var hitTestResult = hitTestResults[0]
-				arAnchor.applyHitTestResult(hitTestResult)
+				hitTestResult.apply(arAnchor.object3d)
 			})
 			
 			_this.isReady = true

aframe/src/component-hit-testing.js

@@ -49,7 +49,7 @@ AFRAME.registerComponent('arjs-hit-testing', {
 				if( hitTestResults.length === 0 )	return
 
 				var hitTestResult = hitTestResults[0]
-				arAnchor.applyHitTestResult(hitTestResult)
+				hitTestResult.apply(arAnchor.object3d)
 			})
 			
 			_this.isReady = true

babylon.js/src/babylon-ar.js

@@ -4,14 +4,12 @@ var ARjs = ARjs || {}
 ARjs.Babylon = function(){}
 
 ARjs.Babylon.createCamera = function(scene){
-	var babylonCamera = new BABYLON.ArcRotateCamera("GlobalRotativeCamera1",  0, 0, 0, new BABYLON.Vector3(0, 0, -1), scene);
-	// arcRotateCamera.setPosition(new BABYLON.Vector3(0, 50, 80));
-	// arcRotateCamera.setTarget(BABYLON.Vector3.Zero());
-	// arcRotateCamera.attachControl(canvas, true);
+	var babylonCamera = new BABYLON.ArcRotateCamera("blabla",  0, 0, 0, new BABYLON.Vector3(0, 0, -1), scene);
 
-	// hard
+	// hard code a fov which is kinda ok
 	// scene.activeCamera.fovmode = BABYLON.Camera.fovmode_HORIZONTAL_FIXED;
 	// scene.activeCamera.fov = 2*22 / 180*Math.PI
+
 	return babylonCamera
 }
 

three.js/build/ar.js

@@ -6471,6 +6471,7 @@ ARjs.Anchor = function(arSession, markerParameters){
 	// log to debug
 	console.log('ARjs.Anchor -', 'changeMatrixMode:', this.parameters.changeMatrixMode, '/ markersAreaEnabled:', markerParameters.markersAreaEnabled)
 
+
 	var markerRoot = new THREE.Group
 	scene.add(markerRoot)
 
@@ -6552,10 +6553,11 @@ ARjs.Anchor = function(arSession, markerParameters){
 	//		Code Separator
 	//////////////////////////////////////////////////////////////////////////////
 	this.update = function(){	
-		// update _this.object3d.visible
-		_this.object3d.visible = _this.object3d.parent.visible
-
-		// console.log('controlledObject.visible', _this.object3d.parent.visible)
+		// update scene.visible if the marker is seen
+		if( markerParameters.changeMatrixMode === 'cameraTransformMatrix' ){
+			_this.object3d.visible = controlledObject.visible
+		}
+		
 		if( smoothedControls !== undefined ){
 			// update smoothedControls parameters depending on how many markers are visible in multiMarkerControls
 			if( multiMarkerControls !== undefined ){
@@ -6575,13 +6577,13 @@ ARjs.Anchor = function(arSession, markerParameters){
  * @param {ARjs.HitTesting.Result} hitTestResult - the result to apply
  */
 ARjs.Anchor.prototype.applyHitTestResult = function(hitTestResult){
-	
-	
-	this.object3d.position.copy(hitTestResult.position)
-	this.object3d.quaternion.copy(hitTestResult.quaternion)
-	this.object3d.scale.copy(hitTestResult.scale)
-
-	this.object3d.updateMatrix()
+	console.warn('obsolete anchro.applyHitTestResult - use hitTestResult.apply(object3d) instead')
+	hitTestResult.apply(this.object3d)
+	// object3d.position.copy(hitTestResult.position)
+	// object3d.quaternion.copy(hitTestResult.quaternion)
+	// object3d.scale.copy(hitTestResult.scale)
+	// 
+	// object3d.updateMatrix()
 }
 // @namespace
 var ARjs = ARjs || {}
@@ -6879,6 +6881,30 @@ ARjs.HitTesting.Result = function(position, quaternion, scale){
 	this.quaternion = quaternion
 	this.scale = scale
 }
+
+/**
+ * Apply to a controlled object3d
+ * 
+ * @param {THREE.Object3D} object3d - the result to apply
+ */
+ARjs.HitTesting.Result.prototype.apply = function(object3d){
+	object3d.position.copy(this.position)
+	object3d.quaternion.copy(this.quaternion)
+	object3d.scale.copy(this.scale)
+
+	object3d.updateMatrix()
+}
+
+/**
+ * Apply to a controlled object3d
+ * 
+ * @param {THREE.Object3D} object3d - the result to apply
+ */
+ARjs.HitTesting.Result.prototype.applyPosition = function(object3d){
+	object3d.position.copy(this.position)
+
+	object3d.updateMatrix()
+}
 var ARjs = ARjs || {}
 
 /**

three.js/examples/arjs-session.html

@@ -151,7 +151,7 @@
 		if( hitTestResults.length === 0 )	return
 
 		var hitTestResult = hitTestResults[0]
-		arAnchor.applyHitTestResult(hitTestResult)
+		hitTestResult.apply(arAnchor.object3d)
 	})
 
 	//////////////////////////////////////////////////////////////////////////////

three.js/src/new-api/arjs-anchor.js

@@ -22,6 +22,7 @@ ARjs.Anchor = function(arSession, markerParameters){
 	// log to debug
 	console.log('ARjs.Anchor -', 'changeMatrixMode:', this.parameters.changeMatrixMode, '/ markersAreaEnabled:', markerParameters.markersAreaEnabled)
 
+
 	var markerRoot = new THREE.Group
 	scene.add(markerRoot)
 
@@ -126,11 +127,11 @@ ARjs.Anchor = function(arSession, markerParameters){
  * @param {ARjs.HitTesting.Result} hitTestResult - the result to apply
  */
 ARjs.Anchor.prototype.applyHitTestResult = function(hitTestResult){
-	
-	
-	this.object3d.position.copy(hitTestResult.position)
-	this.object3d.quaternion.copy(hitTestResult.quaternion)
-	this.object3d.scale.copy(hitTestResult.scale)
-
-	this.object3d.updateMatrix()
+	console.warn('obsolete anchro.applyHitTestResult - use hitTestResult.apply(object3d) instead')
+	hitTestResult.apply(this.object3d)
+	// object3d.position.copy(hitTestResult.position)
+	// object3d.quaternion.copy(hitTestResult.quaternion)
+	// object3d.scale.copy(hitTestResult.scale)
+	// 
+	// object3d.updateMatrix()
 }

three.js/src/new-api/arjs-hittesting.js

@@ -121,3 +121,27 @@ ARjs.HitTesting.Result = function(position, quaternion, scale){
 	this.quaternion = quaternion
 	this.scale = scale
 }
+
+/**
+ * Apply to a controlled object3d
+ * 
+ * @param {THREE.Object3D} object3d - the result to apply
+ */
+ARjs.HitTesting.Result.prototype.apply = function(object3d){
+	object3d.position.copy(this.position)
+	object3d.quaternion.copy(this.quaternion)
+	object3d.scale.copy(this.scale)
+
+	object3d.updateMatrix()
+}
+
+/**
+ * Apply to a controlled object3d
+ * 
+ * @param {THREE.Object3D} object3d - the result to apply
+ */
+ARjs.HitTesting.Result.prototype.applyPosition = function(object3d){
+	object3d.position.copy(this.position)
+
+	object3d.updateMatrix()
+}