新時代のソーサリアンを提案する

30周年を越えたソーサリアンの夢と妄想を語り続ける

ソーサリアンText 開発者向けマニュアル(環境準備編)

ソーサリアンTextの開発は(a)Playgroundを利用する、(b)ローカルにサーバーを準備する、のいずれかで進められます。

Playgroundを利用する

Playgroundは、ブラウザー上で動作するシナリオ実行環境です。

ソフトウェアのインストールなどが不要なので、手軽に実行できるのが特徴です。一部の機能には非対応*1ですが、それでも本番環境に限りなく近い機能をサポートしているので、シナリオの動作確認に活用ください。

[1]Playgroundにアクセスする

Playgroundには、以下のアドレスからアクセスできます。

http://www.web-deli.com/sorcerian/next/playground.aspx
   ▼
http://www.web-deli.com/sorcerian/next/images_blog/gbat_play.png

[2]シナリオデータを入力する

シナリオデータは、左ペインのエディターから入力できます。一から入力しても構いませんが、選択ボックス[テンプレートを選択]からテンプレートを引用するのが簡単です。

  • 空のテンプレート:最低限の骨組みとコード例(コメント)だけが用意されています
  • サンプルシナリオ:最低限動作するミニシナリオが組み込まれたテンプレートです
  • 機能テストデータ:主な機能を組み込んだ動作テストデータです
  • マイストレージ:過去に保存したデータを呼び出します(編集中のシナリオは[ストレージに保存]からブラウザーに保存できます)

また、GBAT(http://d.hatena.ne.jp/sorcerian/20180131)で作成した.gbatファイルをインポートすることもできます。これには、ページ左上の[ファイル選択]ボタンを押して、表示されたファイル選択ボックスから.gbatファイルを選択、[開く]ボタンをクリックしてください。エディターにSText変換済みのシナリオデータが反映されます。

http://www.web-deli.com/sorcerian/next/images_blog/gbat_play2.png

[3]エディター上でシナリオを編集する

シナリオデータは、エディター上で直接編集することもできます。以下に、エディターの主な機能をまとめておきます。

●a)構文ハイライト機能
ページ左上の[構文ハイライト]を選択すると、MarkdownXmlいずれかのハイライト機能を切り替えできます(既定はMarkdownですが、Xmlもそれなりにハイライトされています^^;)。

ただし、Xmlを選択すると、タグの折り畳みが可能となり、また、タグの閉じ忘れやクォートの忘れ、全角/半角の間違いなど、基本的なマークアップの問題点を指摘してくれるので、タグをいじる場合にはXmlを選択しておくのがお勧めです。

http://www.web-deli.com/sorcerian/next/images_blog/gbat_play5.png

●b)スキーマ検証
ただし、(a)で指摘してくれるのは、あくまでXmlの一般的な構文エラーだけです。SText固有の要素/属性が正しいかをチェックするには、ページ左上の[スキーマ検証]ボタンをクリックしてください(この機能は、Internet Explorer 11でのみ動作します)。

http://www.web-deli.com/sorcerian/next/images_blog/gbat_play6.png

●c)シーン追加
エディターでの現在のカーソル位置に対して、シーン情報(scene要素)を追加します。本格的なシナリオ編集にはGBATを推奨しますが、Playground上で動作を確認したい、という場合には、この機能を利用することで、Xmlをさほど意識せずともシーンを追加できます。

http://www.web-deli.com/sorcerian/next/images_blog/gbat_play7.png

●d)ダウンロード
Playgroundで編集したシナリオは、[ダウンロード]ボタンでローカル環境にファイルとして保存することもできます(ファイル名はscenario.xmlです)。
※ただし、本機能はChrome、Edge、Firefox環境での利用に限られますので、注意してください。

[4]シナリオを実行する

左エディターでシナリオを準備できたら、あとは[シナリオ実行]ボタンを押すだけです。右ペインから、シナリオをテストプレイできます。

http://www.web-deli.com/sorcerian/next/images_blog/gbat_play3.png

二度目以降の実行では[続きから開始しますか?]と聞かれますが、[キャンセル]して、最初から実行するようにしてください。

■Note■
Playgroundで開発される方も、以下「ローカルにサーバーを導入する」の手順[2]に沿って、サンプルシナリオをダウンロードしておくことをお勧めします。

/stext-master/stextフォルダー配下に、/scepter(新・消えた王様の杖)をはじめとしたサンプルシナリオが用意されています。シナリオ開発には、まずはこれらのシナリオを確認してみるのが手っ取り早いでしょう。

また、Playgroundの上部リンクから、シナリオデータのテンプレート(骨組みだけのもの)をダウンロードすることもできます。

[5]デバッグモードを利用する

Playgroundでは、既定でデバッグモードが有効になっています。デバッグモードでは、シナリオ実行領域の上部にデバッグウィンドウが追加されます。

http://www.web-deli.com/sorcerian/next/images_blog/gbat_play4.png

以下の情報を入力して[Reload]ボタンをクリックすることで、指定のシーンに強制的に移動できます。デバッグの効率化にご利用ください。

  • Scene:移動したいシーン番号
  • Items:所有しているアイテム番号(カンマ区切り)
  • Flags:所有しているフラグ(カンマ区切り)

また、デバッグモードが有効になっている場合、シーンでのアイテム/フラグ(scene要素のitems/flagsなど)が、シナリオ定義(items/flags要素)と対応関係にあるかを自動でチェックします。問題がある場合には、シナリオ開始時にエラーを通知します。

http://www.web-deli.com/sorcerian/next/images_blog/gbat_play8.png

Playgroundの制約

冒頭触れたように、Playgroundにはいくつか機能上の制約があります。あくまで、シナリオ本文の動作確認を主目的としたツールなので、ご了承ください。

  • BGMはSText標準のものだけ再生可能
    • シナリオ単位に用意したBGMには非対応
  • 画像は標準で用意されたstext.png、dsc.jpgのみ表示可(あくまで動作確認用です)

BGM/楽曲については、Playground上からサーバーへのファイルアップロードを認めていないため、このような挙動となります。
その他、細かな制約があるかもしれないので、お気づきの点はご連絡ください。

ローカルにサーバーを導入する

ローカル環境に、Apache Http Server(以下、Apache)などのサーバー環境を準備することで、オフラインでソーサリアンTextを動作できます(.htmlファイルをエクスプローラーから直接起動しても動作しないので、注意です)。

サーバーインストールの手間はありますが、手元で編集したシナリオをそのまま実行できますし、ソーサリアンTextのすべての機能をサポートしています。

[1]サーバーの準備

Apacheは、XAMPPというソフトでインストールするのが簡単です。
詳しいインストール方法は、以下のページなどを参照してください(ちょっと古いかも)。
http://www.wings.msn.to/index.php/-/B-08/php_win_xampp/

[2]ソースコードのダウンロード

ソースコードは、GitHubからダウンロードしてください。
https://github.com/snext1220/stext
右上の[Clone or download]−[Download ZIP]でダウンロードできます。

解凍すると、/stext-masterというフォルダーができるので、フォルダーごと「C:\xampp\htdocs」に移動します。

[3]サンプルの実行

あとは、Apacheが起動していることを確認した上で、以下のアドレスからアクセスできます(表示するシナリオは、上部の選択ボックスから選択できます)。
http://localhost/stext-master/

http://www.web-deli.com/sorcerian/next/images_blog/stext_d_local.png

■Note■
ローカル環境でも、デバッグモードを利用できます。デバッグモードについては、Playgroundの解説を合わせて参照してください。

[4]作成したシナリオを配置する

ローカル環境でシナリオの動作を確認する場合には、シナリオのトップフォルダーの名前を「test」とした上で、/stextフォルダー直下にコピーしてください。あとは、トップページの選択ボックスから[テストシナリオ]を選択することで、シナリオを起動できます。

http://www.web-deli.com/sorcerian/next/images_blog/stext_d_test.png

*1:詳細は、以下の「Playgroundの制約」を参照してください。