Emoji CSS Sudoku
Output Readme Download Replit Sel. & Copy Full

About

Create a sudoku game that is just one HTML/CSS file.

To view this on TripleLog, click here.

HTML

The index.html file is a generated file, so don't change it (any changes will be overwritten when you run script.js). Modify the template.html file.

CSS

A lot of CSS to run the game is included in the generated HTML file. Modify the style.css file to change the styling.

JavaScript

The script.js file generates the static file. You will need the nunjucks module and then just run node script.js to generate the index.html file.

You can display emojis or letters instead of digits by creating an array with the appropriate number of characters. You can also create sudoku puzzles of any size by setting the x and y values in script.js (as long as each side is at least 2): 2x2, 2x3, 3x3, 2x5, or theoretically anything else. Larger puzzles (4x4 and up) will be slow and large.

It converts sudoku puzzle string into the game. The string is xyxy characters with xy characters for the first row from left to right, then x*y for the second row, etc... Empty cells are represented by "."

You can modify the logic to accept different formats if needed.

This version of the script includes four not-necessary features that are nice to have. The numbers given from the start are bolded and should be impossible to erase. Any illegal moves (2 of the same number in a row, column, or 3x3 block) are blocked. Once all 9 of a given number have placed in the puzzle, that number in the selection bar at the top will be greyed out. Once the player has completed the puzzle, a message appears.