Prevent subsequent canvas drag events from firing?

[TIMAI2]

I have three adjacent regions on a canvas. As I drag from right to left or left to right (I am only measuring the x position), if the drag is within a region, then it changes the background colour of the region. This works OK for background colours.

However, if I want to play a sound / tone when I drag in a region, then it fires the drag event over and over, calling multiple sound events.

How can I only handle the first drag event, and ignore subsequent drag events in each region?

I can see the is possible by using startX for the first region touched, but then dragging to another region could cause multiple events...

If you haven't guessed, think piano/organ/stylophone keys, and trying to remain in touch with the keys whilst moving up and down the keyboard.

Here are the blocks for the colour change as a start point:

[ABG]

Only use TouchDown?

Or capture the region at touchdown and ignore drags in the same region as the preceding drag?

[TIMAI2]

I believe I have got there, in my head, 5 minutes after shutting down the computer!

Global Boolean for each region, default =true. Set to false on first drag, to prevent subsequent drags firing in the region. When dragging to another region, do the same, and reset the booleans to default for the departed region.

Will test tomorrow...

[TIMAI2]

Seems to work:

I will need to work on touch down and up events next for them to operate in conjunction with this, as the fix above will only allow one tone play until you select another region!