Hello! A little help? (javascript on Circuit Playground)

[Erodi]

Hello. I'm in the process of designing a costume project. This isn't my first rendezvous with code, but I'm fairly new when it comes to Javascript (completed about half of the freeCodeCamp JS module). I thought it would be cooler to get into something that I could get my hands on. So, I looked to applying what I /knew/, to something that I /want/ to do, to something that I /already enjoy doing/. That is costumes and props.

My project in question is an eye for a costume that will be illuminated with a Circuit Playground. The eye is supposed to have 4 modes with an off function, listed below. Mind you that when I engage any mode, I will want to keep it in that mode for hours on end, not needing to change it:

Mode 1 (click button A): sound reactive
at 0 to 45(units[sound level]); solid blue
at 45 to 85(u); run sparkle animation for 100ms
at 85+(u); run theater chase for 100ms, photon flip

NOTE: The sound reactive mode is supposed to stay at solid blue for low and moderate ambient sound levels, then when I talk (from inside a helmet, device will be inside the helmet with me) it /should/ play the sparkle animation for just as long as the sound level is over the threshold and return to solid blue when the sound levels and lessened. The highest setting is for the rare time when I have to yell, and return to solid blue. I'll play with the values later when the code actually works and I have the device in hand.

Mode 2 (double click button A): strobe
alternate strobing blue and white at set interval

Mode 3 (click button B): sound reactive
same function, same code as Mode 1, but in red

Mode 4 (double click button B): strobe
same function, same code as Mode 2, but in red

Off (long press A + B):
Plays color wipe for 500ms
set all pixels to black
set brightness to 0

Each Mode selection plays color wipe for 500ms, then displays the chosen color as per the button used (blue for mode 1, 2, red for mode 3, 4)
On start it plays Rainbow for 3000ms, then set all pixels white, waiting for input from the user.
I also added a fun little easter egg, on shake, all pixels are set to yellow and it plays "ba-ding" lol

So, now that you know a little about how the project is supposed to function...

Here is the problem...

Everything works great, except for Mode 1 and 3. The sound reactive mode worked alright when it was set up purely in logic, but once any of the conditions were met, they'd only run once and would be done. So, I've tried putting them in a loop.

Code: Select all

control.onEvent(Button_B, 1, function () {
    while (input.soundLevel() >= 0) {
        light.pixels.setAll(light.rgb(27, 211, 214))
        light.pixels.setBrightness(100)
    }
    while (input.soundLevel() >= 45) {
        light.pixels.showAnimation(light.animation(LightAnimation.Sparkle), 100)
        light.pixels.photonFlip()
        light.pixels.setAll(light.rgb(27, 211, 214))
        light.pixels.setBrightness(100)
    }
    while (input.soundLevel() >= 85) {
        input.setLoudSoundThreshold(85)
        light.pixels.showAnimation(light.animation(LightAnimation.TheaterChase), 100)
        light.pixels.setAll(Colors.Violet)
        light.pixels.photonFlip()
        light.pixels.setBrightness(100)

I originally tried putting this code into the "On button A click" preset input block on makecode (I love you for this program, btw Adafruit. Thank You!!!) and it wouldn't run.

So, I figured that calling the function through event handlers might be the better option.

onStart:

Code: Select all

light.pixels.showAnimation(light.animation(LightAnimation.Rainbow), 3000)
light.pixels.setAll(Colors.White)
input.setLoudSoundThreshold(85)
control.waitForEvent(Button_A, 1)
control.waitForEvent(Button_B, 1)

setLoudSoundThreshold is for a function which I was thinking about adding, but probably won't

onButton_A_Click:

Code: Select all

input.buttonA.onEvent(ButtonEvent.Click, function () {
    Button_A = 1
    control.raiseEvent(
        Button_A,
        1
    )
    light.pixels.showAnimation(light.animation(LightAnimation.ColorWipe), 500)
    light.pixels.setAll(light.rgb(27, 211, 214))

onEvent:

Code: Select all

control.onEvent(Button_A, 1, function () {
    while (input.soundLevel() >= 0) {
        light.pixels.setAll(light.rgb(27, 211, 214))
        light.pixels.setBrightness(100)
    }
    while (input.soundLevel() >= 45) {
        light.pixels.showAnimation(light.animation(LightAnimation.Sparkle), 100)
        light.pixels.photonFlip()
        light.pixels.setAll(light.rgb(27, 211, 214))
        light.pixels.setBrightness(100)
    }
    while (input.soundLevel() >= 85) {
        input.setLoudSoundThreshold(85)
        light.pixels.showAnimation(light.animation(LightAnimation.TheaterChase), 100)
        light.pixels.setAll(Colors.Violet)
        light.pixels.photonFlip()
        light.pixels.setBrightness(100)
    }

.
.
.
.
Is using event handlers the proper way to perform this function?
If so, am I using the event handlers correctly?
If not, what needs to be changed?

Your help will be immensely appreciated. I've scoured the internet as deep as I could and came up with nothing.

Once this code is completed, I'll be able to purchase all the parts I need for this, all the parts for the voice modulator project (which I'll use the PRE-WRITTEN code for ;) ), and all the parts that I need to make a "pulsing" LED for fiber optics. I'll be buying everything on Adafruit for awesomeness.

I'm really excited to be getting into this, but the code is driving me bananas. I'm 3 days in of being stuck with no progress.
If you need more data like images of the code or the blocks, I'll be happy to provide it.

I apologize in advance for my noobery

Thanks!