oops…

I wasted some time on accident, woops.
I thought Discord’s proxy verification meant that the discordsays.com proxy would send these headers to verify that an actual Discord client had connected with them, but uh, I checked the flowchart again and I got that wrong. Hm. Thankfully, I didn’t get too far into implementing that.

Regardless, trying to implement that still encouraged me to do a small bit of cleanup, which was properly declaring the environment variable. A certified moment.

(YES I am going to abuse the fact that I figured out that you can use custom emotes here. i am so sorry)

smol devlog

I HATE DOCKER i love Docker!!

So, I didn’t even write a devlog yesterday because I spent the entirety of the time that I did have setting up a Dockerfile and docker-compose.yml for LARPARDY.

…why did it take that long

Because I’ve never used Docker before! Well, I have, to run services on my PC and my homelab server, but I’ve never used it for my own projects before.

Specifically, I want to go ahead and set up Docker because I know that I’m going to need a database (or possibly two! SQL + Redis), and running everything together in a container will make both development AND deployment much easier for me.
I’ve never used it before, so this is, uh, a learning experience, to say the least.

oh also, pnpm

Oh. Also. pnpm has a bug. Apparently.
I’m using pnpm as the package manager for both the server and the client (since they’re both TypeScript projects). Both projects are stored in a monorepo (literally meaning just a repo with multiple projects, basically), which makes it easy to manage for me and keeps my commits together.

Nicely, pnpm recommends a Dockerfile for this exact scenario! I reconfigured the project to use pnpm‘s workspaces feature (which… is seperate from package.json’s workspaces, for some reason) so that this would work.
pnpm deploy is supposed to copy the project with it’s own node_modules since workspaces use a shared one. The problem is that, when it rewrites workspace dependencies (because I have a shared package for both the server & client), it links it to the wrong source, which no longer exists after it’s copied!
I tried to debug and get this working for ACTUAL AGES before I gave up and just wrote commands that manually copy the files instead.
I figured that there HAS to be a way to get this working, considering the documentation itself recommends this build file. But noooope. It doesn’t seem so (cite: this GitHub issue which has been open since… 2023???).

so what did you actually do

The Docker config works now, and that’s the important thing! I currently have the client build into an nginx image, but I’m either going to drop this entirely or have the server serve the client files itself. This will allow me to implement Discord proxy header verification too, if I decide to.

Socket.IO!

As for perhaps one of the most important bits… this is Socket.IO! I had to figure out how to get this working with Fastify first (thank you random GitHub commenter) since that’s my web framework of choice for the backend (for anything not going through Socket.IO), but here’s a basic implementation of it working!

what it do?

Socket.IO works similarly to (and if it’s available, on top of) WebSockets, where there’s a persistent connection with bi-directional communication between the client and the server. Socket.IO adds some extra fancy things on top of that, such as fallbacks when WebSockets aren’t available and rooms, and in general will make my life easier (lol).

This part is, of course, very important for getting a game handled by the backend to work! This will also allow us to do multiplayer. Discord gives you an instance ID for each activity that players are playing together, so I’ll use this to make the rooms, that way players in the same voice channel will end up in the same game!

ho boy…

I’ve wanted to make a Discord Activity basically since the feature began being teased… so, no better time than the present, right? I saw some guys playing Jeopardy the other night and I realized that I feel like the online ways of playing Jeopardy are kinda… uh, bad? I thought I should fix that.

I’ve been getting a lot more comfortable with frontend development recently (I’m normally more comfy with backend stuff!), so now this is really going to test my ability to handle FULL STACK development.
With that said, I’ve been playing around since last night and I have a working setup with (stable) communication with the Discord client via the SDK. (hooray!) Currently, it just shows the name and avatar of connected players.

don’t you love React?

Me too! Unfortunately, I am lying.
I’m trying Vue.js for the first time for this project. There is a LOT that I’m planning that is very new to me for this project. I expect to need Redis, Socket.IO, and (of course) the Discord activities SDK, none of which I’ve ever used. So, here we go?

the name. dude. what. why

I didn’t originally have a name for this (the README still remains “Untitled Jeopardy Clone” for now), so I was using the name “Leopardy” as a placeholder. Someone recommened me to switch to LARPARDY.
I couldn’t say no. I wish I did.

…anyways, next up is actually making some sort of game state work. I’m going to start working on the backend!

V1! (last devlog before ship?)

Wew, I should have probably made a devlog in between my last one!

Windows support

I have added Windows support! Fun fact, I hate working with the Windows API, and I’ve just learned that!
In fairness, it’s a littleee bit awkward working with an API that is very obviously native to C, even if the Rust library gives it some Rustiness, but still, I dislike it. Greatly. Anyways, the important part is it works! And I had to use an undocumented Windows API to do a basic task (setting the default audio device). Nice. Cool! Awesome.
(i’ve been trying to switch to Linux for a reason)
Thankfully, someone already implemented that in the com-policy-config crate so I don’t have to find and try to convert a header file myself.

Saving the config!

After Windows support was done, the rest was relatively easy! Tauri has another plugin that makes it a little bit easier to manage a JSON store file and make it accessible to anything that has an AppHandle. config.json now stores the selected swap device and keybind, and these get automatically reloaded on startup. Lovely!

oh hey uh, how are we building this thing, exactly?

I use NixOS as my main operating system, so I already made a default.nix and shell.nix for running here. However, it doesn’t seem I can properly compile the regular bundles for .deb., .rpm, and AppImages (easily, anyway), and it would be tedious for every release anyways! Thankfully, tauri-action already exists, too! I made a GitHub Actions workflow that will compile and publish installers for both Windows and Linux when I make a new release. It’s pretty neat stuff, actually!

README, After All

This also means I finally took the time to make a nice README. It was nice to take a small step back to kind of overview this project.
A fun little over-engineered thing this is, something that could have stayed a CLI app with only Linux support and nobody would have blinked, but here we are!
It’s definitely been good practice for both my backend (Rust!) and frontend skills. I will definitely be using Tauri again in the future!

Hello, from v1.0.0! (and Windows!)

“It’ll be easy!”

NO IT WON’T BE ASDSFSDGDG
ahem. What I mean to say is that the UI is done and ready! I think it looks relatively nice, simple, and most importantly, is functional.
I, somehow, managed to log 11 HOURS, of which a significiant part of was not doing the UI, actually! It was literally just trying to get the global shortcut functionality to work again!

Wayland doesn’t like you doing that, actually

I use KDE Plasma as my desktop environment, which uses Wayland by default as of Plasma 6. I want to support all systems, and that obviously includes my own, but the Global Shortcut plugin for Tauri, as it turns out, only natively supports X11. Ah.
At first, I tried using this pull request by patching it into my dependencies, so the Tauri plugin would use that instead of the normal crate. This worked actually! Until I tried using unregister_all(), at which point it crashes the xdg-desktop-portal with a SIGABRT, somehow, for some reason.
I have no idea if that’s an issue with my system (I tried updating!) but I couldn’t find a way around it, so I ended up scrapping that plan (using an unreviewed, unmerged PR probably isn’t a great idea anyway…).

What now?

After what I said about rdev in the last devlog, I ended up writing a key handler module that would fallback to rdev when detecting Wayland (inspired by how murmur ended up doing this as well).
Except… I wrote all this, spent a couple of hours getting everything working, and then somehow, by having moved the callback function for shortcuts into the Rust code (where I previously was trying it from the frontend in TypeScript), it… WORKS?! With the default Tauri plugin, which is only supposed to work on X11.
This requires some more testing (is this a KDE Plasma specific thing?! or Xwayland??), so I’m keeping the keys module I made around for now just in case.

Good news!

The good news is that this means it works! The really only last two bits I need are Windows support and saving the config.
Should this have taken this long? Probably not. I attribute that to still wandering my way through Rust and literally never having used Tauri before (lol). A good amount of time was spent getting the UI working in a way that I was happy with, too!
With that said, here’s a quick recording of everything working!

UI TIME!

This is my first time using Tauri! As I’ve learned with a previous project, UI and Rust are still a bit iffy, sadly.
Tauri effectively parallels Electron while offering much better performance, especially as you still use Rust for the backend while allowing the ease of use of HTML + CSS + JS/TS for the frontend! It uses native WebViews instead of Chromium, which gets rid of one of my biggest frustrations with Electron, that being including and running a whole browser for what’s often a single page.

Of course, this is, uh, maybe is not the best project to showcase how great those features are considering there is effectively one (1) main feature here (lol), but this is a learning experience and an excuse to continue more Rust!

I’m adding UI because running from the terminal is not the best UX, and this will make it easier to change the config (which you couldn’t do before after starting!) and handle everything more gracefully.

I will say that, so far, the developer experience with Tauri has felt great. Automatic hot reloading is enabled by default on both the TypeScript frontend AND the Rust backend (which will auto-rebuild), super neat! Getting everything set up with Nix was… less great, but not Tauri’s fault.
I also chose to use React for this project, as it’s been quite some time since I’ve really worked with it.

Oh, yeah, also I made a logo in Aseprite! I mainly needed this for a tray icon. Modeled after the one and only Logitech C920 PRO HD Webcam, with its glorious (read as: bad (read as: loud = funny)) microphone.

Now that the project has been refactored for Tauri, I need to port the old code to the new “backend”. I’ll build the config UI around this once that’s done!

Also, Tauri actually has a global shortcut plugin, so I can replace rdev with this for a (hopefully) less janky handling system.
(it’s awfully hard to find info about global key handling, probably because that’s misused for malware more often than not…)

INITIAL PROTOTYPE

I almost forgot I was going to make this! I made an initial prototype for funnymic, which (for now, at least) is a CLI tool to hot swap to a microphone only when holding down a key (like a very, very bad and comically loud C922 webcam mic, perhaps lol).

This initial prototype only works on Linux. My TODO is to

• Make this faster if possible (maybe some async jank happening right now)
• Add Windows support
• Make it actually configurable

This also is an excuse for me to learn more Rust! I’m likely going to work on most projects in Rust to continue learning (when it makes sense).

NEOCITIES LOG 1

hihi! i’ve been on Neocities for a while, but, y’know, i haven’t had a good place to log my development process before! so this seems fitting.

i finally finished and published my Bluey page! it is LITERALLY a children’s show but despite that i became obsessed with it last year, and i think it’s actually really neat and really is worth the recognition. i started working on this shrine page mannyyy months ago and i’ve finally recently had the time to finish it to my liking!

one of my favorite parts of my shrine pages is matching the styling! i “borrowed” some CSS (mainly colors) from the actual bluey.tv website to help, but learning CSS while making this website has definitely been interesting lol

the voice clip buttons also use a convenient nunjucks macro to save me some time (and it keeps consistency)!

{% macro audio(url) %}
<a
  href="#"
  onclick="new Audio('{{ url | escape }}').play(); return false;"
  aria-label="Play voice clip"
  ><i class="nf nf-fa-play"></i
></a>
{% endmacro %}

this would probably be better with a dedicated script, but that seemed like a bit much for this task IMO so i did NOT do that lol

in general i learned actually quite a lot about CSS from this, i cannot lie lol

i’m quite happy with how this turned out in the end. whether or not you care about the show, i hope it’s worth a read!

(psst, also, the time logged for this devlog is quite small because most of this page had been done before Stardance! i just finished some touchups today and merged it.)