Impressing Your Partner on Date Night
A problem solving tale from a Software Developer…
As we all know, the dating world is a beast of a thing. We primp and preen and peacock and prepare for a few hours of nervous banter and awkward/funny moments. We dance around from date to date hoping for the next or that final date that ends the dating phase. And, once you’ve made it past the dating phase you’re good! Right?
Wrong!
You still need to put in the same amount of effort you did while you were finding your footing. Continue to have those great deep-into-the-night conversations… Keep on dressing to impress when the occasion calls for it… And most importantly…
DATE NIGHT!
Date night can be a great way to keep things fresh and entertaining as long as you have the will, the means, and the desire to venture out into the world of things to do. But sometimes, the thing you want to do is limited by what’s going on in the world around you. In many of our cases that barrier is COVID. Date night has turned into Zoom nights, Netflix Parties, and online games galore which honestly isn’t all that bad. Online games have been a life-saving good times maker for me and my partner and I’m sure for many of you as well!
But what happens when that game you want to play doesn’t exist yet? Or maybe you couldn’t find exactly what you were looking for?
I could tell you that as developers we have the power to make that happen. We can create just about anything with enough time. But date night is demanding and needs results fast in order to get the fun going ASAP.
Luckily for us we are a bunch of creative problem solvers! We can use our skills to complement the short-comings of things we want to do on the internet and I’m here to give you a prime, simple example that helped save my date night.
The Request
Last date night my partner asked if we could watch Jeopardy!. A simple request, easy to do, and most importantly fun. I, in my infinite need to ensure my partner is enjoying herself, asked, “Would you like to play Jeopardy! as well?” to which she replied, “YES! 🥺🥺🥺.” So, I searched for something we could play together online and came up short (admittedly there could be solutions out there but I was pressed for time!). In my search I did however find a neat site that has an archive of all the past Jeopardy! questions in the same format as the game show’s board — j-archive and a google sheets document created to keep track of your score. We queued up the Zoom screen share and gave it a go!
The Problem
This seemed like a great way to get in some Jeopardy! for game night, but a problem soon arose. The game board on j-archive shows all the questions so the mystery of the game was sort of taken away.
We managed to get through one round with some embarrassingly negative scores, but it just didn’t feel right. So… I asked my partner for 10 minutes, turned off the Zoom screen share and got to work.
The Solution
I decided to use skills I have gained as a front end dev to improve the UI of the j-archive site (at least on my machine) so we could have a more true-to-life experience when playing Jeopardy! over zoom.
First I inspected the page to find the selectors for the clues to edit their css. Once I had that I used a live css editor chrome extension to target them and switch the visibility to hidden for some children inside the clue elements. Then I added some hover css to give the clue a simple border when moving across the board. Finally, I have a .visible class to switch the visibility of the child elements back so we can see the clue. I also added some other css to get rid of the bright blue clue background color until it’s visible.
In conjunction with the CSS, I added some JS to allow us to click the clue to make it visible. It’s pretty straight forward. I used querySelectorAll to target all the clue elements and then used a for..let..of loop to iterate over the clues to add a click event listener using the onClickClue function. The onClickClue function targets the children we’ve hidden and adds the class visible so they can be seen.
I then popped that code into a snippet in Google Chrome and just like that we had UI that was more true to the Jeopardy! experience.
Date Night? Saved!
When I finished I turned the screen share back on and boy was my partner happy! We got to enjoy the new functionality, and are set up to play some fun rounds of Jeopardy! whenever my partner desires. My years of writing code came in clutch, helped me bring some joy to my partners life and also impress her!
Hopefully this silly tale has been helpful to encourage you to use your skills in creative ways to solve whatever problem you may be facing.
