Toggle color on object

Hi guys! Maybe anybody can help me to understand how can I create a toggle switch color with a distance check script

Case: I want to toggle color on the material. Use foot tracker and distance checker behavior
> function setupDistanceCheck() {

if (!script.distanceCheckObjectA) {
    debugPrint("Object A must be set!");
    return;
}
if (!script.distanceCheckObjectB) {
    debugPrint("Object B must be set!");
    return;
}
var transformA = script.distanceCheckObjectA.getTransform();
var transformB = script.distanceCheckObjectB.getTransform();
var flattenZ = script.distanceCheckFlattenZForScreenTransforms && script.distanceCheckObjectA.getComponent("Component.ScreenTransform") && script.distanceCheckObjectB.getComponent("Component.ScreenTransform");
var distFunc = flattenZ ? function() {
    var offset = transformB.getWorldPosition().sub(transformA.getWorldPosition());
    offset.z = 0;
    return offset.length;
} :
    function() {
        return transformA.getWorldPosition().distance(transformB.getWorldPosition());
    };
whenCompareTypeMatches(distFunc, script.distanceCheckDistance, script.distanceCheckCompareType, onTrigger, script.distanceCheckAllowRepeat, false);

}

So, I wanna mix it with toggle material color

// Bind this to the ‘Initialized’ event

//@input Component.SpriteVisual visual

//@input vec4 color = {1.0,1.0,1.0,1.0}

var toggle = false;

var originalColor = script.visual.mainPass.baseColor;

// Enable full screen touches

global.touchSystem.touchBlocking = true;

// Add a reaction to Tapping

script.createEvent(“TapEvent”).bind(function(){

toggle = !toggle;

// Choose either the original color or the input color

var newColor = toggle ? script.color : originalColor;

// Change the ‘baseColor’ property on the visual’s material

script.visual.mainPass.baseColor = newColor;

});

how can I do it?

Lens Studio has a method on vec4 called lerp. You can use that to mix two colors. I haven’t tried it, but here it is in the docs: Lens Studio by Snap Inc.

static lerp(vec4 vecA, vec4 vecB, Number t) : vec4

Linearly interpolates between the two vectors vecA and vecB by the factor t .

So it would look something like this:

script.visual.mainPass.baseColor = vec4.lerp(script.color, originalColor, .5)

You could use the toggle to set the lerp value to determine how strongly you want to mix

1 Like

Thanx Josh!
Here is the solution for us.

//@input Component.MaterialMeshVisual visual
//@input vec4 color = {1.0,1.0,1.0,1.0}

var toggle = false;
var originalColor = script.visual.mainPass.baseColor;


global.touchSystem.touchBlocking = true;
script.api.toggleColor = toggleColor;

function toggleColor() {
toggle = !toggle;
var newColor = toggle ? script.color : originalColor;
script.visual.mainPass.baseColor = newColor;
}
1 Like