Putting the Tutorial into Practice

Please Note: This section is under construction. Please check back regularly for updated content.

Overview

In this chapter, we will make use of two existing projects to demonstrate how to use varying types of Augs.

The Augs we will be considering are:

  • Plus-pad game controller style
  • Single stick game controller style

Plus-pad Controller

An example of the plus-pad controller style is the Dyson project, produced by the Table Realms development team in Playcanvas.

The function that forms part of the game.js file which allows button presses to make your entity move is as follows:

var thePlayer = Object.values(TR.players)[0];


if(thePlayer) {

    var currPos = thePlayer.getPosition();

    var speed = 25 * dt;
    

    var tX = thePlayer.getButton('X');

    var tY = thePlayer.getButton('Y');
    

    if(tX.pressed){

        new pc.Vec3(1, 0, 0).scale(speed);

    }else if(tY.pressed){

        new pc.Vec3(0, 1, 0).scale(speed);

    }

}

The above snippet listens to see whether the tX and tY buttons are pressed for the entity at TR.players array position 0, and then translates that into X and Y components for motion using a Vec3.

Single Stick Controller

An example of the single stick controller style is a modified version of the base Playcanvas ball rolling tutorial, also produced by the Table Realms development team.

The function that forms part of the game.js file which allows thumbstick input to make your entity move is as follows:

var thePlayer = Object.values(TR.players)[0];


if(thePlayer) {

    var currPos = thePlayer.getPosition();

    var speed = 25 * dt;



    var tX = thePlayer.getThumbstickXY('T.x');

    var tY = thePlayer.getThumbstickXY('T.y');


    var force = new pc.Vec3(tX, 0, tZ *-1).scale(speed);


    thePlayer.rigidbody.applyForce(force);
}

The above snippet listens to see whether there is motion in the X and Y planes, and also how much motion there is. That input is then translated into a force, which acts upon the entity’s rigid body.

Please Note: The thumbsticks have not yet been fully tested using the new JS libraries.