Cleaning up setinterval’s and settimeout’s in jQUery with delay() and queue()

I came across some code that was using a tangled web of setInterval ‘s and setTimeout ‘s to do… something. I wasn’t really sure what at first.

Here’s the code:

function animateSomeText() {
    setTimeout(function() {
        $('.animate-me').animate({ opacity: 1 }, 200, function() {
            setTimeout(function() {
                $('.animate-me').animate({ opacity: 0 }, 200);
            }, 1800);
        });
    }, 3800);
}
setInterval(animatedText(), 6000);

After some investigating, I figured out two things — what the code was supposed to do, and what the code was actually doing. Continue reading “Cleaning up setinterval’s and settimeout’s in jQUery with delay() and queue()”

DIY Stranger Things Christmas Lights Wall

If you’ve seen Stranger Things, you probably know what I’m talking about when I say “Christmas lights wall” — the ingenious contraption that Joyce rigs up to communicate with the Upside Down.

I though it was so cool that I decided I wanted to make a wall of my own.

Materials

The Lights

Decor

Step 1: Getting the lights ready

Out of the box, the lights won’t be very useful for what we have in mind so we’ll have to wire up new power connectors with our DC power jack adapters.

First you’ll need to cut and strip the power and ground wires. On the lights I received I was able to tell that the +5v was red and the ground was blue by looking through the clear coating on the outside of the light.

If you’re not sure which is which on yours and you’re not able to see which is which through the light itself, consult the WS2811 datasheet for help.

Once we have the wires cut and stripped, we can run the +5 to the + terminal of our female DC jack, and the ground wire to the – terminal and tighten them down. This is where our power supply will plug in.

If you’re like me and got multiple strips of lights, you’ll need to go through the same process on the other end of the strand, only this time with a male adapter.

Repeat these steps for all other light strips.

Once you have all of your adapters attached, you can then string all of your lights together with your male/female adapters. I also put a little tape on them to make sure they stayed together, and to shorten the amount of excess wire.

We’ll also plug in the data adapters at the ends of the strands.

Finally, we’ll run wire from the end of the lights to the Arduino.

Once you get the strands ready to go, it’s time to get down and dirty with some decorations.

Step 2: Decorating

For the decorations, I went pretty simple. I took the retro wallpaper, the paint, and the paintbrush, and painted the letters A-Z in two rows on one end of my “wall”.

I then laid out the lights, making sure there was a light above each letter so that it was easy to tell which letter was “on”.

And one last little detail, I cut a small slit in the wallpaper so that I could run the wires behind and tuck the Arduino away out of sight.

Then it was time to get to the fun part — bringing it all together with code.

Step 3: The Code

The full code can be here but I’ll do a quick overview of what it does.

The code loops over 4 main function:

  • fullBright

fullBright simply turns all the lights on to look like normal Christmas lights

  • flicker

flicker causes the lights to briefly flicker, turn completely off, then slowly come up to about 120% of the brightness of fullBright

  • followMe

followMe causes the light to completely turn off, then start at one and and turn on light by light all the way to the other end, accelerating along the way — as to say “follow me”

  • stringToLights

stringToLights takes a string and prints it along the letters on the wallpaper. This is done one light at a time, and turns off after each letter

  • showAllLetters

showAllLetters is a debugging mode so that all the lights over letters light up to make it easier to arrange them and tweak the code to match your setup.

Once you have the Neopixel library installed and you have your code uploaded to your board, it’s time to test everything out.

Final Result

After getting all of the lights lined up and getting the code edited to match your setup, this will be the final result:

CC and BCC Addresses with SparkPost API

After the Mandrill that many developers grew to know and love was swallowed up by its parent MailChimp, many of us were looking for an alternative.

SparkPost emerged as what seemed like the next best thing due to its easy to use API and a generous free tier. The problem that I, and many other developers, ran into was that there is almost no documentation on how to add CC or BCC to an API response.

After some digging and a lot of trial an error, I finally found the right combination of things that worked.

CC

To add a CC address, you have to two two things

  1. Add the address to your recipients  array, and set the header_to  value to an address in the to  field. For example, if you’re sending the email to to_address@domain.com  and CCing it to cc_address@domain.com , then the header_to  for cc_address@domain.com  will need to be set to to_address@domain.com
  2. Add the email to the CC  headers  option in content  object. If you have multiple emails, these should be comma separated.

I know that’s a little confusing. See the example at the bottom of this post.

BCC

BCC Seems to be simpler than CC since it’s only one step, you just need to repeat step #1 from CC and you’re good to go.

  1. Add the address to your recipients  array, and set the header_to  value to an address in the to field. So if you’re sending the email to to_address@domain.com  and BCCing it to bcc_address@domain.com , the header_to  for bcc_address@domain.com  will need to be set to to_address@domain.com

Again, I know that’s confusing. See the example below.

Sample Request

{
	"content": {
		"subject": "Test Message",
		"html": "This is a test message.",
		"headers": {
			"CC": "some_cc_address@domain.com,some_other_cc_address@domain.com" // add all CC addresses here, comma separated
		},
		"from": {
			"email": "some_from@domain.com",
			"name": "Test Sender"
		}
	},
	"recipients": [{
    		"address": {
    			"email": "to_address@domain.com",
    			"header_to": "to_address@domain.com"
    		}
    	}, {
    		"address": {
    			"email": "some_cc_address@domain.com",
    			"header_to": "to_address@domain.com" // note this address is the same as an address in the "to" field
    		}
       }, {
           "address": {
               "email": "some_other_cc_address@domain.com",
               "header_to": "to_address@domain.com" // note this address is the same as an address in the "to" field
           }
      }, {
          "address": {
              "email": "bcc_address@domain.com",
              "header_to": "to_address@domain.com" // note this address is the same as an address in the "to" field
          }
     }
    ],
}