The course also introduced me to some new syntatic structures and cool new whiz bangs from ES6. I had been learning JS from slightly older material produced by Douglas Crockford, and from a random mishmash of the usual W3Schools/MDN/Stack Overflow answers that googling tends to lead you to, and it was perfect timing to get a good look at some of the ES6 stuff.
At the same time, I started tinkering with my blog page here using some layout libraries produced by Metafizzy. I wanted more visual interest on my main page (sorry brutalism ilu, but COLOR!), and I also wanted a way to highlight my favorite content from my blog.
The code is a bit messy. I started but did not finish refactoring to a fully object-oriented style, and I was learning ES6 while doing this, so there’s a wacky mix of old and new syntaxes. I think I’ll have some excellent opportunities coming up in the next few months to do a code review or some pair refactoring, hopefully with someone with better JS style and/or more ES6 know-how than me, so I am comfortable posting this version now and tidying up the code later.
I used metafizzy’s Packery to flow multiple canvas elements dynamically, and included the associated library Draggabilly to let the player actively manage the layout of the “room” canvases with drag-and-drop events. There are two players so that you can play local multiplayer co-op, and players can move from one canvas item to another by lining up the doorways as they move the canvases around. It’s a platformer-puzzle, and I think it’s really cool!
I made some of the art for this (the backgrounds), but most of the sprites came from the excellent Kenney.nl, and that was a fun addition. It was really nice to spend my time coding rather than spriting for this one.
Anyway, here is the game. I hope you give it a try.