topページ

はじめに

　Javardry HTML5版 は、Java製のJavardryをHTML5（HTML5 + CSS + JavaScript）に移植したものです。JavaScript製なので、Jsardry2とでもすべきなのかもしれませんが、まあJavardryの移植なのでJavardry HTML5版としておきます。JavardryEditorでHTML5版用のゲームデータを書き出して利用します。Java版とほぼ同様の仕様ですが、多少の違いはあるため、以下で解説します。

動作環境・実行方法

　実行用のHTMLファイルをブラウザで読み込んで実行します。ローカル（オフライン）でもオンライン（ネット上にアップしたもの）でも動作しますが、ローカル動作時にはダンジョンの画像表示が行えないという制限を設けてあります（理由はこちら）。そのため、プレイ時にはオンライン動作（ローカルサーバでの動作を含む）をお薦めします。

PCのローカル環境で動作制限なしで動かす方法

　ローカル環境（ゲーム関係のデータをPC内に置いた状態）での実行時には、JavaScriptの仕様（クロスドメイン制約）により、読み込んだ画像ファイルに対して一部の画像処理が行えません。そのため、ローカル環境での実行で、かつ、実際に画像ファイルを読み込んでの一部の画像処理が行えない場合（内部的に実行して失敗した場合）には、「ダンジョンの画像表示不可」の制限を設けて動作させています。
　ただし、以下の二つの方法により、ローカル環境での動作であっても制限無しで動かすことが可能です。

コンソール

　HTML5版でもJava版と同様に、コンソールにてデバグコマンドの結果やエラー表示を確認出来ます。コンソール画面は、ブラウザにより表記は異なりますが、開発者ツール内で見ることが出来ます。開発者ツールは、ブラウザやそのバージョンによって違いはありますが、大体下記の場所にあります。

　開発者ツールを選択すると、こんな感じの画面が表示されます。これはChromeの画面ですが、他のブラウザでも大体似たような表示です。開発者ツールの初回起動時には大抵コンソール以外のネットワーク等のタブが選択されているようです。

　コンソールを選択してやれば、コンソール画面が表示されます。デバグコマンドの結果やエラー等はここに表示されます。

　主にChrome/Edgeでの動作時ですが、実行環境等により、動作に影響しない（もしくはローカル制限等で表示されてしまう）エラーや警告が出ることがあります。動作がおかしい、フリーズする等の明らかな異常がない限りは、その手のエラー・警告は無視して下さい。下記二つはその一例です。

　また、Chrome/Edgeでの動作時には、画像や音声ファイルが読み込めなかった旨の表記が大量にされるようです。

　こんな感じに、404 (Not Found) という表示がズラーっと続きます。音声ファイル等はまた若干異なる表示だったりもしますが、いずれもファイルが読み込めないという警告の表示です。これらも動作には影響しないので無視してもらってよいのですが、あまりに多いためにわずらわしいと感じる場合には下記の方法で非表示にして下さい。

　まず、右端にある設定ボタン（歯車マーク）から設定画面を開きます。

　「選択したコンテンツのみ」にチェックを入れます。

　すると、404 (Not Found) 関係の表記が消えます。すべての余計な表記が消えるというわけではありませんが、Chrome/Edgeを使用している場合には、これで大分見やすくなると思います。

操作方法

　操作はキーボードかゲームパッドで行います。Java版の操作方法とほぼ同様ですが、キー・ボタンの初期設定は config.js にて行います。また、ゲーム中に Option の Key Config にてキー・ボタンの設定を変更出来ます。キー・ボタンの識別名は Option の Keyname で確認して下さい。
　JoyToKey等を利用してゲームパッド操作を行う場合には、オプションで GamePad を off にして下さい。
　下記の実行用HTMLファイルの設定にてコントローラ部分を表示している場合には、マウス（クリック）・タッチ操作も可能です。マウス操作時の操作方法は見たまんまですが、ゲーム画面の一部がEscapeキーとデバグキー操作になっています。

実行用HTMLファイルの設定

　実行用HTMLファイルにて、いくつか設定が可能なので説明します。記述方法は、まあ見てもらえばわかると思います。

初期設定（config.js）

　初期設定、フォント指定、キー設定（キー初期設定）、呪文名指定はconfig.jsにまとめてあります。キー設定方法、呪文名指定方法はJava版と同様です。
　config.jsのファイル名を変更する場合は、実行用HTMLファイル内の記述の変更が必要ですので注意して下さい。

フォント指定

　フォントは config.js 内の Font にて指定します。Java版と同様に、等幅（固定幅）フォントでないと表示が崩れます。論理フォント名（monospaced）か、物理フォント名（MS Gothic, MS Mincho, IPAGothic, IPAMincho, VL Gothic 等）で指定して下さい。
　dataディレクトリ等に入れたフォントファイルを指定する場合には、Font の値は GameFont として下さい。そして、実行用HTMLファイル内のスタイルシート部分にて、Webフォントとしてフォントファイルを指定して下さい。フォントファイルはJava版での直接指定同様にTrueType（ttf）フォントでも構いませんが、サイズの小さいWeb Open Font Format（woff）がよいかと思います。
　スマホでプレイする際には、OSのバージョンにもよるのかもしれませんが、論理フォント名（monospaced）を指定しても等幅フォントが入っておらず、プロポーショナルフォントで表示されてしまうようです。そのため、スマホでの動作を想定するならば、フォントファイルを同梱し、そのファイルを直接指定した方が良さそうです。

Option

　プレイ中に音楽の on/off 等を変更出来ます。

顔画像

　冒険者用の顔画像は、Java版と同様にfaceディレクトリ内の冒険者と同名の画像ファイルが表示されますが、（ローカルサーバではない）オンライン動作時にはプレイユーザによる画像ファイル名の変更が困難なため、HTML5版では、ゲーム上で画像ファイルの指定を出来るようにしました。
　画像ファイルの指定は訓練場で行います。訓練場の「キャラクタを見る」で冒険者を選択し、「顔画像の設定」を選ぶとテキスト入力フィールドが表示されますので、画像ファイルのURLを（拡張子まで含めて）入れてEnterを押して下さい。未設定（従来通りfaceディレクトリ内の冒険者と同名の画像ファイル表示）の場合は "none" として下さい。
　画像ファイルは、例えば "http://hoge.example.ne.jp/hage/fuga.png" のようにhttpやhttpsから始まるURLで指定するか、もしくはゲームのアップされている同サーバ内の画像であれば "graphic/face/fighter.png" や "graphic/monster/Angel.png" といった形で指定出来ます。httpやhttpsから始まるURLで指定する場合は、いわゆる直リンになりますので、自分で直リン可のサーバにアップした画像か、直リンの許可を得ている画像を指定して下さい。

　プレイユーザの手間を省くために、予めfaceディレクトリ等にいくつかの顔画像をアップしておき、合わせてサムネイルとファイル名を示しておくというのも一つの手かもしれません。

セーブデータ

　HTML5版のセーブデータは、ローカルストレージに保存されます。そのため、ブラウザにより表記は異なりますが、閲覧履歴やcookie、サイトデータの削除を行うとセーブデータも削除されてしまいますので注意して下さい。プレイ中は、適当なタイミングでOptionにあるセーブデータのバックアップを行うことをおすすめします。
　訓練場が無人の状態（全冒険者を削除した状態）で、さらに「キャラクタを消す」コマンドを実行すると、データの初期化をすることが出来ます。その際には、ローカルストレージに保存されているセーブデータも削除され、次にセーブが行われるまではセーブデータが無い状態になります。ローカルストレージからJavardryのセーブデータだけを削除したい場合には活用して下さい。

その他、Java版との違い

配布方法

　「シナリオの公開」にてJava版について説明していますが、HTML5版もほぼ同様に考えて貰って構いません。
　HTML5版の場合、考えられる配布方法は以下の三つでしょうか。上二つはJava版と同様です。