How to use the cannon.Vec3 function in cannon

'down': new KeyBinding('KeyS'),
            'left': new KeyBinding('KeyA'),
            'right': new KeyBinding('KeyD'),
            'run': new KeyBinding('ShiftLeft'),
            'jump': new KeyBinding('Space'),
            'use': new KeyBinding('KeyE'),
            'enter': new KeyBinding('KeyF'),
            'primary': new KeyBinding('Mouse0'),
            'secondary': new KeyBinding('Mouse1'),
        };

        // Physics
        // Player Capsule
        let capsulePhysics = new CapsulePhysics({
            mass: 1,
            position: new CANNON.Vec3().copy(options['position']),
            height: 0.5,
            radius: 0.25,
            segments: 8,
            friction: 0.1
        });
        this.characterCapsule = new SBObject();
        this.characterCapsule.setPhysics(capsulePhysics);

        // Pass reference to character for callbacks
        // this.characterCapsule.physics.physical.character = this;

        // Move character to different collision group for raycasting
        this.characterCapsule.physics.physical.collisionFilterGroup = 2;

        // Disable character rotation
        this.characterCapsule.physics.physical.fixedRotation = true;

this.collision.quaternion.z,
            this.collision.quaternion.w
        );
        let forward = new THREE.Vector3(0, 0, 1).applyQuaternion(quat);
        
        const engineForce = 4000;
        const maxGears = 4;
        const gearsMaxSpeeds = {
            'R': -4,
            '0': 0,
            '1': 4,
            '2': 8,
            '3': 12,
            '4': 32
        };
        const velocity = new CANNON.Vec3().copy(this.collision.velocity);
        const currentSpeed = velocity.dot(Utils.cannonVector(forward));
        velocity.normalize();
        let driftCorrection = Utils.getSignedAngleBetweenVectors(Utils.threeVector(velocity), forward);

        // Engine
        if (this.shiftTimer > 0)
        {
            this.shiftTimer -= timeStep;
            if (this.shiftTimer < 0) this.shiftTimer = 0;
        }
        else
        {
            // Transmission 
            if (this.actions.reverse.isPressed)
            {
                const powerFactor = (gearsMaxSpeeds['R'] - currentSpeed) / Math.abs(gearsMaxSpeeds['R']);

initBody: function () {
    var el = this.el,
        data = this.data;

    var obj = this.el.object3D;
    var pos = obj.position;
    var quat = obj.quaternion;

    this.body = new CANNON.Body({
      mass: data.type === 'static' ? 0 : data.mass || 0,
      material: this.system.getMaterial('defaultMaterial'),
      position: new CANNON.Vec3(pos.x, pos.y, pos.z),
      quaternion: new CANNON.Quaternion(quat.x, quat.y, quat.z, quat.w),
      linearDamping: data.linearDamping,
      angularDamping: data.angularDamping,
      type: data.type === 'dynamic' ? CANNON.Body.DYNAMIC : CANNON.Body.STATIC,
    });

    // Matrix World must be updated at root level, if scale is to be applied – updateMatrixWorld()
    // only checks an object's parent, not the rest of the ancestors. Hence, a wrapping entity with
    // scale="0.5 0.5 0.5" will be ignored.
    // Reference: https://github.com/mrdoob/three.js/blob/master/src/core/Object3D.js#L511-L541
    // Potential fix: https://github.com/mrdoob/three.js/pull/7019
    this.el.object3D.updateMatrixWorld(true);

    if(data.shape !== 'none') {
      var options = data.shape === 'auto' ? undefined : AFRAME.utils.extend({}, this.data, {
        type: mesh2shape.Type[data.shape.toUpperCase()]

BoxCollider.prototype.createShape = function(bounds)
{
    if (!this._halfExtents)
        this._halfExtents = bounds.getHalfExtents();

    var vec3 = new CANNON.Vec3();
    vec3.copy(this._halfExtents);
    return new CANNON.Box(vec3);
};

const pitchObject = new THREE.Object3D();
  pitchObject.add(camera);

  let moveForward = false;
  let moveBackward = false;
  let moveLeft = false;
  let moveRight = false;
  let canJump = false;

  const yawObject = new THREE.Object3D();
  yawObject.position.y = 2;
  yawObject.add(pitchObject);
  const quat = new THREE.Quaternion();

  /*----- NORMAL IN CONTACT, POINTING OUT OF WHATEVER PLAYER TOUCHES -----*/
  const contactNormal = new CANNON.Vec3();
  const upAxis = new CANNON.Vec3(0, 1, 0);

  cannonBody.addEventListener('collide', function(e) {
    const contact = e.contact;

    /*----- CONTACT.BI & CONTACT.BJ ARE COLLIDING BODIES -----*/
    if (contact.bi.id === cannonBody.id) contact.ni.negate(contactNormal);

    /*----- CONTACT.NI IS COLLISION NORMAL -----*/
    else contactNormal.copy(contact.ni);

    if (contactNormal.dot(upAxis) > 0.5) canJump = true;
  });

  const velocity = cannonBody.velocity;
  const PI_2 = Math.PI / 2;

init: function () {
    var physics = this.el.sceneEl.components.physics;
    if (physics) {
      var position = (new CANNON.Vec3()).copy(this.el.getAttribute('position'));
      this.body = new CANNON.Body({
        shape: new CANNON.Sphere(this.data.radius),
        material: physics.material,
        position: position,
        mass: this.data.mass,
        linearDamping: this.data.linearDamping
      });
      physics.world.add(this.body);

      this.el.sceneEl.addBehavior(this);
    } else {
      this.el.sceneEl.addEventListener('physics-loaded', this.init.bind(this));
    }
  },
  update: function () { this.tick(); },

public setPosition(x: number, y: number, z: number): void
    {
        if (this.physicsEnabled)
        {
            this.characterCapsule.physics.physical.position = new CANNON.Vec3(x, y, z);
            this.characterCapsule.physics.physical.interpolatedPosition = new CANNON.Vec3(x, y, z);
        }
        else
        {
            this.position.x = x;
            this.position.y = y;
            this.position.z = z;
        }
    }

init: function () {
    var physics = this.el.sceneEl.components.physics;
    if (physics) {
      this.body = new CANNON.Body({
        shape: new CANNON.Plane(), 
        material: physics.material,
        mass: 0
      });
      this.body.quaternion.setFromAxisAngle(new CANNON.Vec3(1,0,0),-Math.PI/2);
      physics.world.add(this.body);

      this.el.sceneEl.addBehavior(this);
    } else {
      this.el.sceneEl.addEventListener('physics-loaded', this.init.bind(this));
    }
  },
  update: function () { this.tick(); },

public setPosition(x: number, y: number, z: number): void
    {
        if (this.physicsEnabled)
        {
            this.characterCapsule.physics.physical.position = new CANNON.Vec3(x, y, z);
            this.characterCapsule.physics.physical.interpolatedPosition = new CANNON.Vec3(x, y, z);
        }
        else
        {
            this.position.x = x;
            this.position.y = y;
            this.position.z = z;
        }
    }

addBox(x, y, z, mass, friction) {
        let shape = new CANNON.Box(new CANNON.Vec3(x, y, z));
        let options = { mass, shape };
        if (friction !== undefined)
            options.material = new CANNON.Material({ friction });

        let body = new CANNON.Body(options);
        body.position.set(0, 0, 0);
        this.world.addBody(body);
        return body;
    }