JavaScriptによるアドベンチャー系ゲームエンジン開発。マップ上へのイベントの配置に続いて、実際にマップ上に配置したイベントにスクリプトを設定し、処理してみましょう。

今回のスクリプトは

コマンド(引数)

というコマンド文を一行に一つずつ並べる形にします。一応、先頭と末尾にある空白やタブは無視し行頭の//以下はコメントとみなすような処理も入れて、多少なりとも見やすいソースを書けるようにしたつもりです。

とりあえず、コマンドとして

message(メッセージ表示)
select(選択ダイアログ表示)
showImage(画像表示)

を用意し、マップ上のイベントにスクリプトを追加してみました。今回は、変数や制御構文を実装していないので、選択ダイアログは選択結果を使うことができず無意味ですが。

スクリプトの処理では、まずスクリプトの文字列からコマンドと引数の組を一つずつコマンド情報オブジェクトとして取得し、順次実行しています。

JavaScriptには、指定文字列で文字列の分離を行うsplitを始め文字列処理の機能が充実している(正規表現もある)ので、構文解析の処理を書くのは楽ですね。

イベント処理中には、ウインドウ表示中、リターンキー待機など現在の状態に応じた処理を行って、イベントが終了したら通常のゲーム状態に戻すようにしました。このあたりのイベント処理の状態遷移は、eventProcess/eventProcessStageといった変数で管理しています。

テストイベント(右側人物)のスクリプトは、以下のようになっています。

message("選択ダイアログ表示テスト")
select("選択肢1	選択肢2	選択肢3	選択肢4")
message("画像表示テスト")
showImage("mapevs.jpg")

実行画面(下の開始ボタンで開始。Canvas対応ブラウザが必要です)

ソース(JavaScript、UTF-8)

カーソルキーでキャラクタを移動させ、上の方のキャラクタに接触してみてください。イベントが発動し、メッセージ表示ウインドウや選択ダイアログ、画像が表示されます。

ウインドウや画像は、リターンキーで進めたり消したりしてください。


創作プログラミングの街 > ゲーム開発室 > Webゲーム開発室