SquareSlider is a framework for modular robot reconfiguration in the sliding square model. It lets you build a configuration and then apply reconfiguration algorithms to it. Detailed usage information is available via the Help & Tutorial button 
.
The textbox below contains a JSON representation of your drawing. You can copy and save it, so you can load it again later. To load a saved JSON string, paste it in the textbox below (replacing the existing contents) and click Load.
Paste the text below into Ipe.
This is the web-based interface for SquareSlider, a framework for modular robot reconfiguration in the sliding square model.
In the lower toolbar the following tools are available for drawing an input configuration:
: Pan the canvas around. Click anywhere and drag the canvas to the desired position.
: Select a square. Click once on a square to select it. Hold the Ctrl key and click to add a square to the selection.
: Click on an empty grid cell to insert a square in that location, and drag to other empty cells to insert squares in those locations as well. Click on an existing square to delete it, and drag to other squares to also delete those squares. The first click determines the mode of the dragging afterwards.
: Changes the color of the selected square(s) (cycles through six available colors). Colors do not influence the algorithm, but can be helpful to identify where certain parts of the input configuration end up while the algorithm is running.
: Deletes the selected square(s).
: Opens a dialog that allows you to save your configuration to a JSON string, or load a configuration from a JSON string you saved earlier.
The upper tool shows the selected reconfiguration algorithm. Clicking on the name of the currently selected algorithm opens a drop-down menu to select one of the following algorithms:
Gather & Compact: The main algorithm presented in this paper. It consists of two phases, which can also be executed separately. The resulting configuration is an xy-monotone configuration in the bottom left corner of the bounding box of the configuration at the start.
Gather: A reconfiguration algorithm that ensures that almost all squares become part of (roughly) 2-connected components.
Compact: A reconfiguration algorithm that pushes squares to the bottom left corner of the bounding box of the configuration, to form an xy-monotone configuration. This algorithm should be preceded by Gather to ensure that it functions as intended. Running Gather&Compact is therefore advised.
Custom move sequence: When this reconfiguration algorithm is run, you will be prompted to provide a sequence of moves to be animated. The sequence of moves should be provided in the form of a string, containing a JSON array of the following format: {[x1,y1,x2,y2], ...}.
The upper toolbar also provides tools for animating reconfiguration algorithms:
: Starts the animation of the selected reconfiguration algorithm on the input configuration. While an algorithm is running, the lower toolbar will show the number of performed steps and details on the current step. You can pause the animation using 
, and slow it down or speed it up in the lower toolbar using 
or 
respectively.
: Performs a single step of the selected reconfiguration algorithm.
: Resets the configuration back to the state before starting a reconfiguration algorithm. This also resets the lower toolbar to show configuration editing tools.
: Toggles the marks that show connectivity information, see below for more information.
The lower toolbar provides an overview of an ongoing animation, by showing how many moves have been executed, as well as information about the current phase of the algorithm and the currently animated move. The following tools are provided to customize the animation:
: Decreases the speed of the animation.
: Increases the speed of the animation.
We allow for the visualization of the connectivity information used in our paper. Firstly, a square has a filled (blue or red) mark if it can perform moves without disconnecting the configuration, while a non-filled mark indicates that moving the square disconnects the configuration (i.e., this square forms a cut vertex in the adjacency graph of the configuration). Secondly, the color and shape of the marks indicates a partitioning of the configuration into (roughly) 2-connected components. Blue square marks indicate squares in a chunk, a variant of a 2-connected component defined in our paper. Specifically, a chunk is defined by an inclusion-maximal cycle C along with all its degree-1 neighbors and any squares inside C. Red circle marks indicate squares that are not part of a chunk. A special crossed mark shows where components connect to each other.