Custom Slideshow with Multi-State Boxes

Velo Code:

$w.onReady(function () {
    
//STATE 1
$w('#s1b1').onClick(() => {
    $w('#multiStateBox1').changeState('four');
});
$w('#s1b2').onClick(() => {
    $w('#multiStateBox1').changeState('two');
});
$w('#s1s2').onClick(() => {
    $w('#multiStateBox1').changeState('two');
});
$w('#s1s3').onClick(() => {
    $w('#multiStateBox1').changeState('three');
});
$w('#s1s4').onClick(() => {
    $w('#multiStateBox1').changeState('four');
});


//STATE 2
$w('#s2b1').onClick(() => {
    $w('#multiStateBox1').changeState('one');
});
$w('#s2b2').onClick(() => {
    $w('#multiStateBox1').changeState('three');
});
$w('#s2s1').onClick(() => {
    $w('#multiStateBox1').changeState('one');
});
$w('#s2s3').onClick(() => {
    $w('#multiStateBox1').changeState('three');
});
$w('#s2s4').onClick(() => {
    $w('#multiStateBox1').changeState('four');
});


//STATE 3
$w('#s3b1').onClick(() => {
    $w('#multiStateBox1').changeState('two');
});
$w('#s3b2').onClick(() => {
    $w('#multiStateBox1').changeState('four');
});
$w('#s3s1').onClick(() => {
    $w('#multiStateBox1').changeState('one');
});
$w('#s3s2').onClick(() => {
    $w('#multiStateBox1').changeState('two');
});
$w('#s3s4').onClick(() => {
    $w('#multiStateBox1').changeState('four');
});


//STATE 4
$w('#s4b1').onClick(() => {
    $w('#multiStateBox1').changeState('three');
});
$w('#s4b2').onClick(() => {
    $w('#multiStateBox1').changeState('one');
});
$w('#s4s1').onClick(() => {
    $w('#multiStateBox1').changeState('one');
});
$w('#s4s2').onClick(() => {
    $w('#multiStateBox1').changeState('two');
});
$w('#s4s3').onClick(() => {
    $w('#multiStateBox1').changeState('three');
});
});

Enjoy!