How to tap to change settings in a script

Hey loupis1,

This effect can be done with a simple script added to the Baseball Cap template.

We'll first expose create an api function adjusting the tiltHat variable in BaseballCapController script. We can do so by adding this to the script:

function changeTilt(_number){
  if(script.properties.api.hatTransform){
    var swivel = remap(script.hatSwivel, -1, 1, minHatSwivel, maxHatSwivel) * Math.PI / 180;
    var tilt = remap(_number, -1, 1, minHatTilt, maxHatTilt) * Math.PI / 180;
    var angles = new vec3(tilt, swivel, 0);
    script.properties.api.hatTransform.getTransform().setLocalRotation(quat.fromEulerVec(angles));
  }
}
script.api.changeTilt = changeTilt;

To learn more about scripting and api reference, check out this Scripting Overview page!

This basically copies from the existing script (line 166-174), and replace script.hatTilt with a custom _number value that we're gonna assign with our TapToChange script.

Then we'll create a TapToChange script:

// TapToChange.js
//@input Component.ScriptComponent baseballCapController
var index = 1;
var tiltValue = 0;
function tap()
{
if(tiltValue < 1){
tiltValue++;
}else{
tiltValue = -1;
}
print(tiltValue);
script.baseballCapController.api.changeTilt(tiltValue);
}
var tapEvent = script.createEvent("TapEvent");
tapEvent.bind(tap);

And then attach TapToChange to any object in the scene, and in Inspector link the BaseballCapController object to it.

Then you have it! The hatTilt value is printed from the TapToChange script, feel free to change it to your liking!

Best of luck!

Nico