Rate Maze with Lightning Component

Implementation of Rat Maze with the combination of lightning custom component and apex controller.

Hope you all are good! Had spare time to just play around lightning stuff. We all played the rat maze to find shortest path between two points. Thought lets give a try to build a component and check what challenges need to face.

Rat Maze

So here I build a lightning component with the help of apex controller.

Challenges Faced:

  • Maximum stack depth reached (1001) : Due to recursive call of apex method. This is the main reason to limit the maze dimensions max to 9 * 9. We can avoid this by building an application in Java or Python by hosting it on Heroku.
  • Designing Maze Grid : Used HTML table to build the maze dynamically as per the input number of rows and columns provided by user.
  • Dynamic binding of on click function : Used data attributes to hold X and Y coordinates of cell, with the help of event parameter in controller, fetched coordinates of clicked cell.
  • Algorithm to find optimal path between two points.

Alternate Approach:

The logic of finding path can be written in JavaScript file which can be hosted as static resource. By wiring browser Window object with JavaScript functions, the methods can be called from lightning controller or helper.

Want to try out? Here I have made package to try out:

  • Download and install the package in your org: https://sforce.co/2JKDVTE
  • Drag and drop lightning component “Maze” on home page using lightning page builder.

Steps to play:

  • Set number of rows and columns for your maze. Maximum size of maze is 9 * 9, there are some scenarios where it will fail to calculate path due to Salesforce limitations (Stack size crossing 1001 due to recursion)
Dimensions of maze
  • Click on any square to set stating point.
Set starting point
  • Select any square to set finishing point.
Set finishing point
  • Select as many as obstacles.
Set Obstacles
  • It will show the optimal path, if not it will display alert.
Final path

Git Repository:

https://github.com/SFDCDevs/Salesforce-Maze-Solver