2021/2/6 柿木 義一
Web上で将棋の棋譜や詰将棋の中継・再現を行う JavaScript アプリケーションです。
kj_free/kj_free.js | JavaScript アプリケーション |
kj_free/free_help.html | HELPファイル |
kj_free/*.gif, *.jpg, *.png | 画像 |
kj_free/*.mp3 | サウンド |
example_free.html | 使用例 |
henka.kif | 変化手順のある棋譜の例 |
no_henka.kif | 変化手順のない棋譜の例 |
tume.kif | 詰将棋の例 |
添付の example_free.html を元に、以下のように記述します。
文字コードは、UTF-8 とします。
<script language="javascript" type="text/javascript">
// 指定が必要
// kj_free.js のディレクトリィ:サーバ上の絶対位置、または、html ファイルからの相対位置
// 最後に/を付ける
const KJ_DIR = "/test_kakinoki/kj_free/"; // 絶対位置で指定
//const KJ_DIR = "./kj_free/"; // html のディレクトリィに kj_free/ がある場合
// 棋譜ファイル名:サーバ上の絶対位置、または、 html ファイルからの相対位置
const KIF_FILE_NAME = "henka.kif";
// const KJ_LEFT = true; // 左寄せ表示の場合、左端の // を削除
const UPDATE_TIME = 1; // 自動更新の初期設定 0:自動更新しない, 1:30秒毎
// ページを開いた時の手数指定
// const START_TESUU = 10; // 10手の局面を表示
// const START_TESUU = "LAST"; // 最終局面を表示
</script>
<!- kj._freejs をディレクトリィ付きで指定、サーバ上の絶対位置、または、 html ファイルからの相対位置 ->
<script src="/test_kakinoki/kj_free/kj_free.js"></script>
ブログ等、レイアウトが複雑な場合は、次のように div タグ(id="KJ_DIV")で囲むことが必要な場合があります。
<div id="KJ_DIV" style="width:580px;">
<script language="javascript" type="text/javascript">
// 指定が必要
// kj_free.js のディレクトリィ:サーバ上の絶対位置、または、html ファイルからの相対位置
// 最後に/を付ける
const KJ_DIR = "/test_kakinoki/kj_free/"; // 絶対位置で指定
//const KJ_DIR = "./kj_free/"; // html のディレクトリィに kj_free/ がある場合
// 棋譜ファイル名:サーバ上の絶対位置、または、 html ファイルからの相対位置
const KIF_FILE_NAME = "henka.kif";
// const KJ_LEFT = true; // 左寄せ表示の場合、左端の // を削除
const UPDATE_TIME = 1; // 自動更新の初期設定 0:自動更新しない, 1:30秒毎
// ページを開いた時の手数指定
// const START_TESUU = 10; // 10手の局面を表示
// const START_TESUU = "LAST"; // 最終局面を表示
</script>
<!- kj._freejs をディレクトリィ付きで指定、サーバ上の絶対位置、または、 html ファイルからの相対位置 ->
<script src="/test_kakinoki/kj_free/kj_free.js"></script>
</div>
機能 | パラメータ | 説明 |
---|---|---|
kj_free/ のディレクトリ | const KJ_DIR = "ディレクトリ/kj_free/"; | kj_free/ のディレクトリ |
左寄せ | const KJ_LEFT = true; | 左の記述で、盤面を左寄せで表示する。 左の記述が無い場合、中央に表示する(false)。 |
棋譜ファイル名 | const KIF_FILE_NAME = "(棋譜ファイル名)"; | 棋譜ファイル名 HTMLファイルのあるディレクトリからの相対表現とします。 http: での指定もできます。 棋譜ファイルとHTMLファイルは同じサーバにある必要があります。 拡張子が .kifu なら、文字コードをUTF-8 とします。Unicode の文字でコメント等を書くことができます。Kifu for Windows は、V7以降を使います。 |
開始手数 | const START_TESUU=(手数) | ページを開いたとき、指定手数の局面を表示します。 (手数)は半角数字、"LAST"で最終局面 指定しないとき、終局していれば、初期局面、それ以外では最終局局面を表示します。 |
自動更新 | const UPDATE_TIME = 1; 30秒毎に自動更新する UPDATE_TIME=2; 60秒毎に自動更新する UPDATE_TIME=3; 3分毎に自動更新する UPDATE_TIME=0; 自動更新メニューを表示しますが、自動更新はしません。 |
一定時間毎に棋譜ファイルを読み込み、最新の棋譜を表示する自動更新機能です。 対局の中継等で使用します。 UPDATE_TIMEの記述がないとき、自動更新の選択を表示しません。 ※UPDATE_TIME を記述すると、自動更新設定の選択を表示します。また、START_TESUU の指定がないとき、自動更新時、最終局面を表示します。 |
コメント行数 | comment_line=(行数) (行数) は半角数字→未実装 |
コメント行数を指定します。 0だと、コメントを表示しません。 指定なしは、7行となります。 |
30秒毎に自動更新、自動更新設定メニュー表示、最終局面表示
<script language="javascript" type="text/javascript">
const KJ_DIR = "/test_kakinoki/kj_free/"; // kj_free.js のディレクトリィ
const KIF_FILE_NAME = "joryu_ouza202005160101.kif"; // 棋譜ファイル
const UPDATE_TIME = 1; // 自動更新 30秒毎
</script>
<script src="/test_kakinoki/kj_free/kj_free.js"></script>
棋譜ファイルは、フリーソフトの Kifu for Windows、または、柿木将棋等で作成できます。
拡張子が .kif は、SHIFT JIS の文字コードです。
拡張子が .kifu は、UTF-8 の文字コードです。
チェスクロック使用かストップウォッチかは、消費時間から自動判別します。秒の単位の時間があれば、チェスクロックとし、秒単位で時間を表示します。
平手の初期配置から始まる CSA 形式の棋譜も読めます(読めない場合もあります)。
右上の欄には、次の情報を表示します。
開始日時
棋戦名
場所
持ち時間
手合割 (駒落ちの場合)
棋譜に詰将棋情報の「作者」が設定されているとき、次の情報を表示します。
作者
作品名
出典 or 発表誌
発表年月
持ち駒制限(持ち駒制限時)→未実装
残り時間を表示するためには、棋譜ファイルの棋譜情報で、「持ち時間」を設定する必要があります。
持ち時間は、全角(または半角で)で「N時間」と記述します。分がある場合は、半角2桁で「NN分」と記述します。
「各*時間」という書き方にも対応しています。
棋譜の指し手に消費時間が記録されているとき、各指し手の消費時間から残り時間を計算し、表示します。
チェスクロック使用かストップウォッチかは、消費時間から自動判別します。秒の単位の時間があれば、チェスクロックとし、秒単位で時間を表示します。消費時間のグラフは分単位で表示します。
棋譜の指し手に消費時間が記録されていないとき(すべての指し手の時間が0の場合)、棋譜情報の「消費時間」の情報から、手数と残り時間を表示します。
消費時間は、次の形式で記述します。
手数▲先手の消費時間(分)△後手の消費時間(分)
※いずれも半角の数字を使います。
例:
---------- 棋譜ファイル --------------
消費時間:159▲347△359
持ち時間:4時間06分
-----------------------------------
コメントに※(感想)があるとき、棋譜の * を # と表示します。
URL をリンクにします。
コメントに HTML のサブセットが使えます。例えば、次が使えます
<FONT color="#ff0000">赤</FONT>
<B>ボールド</B>
スタイルシート(CSS)によって、表示を変更できます。
canvas {
background: #ECECEC !important;
}
エラー等は、ブラウザのコンソールに表示されます。
本アプリケーションをバージョンアップし、サーバ上の JavaScript を更新したとき、ブラウザを再起動しないと反映されません。
ブラウザのキャッシュを削除しないと、それが反映されない場合があります。
FireFox3.0なら、次の操作でキャッシュを削除できます。