Decipher This: Crypto Puzzle Arrives at Wisedocks
How This Game Was Born
The Crypto Puzzle Game came out of left field while I was goofing around on a FartDump test page, playing with input classes and JavaScript. I wanted to spice up Wisedockle, but my brain hijacked the idea and made it a full-on cipher puzzle instead.
Wordle Wasn’t Enough
Think of it as Wisedockle’s weird cousin: instead of guessing a five-letter word, you’re cracking multi-word phrases; think Wheel of Fortune, but without the wheel. Spoiler: a Wheel of Fortune–style game is probably coming next.
Behind the Scenes: Building the Crypto Puzzle
I wrestled with splitting phrases into separate words in JavaScript (turns out, arrays hate me), and AI had to bail me out as usual. Which is fine, because I have been using AI to learn JavaScript.
The technical guts to splitting the phrase into individual words wound up looking like this:
let phraseWords = phrase.split(' ');
let cipherWords = ciphered.split(' ');
let globalCharIdx = 0;
cipherWords.forEach((cipherWord, wIdx) => {
const phraseWord = phraseWords[wIdx];
const wordDiv = document.createElement('div');
wordDiv.className = 'puzzle-word';
for (let i = 0; i < cipherWord.length; i++) {
const cipherCh = cipherWord[i];
const origCh = phraseWord[i];
if (/[A-Z]/.test(origCh)) {
const div = document.createElement('div');
div.className = 'puzzle-tile';
const inp = document.createElement('input');
inp.type = 'text';
inp.maxLength = 1;
inp.autocomplete = 'off';
inp.dataset.pos = globalCharIdx;
inp.dataset.cipher = cipherCh;
inp.style.textTransform = "uppercase";
div.appendChild(inp);
const clue = document.createElement('div');
clue.className = 'cipher-letter';
clue.textContent = cipherCh;
div.appendChild(clue);
wordDiv.appendChild(div);
inputRefs.push({input: inp, cipherCh, pos: globalCharIdx});
} else {
const div = document.createElement('div');
div.className = 'static-char';
div.textContent = origCh;
wordDiv.appendChild(div);
}
globalCharIdx++;
}
board.appendChild(wordDiv);
// Space after each word except last
if (wIdx < cipherWords.length - 1) {
const spaceDiv = document.createElement('div');
spaceDiv.className = 'static-char';
spaceDiv.style.width = '30px';
spaceDiv.innerHTML = ' ';
board.appendChild(spaceDiv);
globalCharIdx++;
}
});
Big shoutout to static-char divs for spacing. That worked way better than expected.
How Scoring Works
On FartDump, you just slap your name in after solving the puzzle. Wisedocks needed something fancier; my universal scoring system, leaderboard, and per-device lockout until midnight. Everyone gets the same puzzle each day, and the day’s first player sets it. At midnight the leaderboard wipes clean and starts over fresh.
Making Guesses And Getting Feedback
At first, you couldn’t tell if you were right or wrong. This made the game a bit too hard. So, I added the obvious: your inputs go red for wrong, green for right, and the check fires after every letter.
// highlight logic
inputRefs.forEach(ref => {
const g = ref.input.value;
const a = phrase[ref.pos];
ref.input.classList.remove('correct','wrong');
if (g) {
if (g === a) ref.input.classList.add('correct');
else ref.input.classList.add('wrong');
}
});
checkSolution();
}
Sometimes, progress means stealing ideas from yourself.
Leaderboard
The leaderboard had me pulling my hair out. After you submit your score, you should see the leaderboard. The problem was that you did see the leaderboard but your score wasn't included in it. That's a big problem. So I tried running an ajax request to a file that built the updated leaderboard with your score included but I could not get it to work right. I added timeouts and changed up the way the scores were grabbed to avail. I finally gave up and just had the page reload after a brief timeout and that worked. In the process I realized that the cache was tripping me up.
This wasn't the first time that a cached page caused me hours of work for nothing. Live and learn.
What’s Next?
Will I keep improving this game? Who knows; I’ll either polish it or use it as a launching pad for the Wisedocks Wheel of Fortune. Either way, you’re stuck with my daily puzzles for now. This post will double as the changelog for any tweaks.
Building this thing was half the fun. I just hope someone finds it and enjoys it. If not, at least my JavaScript array skills got slightly less embarrassing.
Changelog
June 14th, 2025
- Reworked the way the win game function works so you can see your score on the leaderboard once you are done playing.
- Wrapped the check to see if you've already played and the game building logic into functions so that the board isn't built if you've already played. Resulting in quicker page loads.
- Added the Game to Wisedocks