The first posts I wrote on this site and which were about p5.js applications are based on code that I wrote before creating the site. As I already hosted the applications on their own Github pages it was easier to simply have a link to these pages in the posts. For example check my cellular automata post.
Now that this site is created I wanted to see how I could integrate a p5.js application directly in its pages. This is now done with this simple minesweeper demo. It didn't required a lot of work other than adding a call to a cdn in the post source to get p5.js and updating my
.eleventy.js to add
.js files to the list of template files to compile.
For now I am happy with this test but there are still a few things I'd like to test:
interface.jswith some ugly functions to update the UI and send the data to the p5.js sketch
To create this first p5.js integrated demo I wanted something simple to code which I could have running pretty fast. Recreating a minesweeper has several advantages:
There are still a number of features I'd like to implement even in this squared grid minesweeper like having a deterministic grid (i.e. not having cases where the user has to choose a cell randomly), having cells with several mines to make it a bit harder to play, adding a zoom feature to be able to have larger grids or even creating an AI which would open the cases based on probabilities... But for now that's a nice little demo, even though I must admit that it was more fun to create it than to play with it (because personally I find minesweeper to be a terribly boring game!)