こんにちは。まっつんこと松藤です。このブログ記事はEclipseで編集しているのですが、やはりエディタとしての能力はEmacsと比べると見劣りしてしまいます。特にエディタの幅に合わせて、自動的に折り返してくれないのはツライorz ブログ記事の編集も普段エディタとして使用しているEmacsで行ってもいいのですが、そこはEclipse使いとして、Eclipseにこだわっていきたいと思います:-)

今回はSeasideでユーザ登録アプリケーションを実装していきます。まず最初にエントリポイントを登録するために http://localhost:8080/seaside/config にアクセスします。アクセスするにはユーザ名とパスワードが必要になります。手動でインストールした場合には、インストール時にユーザ名とパスワードを入力するのですが、今回は Seaside One-Click Experience 2.8.3 を使ったので、デフォルトで設定されているユーザ名 admin, パスワード seaside でログインします。

MATSUFUJI Hideharu
seaside-config.png

ページの中程にある Add entry pointNameregistration, TypeApplication で作成します。Add ボタンをクリックすると、次に使用するライブラリなどの構成を行うページが表示されます。ここでは構成項目のうち Root Component にカウンタアプリケーションの WACounter を選択しておきます。

これで http://localhost:8080/seaside/registration にアクセスするとカウンタアプリケーションが動作します。

続いてユーザ登録アプリケーションのためのコンポーネント WARegistration を作成します。システムブラウザで WACoutner を右クリックし、copy... を選択します。先ほどの構成ページにアクセスし、Root ComponentWARegistration に変更します。

copy.png

これで準備が整ったので、WARegistration コンポーネントを作っていきましょう。まずはアプリケーションで使用する変数の定義と初期化です。

currentState
    ^ currentState
firstName
    ^ firstName
lasName
    ^ lastName
initialize
    super initialize.
    currentState := 'DisplayForm'.
    firstName := nil.
    lastName := nil.

currentState は現在のステートを管理するために使います。次にディスプレイ(ビュー)を実装します。

renderContentOn: html
    html heading: 'User Name'.
    currentState = 'DisplayForm' ifTrue: [
        self renderDisplayForm: html.
    ].
    currentState = 'DisplayConfirmation' ifTrue: [
        self renderDisplayConfirmation: html.
    ].
    currentState = 'DisplayFinish' ifTrue: [
        self renderDisplayFinish: html.
    ].

Seasideではページを表示するために renderContentOn メソッドが呼び出されるので、その内部で各ステートにあったディスプレイ(ビュー)を表示するようにします。各ステートのディスプレイ(ビュー)を見てみましょう。

renderDisplayForm: html
    html form: [
        self renderValidationResultForFirstName: html.
        html text: 'First Name: '.
        html textInput
            value: firstName;
            callback: [:newValue | firstName := newValue].
        html break.
        self renderValidationResultForLastName: html.
        html text: 'Last Name: '.
        html textInput
            value: lastName;
            callback: [:newValue | lastName := newValue].
        html break.
        html submitButton
            callback: [ self validate ];
            with: 'confirm']
renderDisplayConfirmation: html
    html text: 'First Name: '.
    html text: firstName.
    html break.
    html text: 'Last Name: '.
    html text: lastName.
    html form: [
        html submitButton
            callback: [ self reedit ];
            with: 'reedit'.
        html submitButton
            callback: [ self register ];
            with: 'register'.]
renderDisplayFinish: html
    html text: 'Registration finished!'.

特に語ることがないぐらい見たままです。それぞれの submitButton に割り当てられているコールバックはPiece_Flowのactivityやactionなどに相当するものと考えていいでしょう。最後にコールバックで呼び出されているメソッドを見てみましょう。

validate
    firstName = '' | (lastName = '') ifTrue: [
        currentState := 'DisplayForm'.
    ] ifFalse: [
        currentState := 'DisplayConfirmation'.
    ]
register
    currentState := 'DisplayFinish'.
reedit
    currentState := 'DisplayForm'.

これも見たままですね。validate メソッドではバリデーションの結果によって遷移先のステートを変更しています。このあたりの書き方はPiece Frameworkではお馴染みですね。ただし、Piece_Flowでは開発者が直接ステートを変更することはなく、メソッドから適切なステートに遷移させるイベントを返す点がSeasideとは異なります。

今回はKahuaのときと違い、紆余曲折したところは書きませんでした。というのは、今回悩んだところはSmalltalkの構文であったり、Squeakの使い方であったり、Seasideとは関係のないところがほとんどだったからです。こういったプログラミング言語や環境の問題が解決してくると、初めて触るフレームワークであるにも関わらず、実装するべきメソッドをはっきりとイメージすることができました。

Seasideは完成度の高いフレームワークです。例えば、継続ひとつとってもSeasideでは開発者が意識することはほとんどありません。HTMLを内部DSLとして表現している点や、アクションやディスプレイ(ビュー)をコンポーネントとして管理する点など、部品化が最も進んでいるフレームワークのひとつと言えるのではないでしょうか。

今回でSeasideのユーザ登録アプリケーションの実装も終わりです。Kahua, Seasideと筆者にとって難易度の高いフレームワークが終わったので、これで一段落できるかな:-)

参考文献

トラックバック(0)
  • このブログ記事のトラックバックURL:
コメント