This sliding-puzzle started being an experiment to learn the basics of JavaFX. So the first version was desktop-only:
But at the same time I already had heard of Scala.js, so I took care to make the code modular, separating game-logic from the UI as much as possible.
During the last DevFest I tried to implement the Scala.js frontend in the course of one afternoon. I made some progress, but was not nearly finished.
- separating the image into tiles
- event-handling of mouse-clicks
- moving tiles with animation
- hiding/showing tiles with animation
- re-calculating the tiles upon puzzle-size change
But due to “lack of time” (actually, because of other projects) I left this for a while…
Connecting with Scala.js
I learned some valuable lessons along the way, like:
- about the jQuery and DOM wrappers for Scala.js
After some days of hard-work I finally arrived at a version I’m comfortable with:
You can try it out without downloading or installing anything right now, since I made an online demo available here:
Sliding-Puzzle Online Demo
And if you are curious about how it was done and how you can use Scala.js to build multi-platform code, or simply develop a browser-based application, you can take a look at the source-code here:
I hope this simple demo gives an idea of what is possible today by writing pure Scala.