Seaside Tutorial
Outline
●
●
●
●
Focus on components
Rendering basics
Rendering anchors with callbacks (next,
previous)
Call: of a built-in component (call the
STSDateSelectorDialog)
Component Rendering
●
Seaside components:
–
–
–
Subclass WAComponent
Implement #renderContentOn:
Argument is “renderer” (WAHtmlRenderer
instance)
Example
renderContentOn: html
html paragraph: 'This is a paragraph'.
html unorderedList:
[html listItem: 'Item 1'.
html listItem: 'Item 2'.
html listItem: 'Item 3'].
Calendar
●
●
●
Browse WAHtmlRenderer and especially
superclass
Complete STSCalendar
Demo
Anchors and callbacks
●
●
Method #anchorWithAction:text: takes
block and invokes it in response to following
anchor
Render loop (so far):
–
–
Handle callbacks
Render component
renderContentOn: html
html
anchorWithAction: [self doSomething]
text: 'Do something'
Anchors and callbacks
●
Add “next” and “previous” buttons to calendar
Tasks and sequencing
●
WAComponent>>#call:
–
●
Displays argument
WAComponent>>#answer:
–
–
Returns from call:
Argument is return value of call:
Tasks
●
●
●
Components whose primary responsibility are
sequencing
Subclass WATask and override #go
Complete ReservationTask:
–
–
Create and call: a STSDateSelectorDialog
demo
Calendar should answer
●
●
Modify STSCalendar so that it answers
when user clicks date.
Change ReservationTask so that it uses
your calendar
Embedding components
●
One component can nest other components:
–
–
–
Create child components in #initialize
Answer child components array in #children
Send “html render: child” in renderContentOn:
Catching answer
●
●
In some cases parent component needs to
“catch” answer of subcomponent.
Use #onAnswer:
initialize
super initialize.
startDateSelector := STSCalendar new.
endDateSelector := STSCalendar new.
startDateSelector onAnswer: [:v | self updateArrival: v].
endDateSelector onAnswer: [:v | self updateDeparture: v].
children
^ Array with: startDateSelector with: endDateSelector
renderContentOn: html
“.... omitted code for form and button ....”
html table:
[html tableHeadings: #('Arrival Date' 'Departure Date').
html
tableRowWith: [html render: startDateSelector]
with: [html render: endDateSelector]].
Task: Guessing game step 1
●
●
●
●
Your image STSGuessingGame
Subclass WATask
Use #inform: and #request: to display
messages and get input
Demo
Task: Guessing game step 2
●
●
●
Add counter for “number of tries”
Try both method-local variable and i-var
Compare behavior of above when using
“back” button
Task: Guessing game step 2
●
●
Seaside's use of continuations captures
values of method-local variables (back button
“backs them up”) but not i-vars
Add #initialize
initialize
super initialize.
self session registerObjectForBacktracking: self.
Snapshotting
●
Objects registered for backtracking are sent
#snapshot
–
●
Default impl is shallowCopy
Restoring snapshot done with
#restoreFromSnapshot: