refracton aframe

[lovisio]

Hello all,
I am trying to use refraction with aframe and ar.js . But I dont find any example or code working.

Video from Jerome Etienne : https://twitter.com/jerome_etienne/status/838749280999518208
Shader aframe for refraction ( doesnt work, only black render ) : https://gist.github.com/AndresCuervo/b4cfdbc46fe056832d822871522ae3bb

Does anyone know if refraction work in ar.js and have a working example ?

Thank you.

[commentatorboy]

No, but the black render problem might be solved by doing changing the renderer:
#494

[gftruj]

Hi, I think I got the shader to work, actually the component was trying to access

this.el.sceneEl.systems.arjs.arToolkitSource.domElement

to create it's video texture, but (...).arjs.arToolkitSource(...) is no longer a valid reference. At least at first glance. I've switched it to

this.el.sceneEl.systems.arjs['_arSession'].arSource.domElement

and check this out:

Not only it's working, but it's cool as hell 😄
Here's the glitch. (aframe 0.9.2, ar.aframe 1.6.0)

Although there is a nasty trick - the _arSession is null at initialization. I've thrown the init into a timer, which is bad. I could throw there an interval checking when _arSession is initialized, but if anyone knows a callback or signal which I can catch it would be way better.

Although now i see in the source code tricks like i've mentioned

var timerId = setInterval(function(){
var anchorComponent = anchorEl.components['arjs-anchor']
// wait until anchorComponent is isReady
if( anchorComponent === undefined || anchorComponent.isReady === false )	return

clearInterval(timerId)

Honestly I just wanted to make it work (super curious, but little time atm), maybe i could take a while and turn it into a question/anwser on SO with more detail.