Played note indicator: onNoteOn show and fade out a small circle using a timer

[gorangrooves]

Objective: In my drum map, for each note that is triggered (kick, snare etc.) show small circle (image) to indicate what element is being triggered, then fade it out over 1 second.

All I have managed to achieve successfully is to have a single circle (NoteIndicator) react to any played note and fade out. I have several circle images, named as NoteIndicator0, NoteIndicator1, NoteIndicator2 etc.

**onInit**

var timer = Engine.createTimerObject();

//------- Learn note ------------

var NoteIndicators = [];

for (i = 0; i < 26; i++)
	{
	NoteIndicators[i] = Content.getComponent("NoteIndicator" + i);
	NoteIndicators[i].set("alpha", 0.0);
	} 


**onNoteOn**

//Show note indicator
timer.startTimer(100);
var opacity = 1.2;
    
    
timer.setTimerCallback(function()
	    {
	    	opacity = opacity - 0.1;
	    	NoteIndicator[0].setAlpha(opacity);
	    }
	    );

What I need is to put all of the NoteIndicator images in a loop onNoteOn to illuminate on played notes found in the NoteTriggers array.

(In a loop, I managed to get the first 12 of them to display, each at subsequently-diminishing opacities, or have them all illuminate at full opacity and stay that way without fadeout. None of what I am after.)

The arrays for note locations/ triggers and note indicators have identical number of elements and they all match. The following code is for drum mapping, which dictates what NoteIndicator should illuminate. This is correct and fully-functional code.

//---- set the sample source locations
const var noteSources = [36,38,37,42,46,44,47,31,33,51,53,49,57,55,59,50,48,45,43,52,80,81,56,82,54,39];
const var noteTriggers = [];
var keyLoc;

Engine.createMidiList();



for (i = 0; i < MapCombos.length; i++)
{
	MapCombos[i].setControlCallback(onBoxControl);
}

inline function onBoxControl(component, value)
{
	local index = MapCombos.indexOf(component);

	noteTriggers[index] = value - 1;
	setKeyColours();
};

@d-healey Can you please help me untangle myself?

[ulrik]

@gorangrooves Maybe something like this?

HiseSnippet 1154.3ocuW8uSibCD1KvV0jVj5IcO.V7Waj3hxxOR3JEc.AnJpGPD4JpRnSWM65j0BG6U65bPzIj5iReT5yPeB5iPeCZmY2kDGHT0F0aQx.1dl46aFOd1wcSzA7zTcBwox6FGyINesauwJST6HlPQ5bDw4ktmHYoQB0.ZecBUoM7TxgiiYoo7PhiyxeOJoSkUHY+7mu4PljoB3SWhPtTKB3uULTXltZ28+AgTdBKj+NwPKo2Z+NAZUasTOBX0xtMHwrfaXC3mwPwVxk37EGGJL5jdFFxEmUNTGNtWj9VUt7WJREWK43DeROvP4KehVFhLFWkzNRHC69f2mR.qzcZrX47XwKcOUDJlr9zXx2jsAcpF1wCmklkdKOC87soWCK5MGJ4XQoUxozKb6EjHhMS2A4yW41QY3I8YPX2lJ4xRV52W1ssFjPYpOjcC+jDXxDM7Z1nw5T3W01sZUHzmZnejkPOCNn6nBEALvWRo6QevBC3lCjx15gwZELO0asYDcMvL4VASU5Amh.QA0upIhhOL1.FaBisfw1vnILZAicfwqWm1BjqEHWqMd+DB08BvB8GoBLBsxaPspepZESjHsdHyvpyjwQL5d6QGoB48EJd3anOYWZC52RWascqVoZkA0S4l7TLu7+jV+VgI5.TzIqnSXpA7Dd35O1Z0.eDLRXB61ikRQbJ2KSBHz7Vc.SdnFXRpWiZqS2nVFhYaCfh45IsYR40PRs2DOpV0JfG8DW5U.qq6CF.rPEQep2iE36PAZ.ZWnapQGmAgWsBsxVNHB8jvrEuOmPyyZPDzO2ZEFikjSXO+rri6gyCrFfmhJTOJAAzRgNXW3Nh4B8HCbL308hZ69fOR0JTiyQmE7ULESofikSgzX31MF6v8OazvqKnOJhH7N7naBksxopCoFF.sTOkpVQ.LWbagDPJwcm2GkAiHyR5q.4e+rYI9OmTyDCqdeU5icr98y8rGsGdsIQKknSMmsKNsddE8TYQj0gKkxQ7IBBUDlsLi6yWlwtJXP9sXKA0pNJg47Xt54pMRJt5C+2O14HHZg0lJVCjKlmXDHEbNh+QnPedkpJtGwSuAxGINqNoXAT61js6pOTGio3RhHDqrMSTuYCxcS9nvub09imN4x8uUDZhr+jQDWLHxXuBYQvz2FSV4f4FVXtOubvbSKLIhxAysrv72jkClaaGaiKGLaZgIMobvrk84oobvbGKL+iQkClu1NG51RAyV10g90wkClyTG5SkCl10g946+ui4S6UE5RVGNRhV2t0Y78BEa.enal9UwdRUoByX62S7+V+z+ao3Kb6JLAQymiKMGNBeN7yAGKdExptG2uOOvLkfq3dxO844IGj7N2FbJyjHf7AWncr7No.zUPpC1ngyRXKA4yafywHPOtJLaxeA+TroON2oXS+G1jLjEjn+PPd6M36b9xrU.NoxdhWE2Sw4TeRVKOfdtPStjgvSt9PP.59uB5RY95rwBnylKfNas.5r8BnSyEPmVKfN67OpC9Z2CFYzCyuN.Kz83r9.cbNVwfLqrrPxeCraj1TH

[gorangrooves]

@ulrik Yes, that looks like what I am trying to achieve! Oh, can't wait to try it now. Thanks you so much!

[gorangrooves]

@ulrik I tweaked it for my scripts, and it works like a charm, exactly what I need. I wouldn't have been able to come up with such a script for the foreseeable future. Thank you so much!

[ulrik]

@gorangrooves I'm glad it helped! :)