Enter link traversal portal after peeking, without having to click

I'm using the showcase example link-traversal

I'm trying to enable the functionality that once you peek inside the portal it takes you into that link automatically, without having to click.

I was thinking of creating something like a "portal peeked" event listener, but wouldn't really know where to start with that.

Does anybody perhaps have an idea of how I could achieve this?

Solution

Here is how I would achieve this: detect when the player moves over an invisible trigger geometry, ie the "teleportation pad", and use a raycaster to trigger the event, which can be listened for, and handled, to perform the teleporation.
1) create a pad, or plane (or any shape) that sits on the floor, placed so that when the user is over it, the teleportation will occur. Attach a class='teleport' component to its entity.
2) create a raycaster, attached to the child of the player, that shoots downward (0 -1 0) every frame. When it hits the pad, the event is thrown and the teleportation can be implemented.

Here is one way to set this up (untested, but the general idea is there):

<a-entity id="player" collider-check>
  <a-entity raycaster="objects: .teleport" position="0 1 0" rotation="-90 0 0">  
  </a-entity>    
</a-entity>
<a-entity id="pad" class="teleport" geometry="primitive: plane" position="0 0 0" visible="false"></a-entity>

Here you can find details on making a raycaster.

https://aframe.io/docs/0.9.0/components/raycaster.html#sidebar

Then make a custom component ('collider-check') that is attached to your player. Inside of it, add the listener for raycasting events, and the function that handles the event with your teleportation.

AFRAME.registerComponent('collider-check', {
  dependencies: ['raycaster'],

  init: function () {
    this.el.addEventListener('raycaster-intersection', function () {
      console.log('Player hit something!');
    });
  }
});

Here is an example of a raycast event that triggers when a known target object is hit. https://glitch.com/~rollover-rotate

This is a bit different that what you need (uses cursor, which you don't need), but it shows how to set up a raycaster, listen for a collision event, and handle it with a fuction, all in a custom component.