This website uses cookies to obtain statistics from users navigation. If you go on browsing we consider you accept them.

Sliding Puzzle

Sliding Puzzle

App built with Ionic Framework and Angular.js that implements this popular and challenging puzzle. It allows you to play in two different modes, Basic with a partition of 8 pieces (3x3) and Hard, with a 15 pieces puzzle.

It is tested on Android, providing a native-like experience only using HTML5, making it easier for a developer used to Web technologies.

Regarding the code, you can have a look at it in its Github repository. Among Ionic built-in services, the app uses its own services, using dependency injection to properly encapsulate the different functionalities.

The most remarkable features implemented are encapsulated in the following services.

  • ImageCropper: using a canvas to create the cropped images and caching them to avoid redoing costly operations.
  • PuzzleManager, a service that knows which puzzles and levels are locked or available.
  • PuzzleMatrix, which holds all the puzzle matrix related logic, like knowing if the user has completed it or creating a solvable combination.

Due to this is not a difficult problem, the way the project is organized is an app.js file where routes are initialized, a controllers.js file with all the controllers and the services.js file, where all the encapsulated services are located.