This is a guest post from fellow LED fan Rupert Rawnsley
I had grand plans for the LED lighting in my new workshop, including TRON-like animations that followed you around and naturalistic patterns that mirrored the mood of the sky, but I eventually settled on simple-bright-and-white because of the usual constraints of time and money. Therefore I was thrilled when I saw Rob’s Spidey Wall, which demonstrates the power and flexibility that addressable LED strips offer.
The possibilities for animating the wall was an itch I had to scratch, and as I have been recently spending time improving my HTML5 skills, I knocked up a quick test page to start experimenting. You can use the buttons to select various preset animations, some of which are less migraine inducing than others.
Go Your Own Way
For the purposes of this post I migrated the code to JSFiddle so you can experiment and come up with your own animations. Changing the values of the h, s, and l variables in the function renderLoop should be all you need to do. There are some handy variables for generating effects based on LED position or index etc… Programming languages delight in punishing you when you do anything wrong, but the developer tools console should help if you get stuck.
Even though the LEDs use RGB natively, it’s more natural to specify colours using HSL and easier to generate the gaudy rainbows I like. In the original examples I’ve used a bunch of classic cheap tricks to animate the LEDs, but I’m sure I don’t know them all so please share anything you come up with.