Javascript30 - Day 10 - Hold Shift to Check Multiple Checkboxes

The challenge is: given a list of checkboxes, checking one checkbox and then holding shift and selecting another checkbox should also select all checkboxes in between.

I ended up using a depth first search to find all of the checkboxes between the just checked and previously checked checkboxes and then checking each of them if shift was being held.

The way Wes did it was much simpler and I learned some things watching his way.

I didn't realize that you could check for keys that were currently being pressed on any event. In my code, I set a flag to check if shift was currently being pressed, but apparently you can check for that on a click event as well, which is much cleaner.

I also didn't think about just using a querySelectorAll to get all checkboxes and then check against that, so I wrote a recursive DFS function to search for all checkboxes between the boxes that had been checked. This would be necessary if there wasn't a way to select all the checkboxes we needed, but there was and it would almost certainly be easier to add a common class if there weren't.

It was good to brush up on DFS and also to see the easy way to do it afterwards.

Completion Time: ~ 30 Minutes

You can sign up for Javascript30 here: https://javascript30.com

You can view my shift multi-checkbox here: https://spencern.github.io/javascript30/10-hold-shift-and-check-checkboxes

You can see my code here: https://github.com/spencern/javascript30/tree/master/10-hold-shift-and-check-checkboxes