In this video of chapter 7 of “Learning Web Development with Seaside” we look at continuations and subroutine calls.

We launch the Seaside One-Click Experience and create a new component that will present a user interface for selecting a date and time. Add an initialize method to create subcomponents for the date selector and the time selector. Add the #’children’ method to let Seaside know about the subcomponents. Add a setter method to assign initial values to the selection components.

As mentioned earlier, the #’renderContentOn:’ method is the heart of Seaside’s HTML generation. In our new component we will define a form and a table to provide layout (proper CSS formatting will be addressed in a later chapter). The form will consist of labels, the date selector, the time selector, and a submit button. Note that we do not specify the actual HTML widgets to be used for the date and time entry, but allow subcomponents to provide that functionality. This demonstrates code and component reuse.

Finally, we add a #’submit’ method to handle the callback when the user selects a date/time. Note that when the user makes a selection, the #’submit’ method answers the new value. This answer is essentially a subroutine return.

We now have defined the code for a new component. To demonstrate the component, we can register it as an application named ‘when’ and then view the component in a web browser. It will, of course, be more useful to use this component in our FlightInfo application.

To do that we go to the FlightInfoComponent class and add a method to call our new component. When this method is called, it creates a new component, sets the date/time to the current value, and then calls the new component. The new component presents a web page, waits for the user to select a new date/time, and then returns that date/time.

The important thing to note here is that we have called a subroutine and are waiting for it to return from an interaction with the user. This ability to continue execution after a user interaction is what we get from a using a Smalltalk continuation and it is a striking departure from the typical web framework in which execution starts at the beginning for each request.

Now that we have a method to call the date/time selection component, we add a link to the primary user interface to call the new component. We have an anchor with a callback.

We can go to the web browser and view the new component in action. Note that we can select a new date/time and when we return to the primary component, it will be immediately displayed.

when we are done, we can save our Smalltalk code and quit the Seaside One-Click Experience application.

Advertisements