how to Combe three.js page into A-frame page

When integrating three.js pieces into aframe, it's recommended to use custom components. Here's a simple example:

js

AFRAME.registerComponent('foo', {

  // this is called upon initialization
  init: function() {
     // we'll need this later on for updating the animation
     this.animator = null

     // wait until the component is loaded
     this.el.addEventListener('loaded', e => {
            // copied straight from stemkoski's code:
            var runnerTexture = new THREE.ImageUtils.loadTexture( 'images/run.png' );
            this.animator = new TextureAnimator( runnerTexture, 10, 1, 10, 75 ); 

            // apply the texture to our element
            let mesh = this.el.getObject3D('mesh')
            mesh.material.map = runnerTexture 
            mesh.material.needsUpdate = true
     })
  },

  // this is called before each render loop
  tick: function(time, delta) {
      // update only if animator was created
      if (!this.animator) return
      this.animator.update(1000 * delta);
  }
})

HTML:

<a-plane foo></a-plane>

glitch here. To make it work with a glitch i had to preload the image with a-assets due to cors issues.