diff --git a/TODO.md b/TODO.md
index bac9361bbba58ea5d8b321a7a527003ddbce2e33..9d07ea3e06d175be5962d87d86c16865612edbbd 100644
--- a/TODO.md
+++ b/TODO.md
@@ -1,18 +1,29 @@
## New API - aframe
-- TODO put the UI in the plugin
- - do a special function for it, and call this function from javascript
- - or more like a data in the system
-- remove arSession.onResize2() - thus the API is cleaner
- - do a onResize with a test on argument.length - if not good number call old stuff
+
+- honor marker preset
- artoolkit modelViewMatrix/cameraTransformMatrix works
+
- area-artoolkit fails in cameraTransformMatrix
+ - wtf ??? so issue upstream ? how to reproduce in three.js
+
- aruco got perspective issue - likely camera init
-- tango video fails
- - TODO initialize it and display it
+
+- tango video fails
+ - 4TODO initialize it and display it
- how to by pass the renderer from a-frame
+ - some post processing in aframe.js - https://github.com/wizgrav/aframe-effects/blob/master/systems/effects.js
+ - it seems to override renderer.render by its own function... not super clean but if it works ok
+ - it can be changed later
+
- tango tracking is working ? i think so
- - test in both mode
+ - test in both mode
+
+- DONE remove arSession.onResize2() - thus the API is cleaner
+ - do a onResize with a test on argument.length - if not good number call old stuff
+- DONE put the UI in the plugin
+ - do a special function for it, and call this function from javascript
+ - or more like a data in the system
## New API
diff --git a/aframe/aframe-ar-session.js b/aframe/aframe-ar-session.js
index e0dd5382247d2dfa9cf0e4cb360a4fa4fcbe1133..04857b0b24de20b6a591350ef53f4577a97da71e 100644
--- a/aframe/aframe-ar-session.js
+++ b/aframe/aframe-ar-session.js
@@ -138,11 +138,13 @@ AFRAME.registerSystem('arjs', {
this._arSession = null
_this.initialised = false
+ _this.needsOverride = true
+
+ // wait until the renderer is initialised
this.el.sceneEl.addEventListener('renderstart', function(){
- var sceneEl = _this.el.sceneEl
- var scene = sceneEl.object3D
- var camera = sceneEl.camera
- var renderer = sceneEl.renderer
+ var scene = _this.el.sceneEl.object3D
+ var camera = _this.el.sceneEl.camera
+ var renderer = _this.el.sceneEl.renderer
//////////////////////////////////////////////////////////////////////////////
// build ARjs.Session
@@ -155,21 +157,6 @@ AFRAME.registerSystem('arjs', {
contextParameters: arProfile.contextParameters
})
- // KLUDGE
- window.addEventListener('resize', onResize)
- function onResize(){
- var arSource = _this._arSession.arSource
- // ugly kludge to get resize on aframe... not even sure it works
- arSource.copyElementSizeTo(document.body)
-
- var buttonElement = document.querySelector('.a-enter-vr')
- if( buttonElement ){
- buttonElement.style.position = 'fixed'
- }
- }
-
- _this.initialised = true
-
//////////////////////////////////////////////////////////////////////////////
// tango specifics
//////////////////////////////////////////////////////////////////////////////
@@ -182,6 +169,44 @@ AFRAME.registerSystem('arjs', {
// init tangoPointCloud
var tangoPointCloud = _this._tangoPointCloud = new ARjs.TangoPointCloud(arSession)
scene.add(tangoPointCloud.object3d)
+
+ // override renderer.render
+ var rendererRenderFct = renderer.render;
+ renderer.render = function customRender(scene, camera, renderTarget, forceClear) {
+ renderer.autoClear = false;
+
+ // clear it all
+ renderer.clear()
+ // render tangoVideoMesh
+ if( arProfile.contextParameters.trackingBackend === 'tango' ){
+ // render sceneOrtho
+ rendererRenderFct.call(renderer, tangoVideoMesh._sceneOrtho, tangoVideoMesh._cameraOrtho, renderTarget, forceClear)
+ // Render the perspective scene
+ renderer.clearDepth()
+ }
+
+ // render 3d scene
+ rendererRenderFct.call(renderer, scene, camera, renderTarget, forceClear);
+ }
+
+ }
+
+ _this.initialised = true
+
+ //////////////////////////////////////////////////////////////////////////////
+ // awefull resize trick
+ //////////////////////////////////////////////////////////////////////////////
+ // KLUDGE
+ window.addEventListener('resize', onResize)
+ function onResize(){
+ var arSource = _this._arSession.arSource
+ // ugly kludge to get resize on aframe... not even sure it works
+ arSource.copyElementSizeTo(document.body)
+
+ var buttonElement = document.querySelector('.a-enter-vr')
+ if( buttonElement ){
+ buttonElement.style.position = 'fixed'
+ }
}
@@ -218,27 +243,28 @@ AFRAME.registerSystem('arjs', {
// onResize()
window.dispatchEvent(new Event('resize'));
}, 1000/30)
+
+
},
tick : function(now, delta){
var _this = this
+
// skip it if not yet isInitialised
if( this.initialised === false ) return
-
var arSession = this._arSession
+
+
+
// update arSession
this._arSession.update()
if( _this._tangoVideoMesh !== null ) _this._tangoVideoMesh.update()
// copy projection matrix to camera
- // TODO just call a this._arSession.onResize()
- var camera = this.el.sceneEl.camera
- var renderer = this.el.sceneEl.renderer
- var arContext = this._arSession.arContext
- this._arSession.arSource.onResize2(arContext, renderer, camera)
+ this._arSession.onResize()
},
})
@@ -293,12 +319,15 @@ AFRAME.registerComponent('arjsmarker', {
_this.initialised = false
_this._arAnchor = null
+ // honor object visibility
if( _this.data.changeMatrixMode === 'modelViewMatrix' ){
_this.el.object3D.visible = false
}else if( _this.data.changeMatrixMode === 'cameraTransformMatrix' ){
_this.el.sceneEl.object3D.visible = false
}else console.assert(false)
+
+
// trick to wait until arjsSystem is initialised
var startedAt = Date.now()
var timerId = setInterval(function(){
@@ -316,6 +345,22 @@ AFRAME.registerComponent('arjsmarker', {
arProfile.changeMatrixMode(_this.data.changeMatrixMode)
var arProfile = arjsSystem._arProfile
+
+ // honor this.data.preset
+ if( _this.data.preset === 'hiro' ){
+ arProfile.defaultMarkerParameters.type = 'pattern'
+ arProfile.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-hiro.patt'
+ arProfile.defaultMarkerParameters.markersAreaEnabled = false
+ }else if( _this.data.preset === 'kanji' ){
+ arProfile.defaultMarkerParameters.type = 'pattern'
+ arProfile.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-kanji.patt'
+ arProfile.defaultMarkerParameters.markersAreaEnabled = false
+ }else if( _this.data.preset === 'area' ){
+ arProfile.defaultMarkerParameters.markersAreaEnabled = true
+ }else {
+ // console.assert( this.data.preset === '', 'illegal preset value '+this.data.preset)
+ }
+
var arSession = arjsSystem._arSession
var arAnchor = _this._arAnchor = new ARjs.Anchor(arSession, arProfile.defaultMarkerParameters)
diff --git a/aframe/examples/aframe-session.html b/aframe/examples/aframe-session.html
index 976016ac722bfea911e70ee39bfff0d0e07cb2b8..fbe709d6167d21e8ed99bb22b8e06c31cb0f7611 100644
--- a/aframe/examples/aframe-session.html
+++ b/aframe/examples/aframe-session.html
@@ -36,7 +36,7 @@
-
+
-
+
-
@@ -82,9 +82,16 @@
-->
-
+
+
+
+
+
+
+
diff --git a/three.js/examples/arjs-session.html b/three.js/examples/arjs-session.html
index 71646e63f2ae9c6c99775e557f14f412389da709..5f7812268888449c65fd46b5b137a9ce5bc0f186 100644
--- a/three.js/examples/arjs-session.html
+++ b/three.js/examples/arjs-session.html
@@ -60,6 +60,7 @@
/
best
+ toggle-point-cloud
toggle-marker-helper
Learn-new-marker-area
Reset-marker-area
diff --git a/three.js/examples/trackingbackend-switch.html b/three.js/examples/trackingbackend-switch.html
index 964a4d91ca13f61e5d7d16eeec0cad22dbc52867..5ecc01ce2d1b40b4e88a37b48b86fc8252c1f846 100644
--- a/three.js/examples/trackingbackend-switch.html
+++ b/three.js/examples/trackingbackend-switch.html
@@ -115,12 +115,12 @@
var arToolkitSource = new THREEx.ArToolkitSource(arProfile.sourceParameters)
arToolkitSource.init(function onReady(){
- arToolkitSource.onResize2(arContext, renderer, camera)
+ arToolkitSource.onResize(arContext, renderer, camera)
})
// handle resize
window.addEventListener('resize', function(){
- arToolkitSource.onResize2(arContext, renderer, camera)
+ arToolkitSource.onResize(arContext, renderer, camera)
})
////////////////////////////////////////////////////////////////////////////////
@@ -134,7 +134,7 @@
arContext.init()
arContext.addEventListener('initialized', function(event){
- arToolkitSource.onResize2(arContext, renderer, camera)
+ arToolkitSource.onResize(arContext, renderer, camera)
})
// update artoolkit on every frame
diff --git a/three.js/src/newAPI/arjs-anchor.js b/three.js/src/newAPI/arjs-anchor.js
index 6283be2c57b00c2688e6ad72856e0613d1f547ed..a403a4b2391359ff95c09338b61f3ce94b5c93a9 100644
--- a/three.js/src/newAPI/arjs-anchor.js
+++ b/three.js/src/newAPI/arjs-anchor.js
@@ -18,9 +18,7 @@ ARjs.Anchor = function(arSession, markerParameters){
this.parameters = markerParameters
- console.log('ARjs.Anchor -', 'changeMatrixMode:', this.parameters.changeMatrixMode
- , 'trackingMethod:', (markerParameters.markersAreaEnabled ? 'area-' : '')+arContext.parameters.trackingBackend)
-
+ console.log('ARjs.Anchor -', 'changeMatrixMode:', this.parameters.changeMatrixMode, 'markersAreaEnabled:', markerParameters.markersAreaEnabled)
var markerRoot = new THREE.Group
scene.add(markerRoot)
@@ -34,6 +32,13 @@ ARjs.Anchor = function(arSession, markerParameters){
if( markerParameters.markersAreaEnabled === false ){
var markerControls = new THREEx.ArMarkerControls(arContext, controlledObject, markerParameters)
}else{
+ // sanity check
+ console.assert( arContext.parameters.trackingBackend === 'artoolkit' || arContext.parameters.trackingBackend === 'aruco' )
+ // for multi marker
+ if( localStorage.getItem('ARjsMultiMarkerFile') === null ){
+ THREEx.ArMultiMarkerUtils.storeDefaultMultiMarkerFile(arContext.parameters.trackingBackend)
+ }
+
// get multiMarkerFile from localStorage
console.assert( localStorage.getItem('ARjsMultiMarkerFile') !== null )
var multiMarkerFile = localStorage.getItem('ARjsMultiMarkerFile')
@@ -65,7 +70,6 @@ ARjs.Anchor = function(arSession, markerParameters){
// THREEx.ArSmoothedControls
//////////////////////////////////////////////////////////////////////////////
- // TODO should be part of trackingMethod parsing
var shouldBeSmoothed = true
if( arContext.parameters.trackingBackend === 'tango' ) shouldBeSmoothed = false
diff --git a/three.js/src/newAPI/arjs-session.js b/three.js/src/newAPI/arjs-session.js
index 0a486635adae3783bfd0ed068d89f92a5cdfe2e6..01519567da7ffaa18c193a8dfd6bfb203df2ba3a 100644
--- a/three.js/src/newAPI/arjs-session.js
+++ b/three.js/src/newAPI/arjs-session.js
@@ -14,11 +14,6 @@ ARjs.Session = function(parameters){
// log the version
console.log('AR.js', THREEx.ArToolkitContext.REVISION, '- trackingBackend:', parameters.contextParameters.trackingBackend)
-
- // for multi marker
- if( localStorage.getItem('ARjsMultiMarkerFile') === null && parameters.contextParameters.trackingBackend !== 'tango' ){
- THREEx.ArMultiMarkerUtils.storeDefaultMultiMarkerFile(parameters.contextParameters.trackingBackend)
- }
//////////////////////////////////////////////////////////////////////////////
// init arSource
@@ -26,12 +21,12 @@ ARjs.Session = function(parameters){
var arSource = _this.arSource = new THREEx.ArToolkitSource(parameters.sourceParameters)
arSource.init(function onReady(){
- arSource.onResize2(arContext, _this.renderer, _this.camera)
+ arSource.onResize(arContext, _this.renderer, _this.camera)
})
// handle resize
window.addEventListener('resize', function(){
- arSource.onResize2(arContext, _this.renderer, _this.camera)
+ arSource.onResize(arContext, _this.renderer, _this.camera)
})
//////////////////////////////////////////////////////////////////////////////
@@ -45,10 +40,12 @@ ARjs.Session = function(parameters){
_this.arContext.init()
arContext.addEventListener('initialized', function(event){
- arSource.onResize2(arContext, _this.renderer, _this.camera)
+ arSource.onResize(arContext, _this.renderer, _this.camera)
})
-
+ //////////////////////////////////////////////////////////////////////////////
+ // update function
+ //////////////////////////////////////////////////////////////////////////////
// update artoolkit on every frame
this.update = function(){
if( arSource.ready === false ) return
@@ -56,3 +53,7 @@ ARjs.Session = function(parameters){
arContext.update( arSource.domElement )
}
}
+
+ARjs.Session.prototype.onResize = function () {
+ this.arSource.onResize(this.arContext, this.renderer, this.camera)
+};
diff --git a/three.js/src/newAPI/arjs-tangovideomesh.js b/three.js/src/newAPI/arjs-tangovideomesh.js
index 7a9c774b91ea3ff9bc7eaa7cb1924403c929b2c5..f39a466d6782df29552551ea46e217c01c03a797 100644
--- a/three.js/src/newAPI/arjs-tangovideomesh.js
+++ b/three.js/src/newAPI/arjs-tangovideomesh.js
@@ -11,6 +11,9 @@ ARjs.TangoVideoMesh = function(arSession){
// Create the see through camera scene and camera
var sceneOrtho = new THREE.Scene()
var cameraOrtho = new THREE.OrthographicCamera( -1, 1, 1, -1, 0, 100 )
+this._sceneOrtho = sceneOrtho
+this._cameraOrtho = cameraOrtho
+
// tango only - init cameraMesh
arContext.addEventListener('initialized', function(event){
// sanity check
@@ -45,8 +48,6 @@ ARjs.TangoVideoMesh = function(arSession){
this.render = function(){
// sanity check
console.assert( arContext.parameters.trackingBackend === 'tango' )
- // if not yet initialized, return now
- if( videoMesh === null ) return
// render sceneOrtho
renderer.render( sceneOrtho, cameraOrtho )
// Render the perspective scene
diff --git a/three.js/threex-artoolkitsource.js b/three.js/threex-artoolkitsource.js
index 6aaf6a1fbf6c142070f3ce1da16a38e5c3e8d83d..85e28d6a80b7add45d6a078725a5e95a0ec9819a 100644
--- a/three.js/threex-artoolkitsource.js
+++ b/three.js/threex-artoolkitsource.js
@@ -323,17 +323,17 @@ THREEx.ArToolkitSource.prototype.copySizeTo = function(){
this.copyElementSizeTo.apply(this, arguments)
}
-THREEx.ArToolkitSource.prototype.onResize = function(){
- console.warn('obsolete function arToolkitSource.onResize. Use arToolkitSource.onResizeElement' )
- this.onResizeElement.apply(this, arguments)
-}
-
//////////////////////////////////////////////////////////////////////////////
// Code Separator
//////////////////////////////////////////////////////////////////////////////
-THREEx.ArToolkitSource.prototype.onResize2 = function(arToolkitContext, renderer, camera){
+THREEx.ArToolkitSource.prototype.onResize = function(arToolkitContext, renderer, camera){
var trackingBackend = arToolkitContext.parameters.trackingBackend
+
+ if( arguments.length !== 3 ){
+ console.warn('obsolete function arToolkitSource.onResize. Use arToolkitSource.onResizeElement' )
+ return this.onResizeElement.apply(this, arguments)
+ }
// RESIZE DOMELEMENT
if( trackingBackend === 'artoolkit' ){