はじめてのフラグ
東京経済大学のおみぬーです。
今回は以下のマップの人型アイコンにイベントの詳細を書き込んでいきます。
こちらがこのマップのコードになります。
var map5 = [
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 09, 09, 09, 08, 09, 09, 09, 08, 94, 08, 09, 09, 09, 09, 09, 09, 09, 09, 08],
[08, 09, 08, 09, 08, 09, 08, 09, 08, 09, 08, 09, 08, 08, 08, 08, 08, 08, 09, 08],
[08, 09, 08, 09, 08, 09, 08, 09, 08, 09, 08, 09, 09, 09, 09, 09, 09, 08, 09, 08],
[08, 09, 08, 09, 08, 09, 08, 09, 08, 09, 08, 08, 08, 08, 08, 08, 09, 08, 09, 08],
[08, 09, 08, 09, 08, 09, 08, 09, 09, 09, 08, 09, 09, 09, 09, 09, 09, 08, 09, 08],
[08, 09, 08, 09, 08, 09, 08, 08, 08, 08, 08, 09, 08, 08, 08, 08, 08, 08, 09, 08],
[08, 09, 08, 09, 09, 09, 09, 09, 09, 93, 08, 09, 09, 09, 09, 09, 09, 08, 09, 08],
[08, 09, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 09, 08],
[08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 10, 08, 08, 08, 08, 08, 08, 08],
まず画面上部の人型アイコン、コードでいうと94のイベントの詳細を書き込みます。94のイベントはフラグ3を回収後コメントが変わりバッドエンドになるコードを書き込みたいと思います。
フラグ3は改造前から存在するフラグで、主人公の姿が変わるというものです。既存のコードのため今回はフラグ3の詳細は省略させていただきます。
以下が94のコード詳細になります。
case 94:
if(flag1==true && flag2==true && flag3==true) {
gc.fillText("勇者「もしやお前は魔物か!!", 250, 200);
gc.fillText("成敗してやる!!」", 285, 230);
setTimeout(badendpaint, 3000);
}
else {
gc.fillText("勇者「むむ 魔物か!", 250, 200);
gc.fillText("しかし 敵意を感じないな、、、", 285, 230);
gc.fillText("ならば見逃してやろう", 285, 260);
gc.fillText("去るがいい!!」", 285, 290);
}
break;
コードの上部はフラグ1~3を回収した状態で起こるイベントを設定しています。また、setTimeoutでbadendpaintを呼び出しています。badendpaintのコードは以下になります。
function badendpaint() {
window.removeEventListener("keydown", fieldkeydown);
gc.fillStyle = "Black";
gc.fillRect(200, 20, 400, 400);
gc.fillStyle = "White";
gc.fillRect(350, 50, 100, 100);
gc.drawImage(imgSlime, 350, 50, 100, 100);
gc.fillStyle = "White";
gc.font = "24px serif";
gc.fillText("BAD END", 340, 200);
}
表示される画面が以下の通りです。
94のコード下部ではフラグ1~3を回収していない状態で起こるイベントを設定しています。以下が表示される画面になります。
今回は94のイベントの詳細を設定していきました。次回は93のイベントの設定から再開していきたいと考えています。
参考文献
田中賢一郎『ゲームで学ぶJavaScript 入門』インプレス,2015年
田中賢一郎『ゲームで作りながら楽しく学べる HTML5+CSS+JavaScript』インプレス,2017年
田中賢一郎『ゲームで学ぶJavaScript 入門 増補改訂版~ブラウザゲームづくりでHTML&CSSも身につく!』インプレス,2022年