Skills used

CSS
Go
HTML
Javascript
Python

Crystal Clear Injector

The Crystal Clear Injector website is a website I built for Crystal Clear, but before I continue we need to look at some back information.

A little back information first...

Crystal Clear is a ROM hack of the Nintendo Game Boy Color game known as Pokemon Crystal, the hack adds many new elements to the existing game and fixes many bugs found in the original. Crystal Clear was developed by programmer going by the online alias "ShockSlayer".

Around April/May of 2019, Shock reached out to me asking if I could create a website that would allow players to take advantage of a new feature in an upcoming version of Crystal Clear, a feature that would allow players to inject their own character sprite (and starter Pokemon).

I agreed to help out and got to work on the website.

The first steps

 Prior to reaching out to me, Shock had built a C script that would read each sprite section (card sprite, movement sprite, etc.) and using some packaged tools alongside the script, it would inject the sprite into the correct memory address of the ROM. The script also had a second mode of injecting a starter Pokemon (again at the correct memory address) that could be used.

Shock had also reached out to a friend of his going by the online alias "Nephitejnf" who he asked to help build a desktop application to allow players to accomplish the same functions as the website would as this would allow them to inject while being offline.

Neph decided to build the application in Python (which would turn out to be a good help for the website down the line) and wrote a script that would allow a single template to be uploaded that way a user could choose to use an all-in-one sample template without having to split it manually or they could choose to split it manually if they so desired.

Player Sprite Template

Building the website

While Neph worked on his desktop version, I got to work on the website and had to decide between using Python or Golang as the web server back-end.

It was a tough decision as I had previously done a lot of work using Golang for websites, but given that using Python would allow me to borrow the code used to splitting the sprites from a template I opted to go with Python.

I quickly threw together a one page website using Flask, it didn't need to be multi-page as I could take advantage of Bootstrap's tab function to just hide content behind other tabs on the page that the user could access by simply clicking the navigation links:

 

While the front-end design looked good and the back-end design was going well, there was still another issue I had to deal with.

The race condition

The way the website working there was a small chance that if two people attempted to inject a sprite at the exact same time, it would cause the website to break by accidentally attempting to return to the main directory twice (e.g ../../) which would cause it to go beyond the directory it had read access to.

To combat this, I wrote an application in Golang that would be called by Python to do the same tasks, but as it ran as a separate process, it would not be susceptible to this issue.

Conclusion

In the end, I'd say the website turned out really well and I look forward to making upgrades to the website in the future.

If you'd like to visit the website, you can do so by clicking here