clocks iii

final touches on the clock system, you can now create them on the frontend with a set of buttons at the bottom. there are 3 preset sizes, and then a section for creating any size clock from 2 to 2019 segments. when the button is clicked, it calls a userCreateClock() function. If no name is given, it is named ClockN, where N is the number clock it would be. I changed from a grid display in the parent container to a flex, using wrapping to mimic a grid when the elements are evenly spaced. However, this is much better because unlike a grid, it reacts to the width of elements (such as when you put a long name for the clock). I also added some code that iterates over the list of keys in localStorage, and finds all the ones that are clock keys using a regex. Then, it creates the missing clocks. I also use this oppurtunity to sort the clocks, first by number of segments and then alphabetically. My goal is to eventually be able to choose the type of sort, as well as add a custom order. However, I don’t see this being super important as it’s unlikely the user will have more than 4-5 clocks going at once. I also added a small favicon I designed myself in Adobe Illustrator. the music in the devlog is Soon by Snow Patrol, would recommend.