グリッド(ヘックス、スクエア)表示ライブラリ

以前から公開していたヘックス表示ライブラリをバージョンアップしました。
ヘックス以外にスクエアグリッドの表示にも対応しました。
そのため、ライブラリのファイル名をHexSheet.js → GridMaker.jsに変更しています。
また、ヘックスとスクエアのグリッド表示のインターフェースを合わせるため、描画関数の名前も変更しました。

上記機能拡張に伴ってReplayFormatterでもスクエアグリッドの表示に対応しています。
スポンサーサイト

ReplayFormatterバージョンアップ

ReplayFormatterをバージョンアップしました。

・表に<th>のセルを設定できるようにしました。
・文中の強調表示を**文字列**、__文字列__、*文字列*、_文字列_で指定できるようにしました。
・#で始まる行をコメントとして扱うようにしました。
・セリフが@で始まる場合、特殊表記を無視してそのままセリフ欄に表示するようにしました。

ReplayFormatterバージョンアップ

また、ReplayFormatterをバージョンアップしました。
追加した機能は次の通りです。

・MarkDown風に表を記述できる
・MarkDown風に水平線を記述できる
・台詞欄に画像を表示できる
・台詞欄にハイパーリンクを設定できる

下の2つもMarkDown風にしようと思って一度実装したのですが、結局やめてJSON文字列で表現するようにしました。

リプレイ風解説をReplayFormatterで書き直し

『The Lunatic』リプレイ風解説を先日公開したReplayFormatterを使って書き直しました。
PDFよりも軽くなったし、見やすくなったと思います。
実際にReplayFormatterの書式で書いてみて、非常に容易に移行できたと感じました。特に、テキスト部分だけならアップロードとチェックまで含めても1時間かそこらしかかかっていないと思います。
戦闘中のマップなども思ったより簡単でした。一連の画像で最初の1枚さえできてしまえばテキストの編集だけなので、私の場合はWordでそれぞれに位置調整するよりも楽な部分が多かったです。
結局一番時間がかかったのは画像素材を作り直したりすることでした。

ちなみに、リプレイ風解説のページのコンテンツはAjaxで動的にリプレイのテキストを取得してページ選択されるごとに整形して出力しています。
もし、リプレイの連載なんかをするならかなり便利じゃないかと思います。


ReplayFormatterの方もバージョンアップしました。変更点は次の通りです。

・{"Cmd":"START"}を省略できる様にしました。
 リプレイの修正が終わってから思いついたので修正には役立ってくれませんでしたが、記述がさらに簡単になったはずです。書き忘れてちゃんと表示されないということも無くなりますし。

・エラーメッセージの表示
 テキストに間違いがあったら画面にエラーのあった箇所を表示する様にしました。

・テストページを作成
 これは機能追加ではありませんがテストページを作成しました。書いたテキストをコピペしたりして記述に間違いがないかをチェックできるのでそれなりに便利かも。


(メモ)
xmlHttpRequest()はChromeはローカルファイルにアクセスできないけど、Firefoxはできる。
ただし、ローカルファイルへのアクセスは(Macの場合だけかもしれないが)pathの大文字と小文字を区別しない。これで結構ハマった。
FirefoxにはタグのエレメントにinnerTextがない。仕方ないので、テキストの追加にはdocument.createTextNode()でテキストを追加する。

ReplayFormatterバージョンアップ

先日公開したTRPGリプレイをHTMLにフォーマットして表示するJavaScriptをバージョンアップしました。
『The Lunatic』の解説リプレイをReplayFormatterを使ってHTMLで表示するように書き直しているのですが、書いているうちに機能が足らないことに気づいて機能を追加しました。

一つはモンスターのように同じ画像を何個も表示する機能です。
PCを表示するコマンドだとIDが重複してしまうため同じ画像を使えないのと、同じ画像のためにそれぞれ同じsrcを指定しなければならないのが面倒なので、画像を1つだけ指定して複数表示位置(とID)を指定するコマンドを作りました。

もう一つは画像をオーバーレイする機能です。
ダンジョンのマップなどを見えている範囲だけ表示するために別々の画像を作成するのが嫌なので画像をオーバーレイして見えない範囲を隠せるようにしようというものでしたが、よくよく考えるとマップ上に宝箱とかを表示するのにも使えるので任意位置に任意サイズでオーバーレイできるようにしました。

(メモ)
divからはみ出した部分の制御はスタイルのoverflowでできる。
overflow: hidden;ではみ出した部分は表示されない。
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。