Future Nikki here (May 2025):
If you are here for either professional, hobby or interview/portfolio reasons (or any reason at all honestly), you might be shocked about why I chose to pin this on my top personal projects.
Im going to long post here, so here's the tl;dr for those who want it: I made this as a class assignment in 2 hours a day after getting all 4 of my wisdom teeth out. I bent the rules of my assignment so hard that I got a 100% for taking a radically different yet valid. This is my malicious compliance.
The story behind this one is funny, and honestly did this out of sheer spite, but also because i found it to be utterly hilarious to do this with js and css only. No fancy web dev here for this class haha. This was for an elective class that I actually had fun in if it wasn't for the prof being, quirky, we'll put it at that.
The point of the assignments were to display your work in class and others could go see it, since you had to host it on the class server. I set an alternate upstream to the class server with an ssh key to upload my homework.
I made this in 3 hours, slightly stoned and delirious from my dental surgery and just wanted to get this done and over with. He had a strict assignment policy and I was in too much pain to care at this rate. I was getting this done but not sober LOL. Had way too much fun bending the rules for this. Its meant to have this late 2000s-early-10s vibe of random websites, which is very nostalgic to me.
Most people went the classic, simple, text based, keyboard control apporach to this. I chose to really push the envelope.
The requirements were simple. The turle can only draw as long as its holding a pencil down. There are no restrictions as to its movement. The assignment gave you free reign over input. Your turtle must remain within this canvas and cannot leave the bounds.
why not use canvas library? I made two turtle icons, one holding a pencil up, and one holding it down. with some css and js I was able to have the turtle track my mouse movement. I made sure to position the turtle in a way such that when pressed down, you drew on the canvas, and the pencil tip on the turtle icon with it held down (on click and hold) line up with the pixels being placed on the canvas. I even made the on click and hold event also update the big turtle underneath as kind of like "look, it updates on click!". with some simple bounding box calculations, i was able to deliver exactly what was asked. I was the only person who thought of this in class. To be fair, I was also delirious, slightly stoned, and in incredible pain because i was scared of my painkillers, so the fact that I even got this done is a testament to my spite.
anyway that's why its here. :) if you choose to launch this, volume warning. sometimes we added pranks and jokes to our assignments since others could go and check out your website. Kind of like the early internet. It all comes full circle.
===================================================================================== bruh i did this through the pain of getting all wisdom teeth pulled at once
Recording.2023-02-25.191055.mp4
Assignment Details:
