Dynamic Web Development with Seaside

16.4Adding Input

Now we will change our application so that we can enter numbers into the cells of the Sudoku grid. We define the method setCell:to: that changes the state of a cell and we extend the method renderCellContentAtRow:col:on: to use this new method.

WebSudoku>>setCell: aCurrentCell to: anInteger
sudoku atCell: aCurrentCell removeAllPossibilitiesBut: anInteger
WebSudoku>>renderCellContentAtRow: rowInteger col: colInteger on: html
| currentCell possibilities |
currentCell := MLCell row: rowInteger col: colInteger.
possibilities := sudoku possibilitiesAt: currentCell.
possibilities numberOfPossibilities = 1
ifTrue: [ ^ html text: possibilities asCompactString ].
html span
class: 'sudokuPossibilities';
with: possibilities asCompactString.
html break.
html form: [
html textInput
size: 2;
callback: [ :value |
| integerValue |
integerValue := value asInteger.
integerValue isNil ifFalse: [
(possibilities includes: integerValue)
ifTrue: [ self setCell: currentCell to: integerValue ] ] ] ]

The above code renders a text input box within a form tag, in each cell where there are more than one possibilities. Now you can type a value into the Sudoku grid and press return to save it, as seen in Figure 113. As you enter new values, you will see the possibilities for cells automatically be automatically reduced.

A partially filled Sudoku grid

Now we can also ask the Sudoku model to solve itself by modifying the method renderContentOn:. We first check whether the Sudoku grid is solved and if not, we add an anchor whose callback will solve the puzzle.

WebSudoku>>renderContentOn: html
html div id: 'sudokuBoard'; with: [
self renderBoardOn: html.
sudoku solved ifFalse: [
html break.
html anchor
callback: [ sudoku := sudoku solve ];
with: 'Solve' ] ]

Note that the solver uses backtracking, i.e., it finds a missing number by trying a possibility and if it fails to find a solution, it restarts with a different number. To backtrack the solver works on copies of the Sudoku grid, throwing away grids that don’t work and restarting. This is why we need to assign the result of sending the message solve since it returns a new Sudoku grid. Figure 114 shows the result of clicking on Solve.

A solved Sudoku grid

Copyright © 19 March 2024 Stéphane Ducasse, Lukas Renggli, C. David Shaffer, Rick Zaccone
This book is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 license.

This book is published using Seaside, Magritte and the Pier book publishing engine.