SWIsland Recursion Saga

Every island starts somewhere. Stage 1 is that starting point for the SWIsland Recursion Saga: click anywhere on the ocean grid and a single warm-orange tile snaps into place — nothing more. No growth, no neighbors, no recursion yet. Just the question: what is the minimum structure needed to place a land cell on the ocean?

Big Picture — What This Stage Establishes

The answer turns out to be three things working together:

1. An ocean grid (SWGrid) — The canvas is divided into a 20×30 tile grid (20 rows, 30 columns), matching the NUMROWS and NUMCOLS constants in the Java RecursiveIslandDriver. All island positions are expressed in grid-cell addresses, not pixels, so the coordinate system mirrors the 2D array used in the Java code exactly.
2. A (row, col) address system — Each land cell is tagged with a Java-convention grid address: row 0 is the top row, increasing downward; col 0 is the leftmost column, increasing rightward. This directly parallels the Coordinates class in the Java source. The address is displayed inside each tile so you can verify the mapping at a glance.
3. A visual tile (SWSquare) — Each land cell is rendered as an SWSquare sized to fill exactly one grid cell, filled with islandSeedColor (a warm orange) and outlined in brown. The square's center is stored in user coordinates; drawOnGrid(grid) converts it to screen pixels at draw time, so the tile stays correctly placed even when the canvas is resized.

The Java Connection

This stage is designed to mirror the data structures from the APCS-A Java project:

• Coordinates(row, col) in Java → the { row, col, square } object stored in the islandCells array in JavaScript.
• island.getCells() in Java (an ArrayList<Coordinates>) → the islandCells[] array here.
• In Stage 1 that array always has exactly one element — just as a newly constructed Java Island is seeded with a single start cell before grow() is called.

There is no SWIsland class yet. The island is represented directly as a plain JavaScript array. A dedicated class will be introduced once the growth algorithm is in place.

What to Notice in the Sketch

• Each click clears the previous island and starts a new one at the clicked cell — mirroring the “place one island at a time” loop in RecursiveIslandDriver.main().
• The tile snaps to the grid regardless of where exactly you click inside a cell — this is the JS equivalent of Java's integer-division cell lookup.
• The row,col label inside the tile uses row 0 at the top, so clicking near the top-left corner should show 0,0.
• The grid lines come from SWGrid — they are not drawn manually. The grid also handles the y-axis inversion between screen pixels and user coordinates.

The Road Ahead

Stage 1 → one cell placed on click.
Stage 2 → grow the island to multiple cells using recursive backtracking (JS port of Island.grow()).
Stage 3 → animate the growth step-by-step so each cell appears one at a time.
Stage 4 → enforce the “no diagonal touching between islands” separation rule.
Later → introduce a SWIsland class to encapsulate the data and drawing logic.