[simple-navmesh-constraint] create a separate repo and publish to npm

[vincentfretin]

Create a separate repo in c-frame organization to host simple-navmesh-constraint component and publish it to npm. See https://github.com/AdaRoseCannon/aframe-xr-boilerplate/pull/13#issuecomment-1528956571

example: https://glitch.com/edit/#!/aframe-ada-simple-navmesh-constraint---1-4-1 doc: https://github.com/AdaRoseCannon/aframe-xr-boilerplate#simple-navmesh-constraintjs

[vincentfretin]

You can sponsor $10 to vincentfretin fully or partially to work on this feature. Find other work you can sponsor at https://github.com/c-frame/sponsorship

[vincentfretin]

If you want to use a cdn url: https://cdn.jsdelivr.net/gh/AdaRoseCannon/aframe-xr-boilerplate@f34468b9503d0c7326b9af0f1f09959004916875/simple-navmesh-constraint.js

[vincentfretin]

The ground generated by the environment component works well with simple-navmesh-constraint but it currently needs to be set dynamically, I set it after 2s for it to work. We probably need to listen to object3dset event in simple-navmesh-constraint component to update the kept entities to check for navmesh.

It works well with cursor-teleport component too, just be sure to disable and enable simple-navmesh-constraint between navigation transition.

Code snippet below:

    AFRAME.registerComponent('character-controller', {
        init() {
          setTimeout(() => {
            const rig = document.getElementById('rig');
            rig.setAttribute(
              'simple-navmesh-constraint',
              'navmesh:.environmentGround,.environmentDressing;fall:10;height:0;exclude:.navmesh-hole;'
            );
          }, 2000);
        },
        events: {
          'navigation-start': function () {
            if (this.el.hasAttribute('simple-navmesh-constraint')) {
              this.el.setAttribute('simple-navmesh-constraint', 'enabled', false);
            }
          },
          'navigation-end': function () {
            if (this.el.hasAttribute('simple-navmesh-constraint')) {
              this.el.setAttribute('simple-navmesh-constraint', 'enabled', true);
            }
          },
        },
      });

<a-scene environment="preset: japan">
  <a-entity
      id="rig"
      character-controller
      cursor-teleport="cameraRig: #rig; cameraHead: #player; collisionEntities: .environmentGround; ignoreEntities: .clickable"
      movement-controls="camera:#player"
  >
    <a-entity id="player" class="camera" camera position="0 1.6 0" look-controls>
    </a-entity>
  </a-entity>
</a-scene>

[vincentfretin]

With https://github.com/AdaRoseCannon/aframe-xr-boilerplate/pull/27 the setTimeout 2s in my above comment to set simple-navmesh-constraint is not needed anymore.

[vincentfretin]

Latest version is

<script src="https://cdn.jsdelivr.net/gh/AdaRoseCannon/aframe-xr-boilerplate@bca4792/simple-navmesh-constraint.js"></script>