Custom animation blocks about pxt-chibitronics HOT 14 CLOSED

I've implemented these animations in Typescript.
@xobs, @jieq
We have two options here, we can keep the animations as blocks that they need to drag into forever loops. These animations are blocking and need their own thread, luckily we can add as many forever loops as we want (thread limit dependent).

Here's what the code looks like, anything inside a function can be wrapped into a block.

Something that would make this a little more flexible is to add a duration for which the user wants to run the animation, say 500ms. The animation would run for that long and then continue with the code execution. This would mean they don't necessarily need to create a forever loop (thread) for each if they want to program something sequentially.

loops.forever(function () {
    heartbeat(AnalogPin.A0, 1);
})

loops.forever(function () {
    heartbeat(AnalogPin.A1);
})

loops.forever(function () {
    twinkle(AnalogPin.A3);
})

loops.forever(function () {
    twinkle(AnalogPin.A4, 2);
})

loops.forever(function () {
    blink(AnalogPin.A5, 4);
})

function heartbeat(pin: AnalogPin, tempo = 12) {
    let current = 0;
    if (tempo > 12)
        tempo = 12;

    current = fade_to(current, 0xc0, 2, pin, 1);
    current = fade_to(current, 0x4, 2, pin, 1);
    loops.pause(80); // fastest rate
    loops.pause((13 - tempo) * 15);
    //delay(180);
    current = fade_to(current, 0xff, 2, pin, 1);
    current = fade_to(current, 0x00, 2, pin, 1);
    loops.pause(214); // fastest rate
    loops.pause((13 - tempo) * 37);
    //delay(420);
}

function twinkle(pin: AnalogPin, tempo = 5) {
    let current = 128;
    while (1) {
        current = fade_to(current, Math.randomRange(0, 255), tempo, pin, 3);
    }
}

function blink(pin: AnalogPin, tempo = 4) {
    fade_to(0, 255, tempo, pin, 7);
    fade_to(255, 0, tempo, pin, 7);
}

function fade_to(current: number, target: number, rate: number, pin: AnalogPin, pause: number) {
    while (Math.abs(current - target) > rate) {
        pins.analogWrite(pin, current);
        current = current + ((target - current) > 0 ? rate : - rate);
        loops.pause(pause);
    }
    return current;
}

from pxt-chibitronics.

This looks good.

We use threads all the time, and in fact the preloaded program spawns a thread for each LED, so such an approach is just fine.

We may want to reduce the amount of per-thread overhead (currently 400 bytes I believe), but that's a thing we can look into later.

from pxt-chibitronics.

So, wrap the functions in blocks and keep it up the user to place them in forever loops?
or do we want to do the threading ourselves?

from pxt-chibitronics.

That would be my approach, unless @jieq has any other ideas.

from pxt-chibitronics.

@jieq what are your thoughts on this design? Also would you want it under a separate category or under Lights? One block with dropdown or multiple blocks?
and besides Blinky, Heartbeat and Twinkle. Any other animations come to mind?

from pxt-chibitronics.

+1 for 1 block with dropdown (maybe with animated gif grid :)). A few core transition animation will get you a long way.

from pxt-chibitronics.

Also, should we make them a package to reduce standard payload? or make them part of core?

from pxt-chibitronics.

from pxt-chibitronics.

@jieq what do you think of this block design:

from pxt-chibitronics.

from pxt-chibitronics.

Hey! I just tried out the effects too and they look so good! I love the dropdown and the illustrations look great :)

I noticed that I couldn't pause or stop the twinkle pattern, whereas I was able to put the heartbeat and blink into a sequence (there seems to be a clear "stop" to the animation cycle).

For example in this code, we don't ever make it out of the twinkle effect:

Is there some way to make all of the effects have a finite cycle with the same cycle duration (e.g. 1 second)? Also, I noticed that when the effects end, they complete on a dim but not all the way off. Is it possible to make it turn off at the end of the cycle? As a workaround, I just put in an "off" block for now!

from pxt-chibitronics.

Yes, I noticed that this morning. the Twinkle animation was in a while loop, and so I made them all have a finite animation. (Not time based, but we could calibrate them so that they all go for the same amount of time). see: c884a72

and yes it is possible to make it turn off, however what if the animation doesn't have an OFF as part of it. like the twinkle (which is all random) that might look weird if you place it in a forever loop. It will have an OFF every x seconds.

from pxt-chibitronics.

(As for the dim issue at the end, looking into that now)

from pxt-chibitronics.

For turning off in the end: in this case, I think it's fine that we ask people to use a custom "turn off block" so that we don't have blips in the regular animation. Thanks!

from pxt-chibitronics.