ミサイルなんとか 📖

その昔ゲームセンターにあった、ミサイルコマンドっぽいなにかです。３つボタンマウス推奨。ミサイルコマンドはICBMから都市を守るためミサイル基地から迎撃しますが、絵文字なので降ってくる何かからスタジアムを守るため東京タワーから何か打ちます。

プログラム: (→大)
# missile command 画面横は描画中キャンバス["width"] 画面縦は描画中キャンバス["height"] キャンバスIDは描画中キャンバス["id"] PointerLockAPI使用はオン マウスボタンハンドラはNULL ゲームオーバーフラグはオフ 描画中はオフ 基準日時は０ 前回日時は０ 経過時間は０ 経過レートは1.0 建物高さは40 地面高さは34 建物サイズは32 ICBM爆発半径は24 迎撃爆発半径は24 建物爆発半径は12 ICBMSPDは0.3 迎撃SPDは3 ICBM爆発SPDは0.25 迎撃爆発SPDは0.25 建物爆発SPDは0.5 ICBM出現基本数は10 表示カウンタは0 ステージは0 スコアは0 ICBM増援数は0 照準は{ 　X:画面横/2, 　Y:画面縦/2 } 都市文字は「🏟」 砲台文字は「🗼」 ICBMリストは[] 都市リストは[] 砲台リストは[] 迎撃リストは[] 爆発リストは[] 開始する。 ●開始とは 　描画中コンテキスト["textAlign"]は"center" 　描画中コンテキスト["textBaseline"]は"middle" 　もし、PointerLockAPI使用ならば、 　　もし、APIチェックならば、 　　　DOCUMENTの「pointerlockerror」に「POINTERLOCKエラー」をDOMイベント追加 　　　DOCUMENTの「pointerlockchange」に「POINTERLOCK変更」をDOMイベント追加 　　違えば、 　　　「Pointer Lock APIは使用不能のため通常のマウス操作になります」を表示 　　　PointerLockAPI使用はオフ 　　ここまで 　ここまで 　マウスボタンハンドラは「スタート時マウスボタン処理」のJSオブジェクト取得 　描画中キャンバスの「mousedown」に「マウスボタン処理」をDOMイベント追加 　描画中キャンバスの「背景色」に黒色をDOMスタイル設定。 　初期画面描画 ここまで ●APIチェックとは 　「document.exitPointerLock != null」をJS実行で戻る ここまで ●マウスキャプチャ済とは 　「document.pointerLockElement === document.getElementById("{キャンバスID}")」をJS実行で戻る。 ここまで ●POINTERLOCKエラーとは 　DOCUMENTの「pointerlockerror」から「POINTERLOCKエラー」をDOMイベント削除 　DOCUMENTの「pointerlockchange」から「POINTERLOCK変更」をDOMイベント削除 　『Pointer Lock APIが制限されているため通常のマウス操作になります』を表示 　『マウスカーソルがゲーム画面外に移動するのを制限したい場合は』を表示 　『「作品を編集」を押して編集モードの画面に』を表示 　『移動してから、再度、実行してクリックしてみて下さい』を表示 　PointerLockAPI使用はオフ 　ゲーム準備 　ゲームスタート ここまで ●ゲーム準備とは 　DOCUMENTの「mousemove」に「マウス移動」をDOMイベント追加 　描画中キャンバスの「contextmenu」に「空処理」をDOMイベント追加 　マウスボタンハンドラは「ゲーム中マウスボタン処理」のJSオブジェクト取得 ここまで ●ゲーム後始末とは 　描画中キャンバスの「mousedown」から「マウスボタン処理」をDOMイベント削除 　描画中キャンバスの「contextmenu」から「空処理」をDOMイベント削除 　DOCUMENTの「mousemove」から「マウス移動」をDOMイベント削除 　DOCUMENTの「pointerlockchange」から「POINTERLOCK変更」をDOMイベント削除 　DOCUMENTの「pointerlockerror」から「POINTERLOCKエラー」をDOMイベント削除 ここまで ●POINTERLOCK変更とは 　もし、マウスキャプチャ済()ならば、 　　ゲーム準備 　　ゲームスタート 　違えば、 　　描画中はオフ 　　ゲーム後始末 　ここまで ここまで ●空処理とは 　EVTはWINDOW["event"] 　EVTをDOMイベント処理停止 ここまで ●マウスボタン処理とは 　もし、マウスボタンハンドラ≠NULLならば、 　　EVTはWINDOW["event"] 　　マウスボタンハンドラ(EVT) 　　EVTをDOMイベント処理停止 　ここまで ここまで ●照準補正とは 　もし、照準["X"]＜0ならば、 　　照準["X"]は0 　ここまで 　もし、照準["Y"]＜0ならば、 　　照準["Y"]は0 　ここまで 　もし、照準["X"]＞画面横ならば、 　　照準["X"]は画面横 　ここまで 　もし、照準["Y"]＞画面縦−50ならば、 　　照準["Y"]は画面縦−50 　ここまで ここまで ●マウス移動とは 　EVTはWINDOW["event"] 　もし、PointerLockAPI使用ならば、 　　照準["X"]は照準["X"]+EVT["movementX"] 　　照準["Y"]は照準["Y"]+EVT["movementY"] 　違えば、 　　要素位置はEVT["target"]の"getBoundingClientRect"を[]でJSメソッド実行 　　照準["X"]はEVT["clientX"]-要素位置["left"] 　　照準["Y"]はEVT["clientY"]-要素位置["top"] 　ここまで 　照準補正 ここまで ●(EVTで)スタート時マウスボタン処理とは 　もし、PointerLockAPI使用ならば、 　　もし、マウスキャプチャ済()でなければ、 　　　描画中キャンバスの「requestPointerLock」を[]でJSメソッド実行 　　ここまで 　違えば、 　　ゲーム準備 　　ゲームスタート 　ここまで ここまで ●(EVTで)ゲーム中マウスボタン処理とは 　BはEVT["button"] 　もし、B<0||B>2ならば、 　　戻る 　ここまで 　もし、ゲームオーバーフラグ=オンならば、 　　戻る 　ここまで 　砲台は砲台リスト[B] 　もし、PointerLockAPI使用でなければ、 　　要素位置はEVT["target"]の"getBoundingClientRect"を[]でJSメソッド実行 　　照準["X"]はEVT["clientX"]-要素位置["left"] 　　照準["Y"]はEVT["clientY"]-要素位置["top"] 　　照準補正 　ここまで 　砲台から[照準["X"],照準["Y"]]へ迎撃発射する ここまで ●ゲームスタートとは 　全描画クリア 　描画中はオン 　基準日時は「Date.now()」をJS実行 　都市初期化 　砲台初期化 　描画フレーム ここまで ●都市初期化とは 　６回繰り返す 　　Iは回数+1 　　もし、回数＞３ならば、 　　　IはI+1 　　ここまで 　　XはI*画面横/10 　　Yは画面縦-建物高 　　都市は{ 　　　X:X, 　　　Y:Y 　　} 　　都市を都市リストに配列追加 　ここまで ここまで ●砲台初期化とは 　３回繰り返す 　　Iは回数*4-3 　　XはI*画面横/10 　　Yは画面縦-建物高 　　砲台は{ 　　　X:X, 　　　Y:Y, 　　　弾数:30, 　　　有効:オン 　　} 　　砲台を砲台リストに配列追加 　ここまで ここまで ●描画フレームとは 　前回日時は基準日時 　基準日時は「Date.now()」をJS実行 　経過時間は基準日時−前回日時 　経過レートは経過時間÷20.0 　爆発進行 　迎撃進行 　爆発判定 　ICBM進行 　画面描画 　ICBMSPDはICBMSPD+0.001/60 　ステージ管理 　もし、ゲームオーバーフラグ=オン&&表示カウンタ=0ならば、 　　ゲーム終わり 　ここまで 　もし、描画中ならば、 　　画面更新時実行には 　　　描画フレーム 　　ここまで 　ここまで ここまで ●ステージ管理とは 　もし、表示カウンタ=0ならば、 　　ICBM数はICBMリストの配列要素数 　　都市数は都市リストの配列要素数 　　もし、ICBM数=0&&都市数>0ならば、 　　　表示カウンタは1 　　ここまで 　違えば、 　　表示カウンタは表示カウンタ+1 　　もし、表示カウンタ=2ならば、 　　　もし、ステージ=0ならば、 　　　　表示カウンタは1.5*60+1 　　　違えば、 　　　　スコアはスコア+(都市リストの配列要素数)*20 　　　ここまで 　　　ステージはステージ+1 　　違えばもし、表示カウンタ＜1.5*60ならば、 　　　白色に塗り色設定 　　　「18px sans-serif」に描画フォント設定 　　　[画面横÷2, 画面縦÷2-20]に「ステージ {ステージ-1} クリア」を文字描画 　　　[画面横÷2, 画面縦÷2+20]に「ボーナス: {都市リストの配列要素数} × 20」を文字描画 　　違えばもし、表示カウンタ＜3*60ならば、 　　　もし、(都市リストの配列要素数)=0ならば、 　　　　表示カウンタは0 　　　　戻る 　　　ここまで 　　　白色に塗り色設定 　　　「18px sans-serif」に描画フォント設定 　　　[画面横÷2, 画面縦÷2]に「ステージ {ステージ} スタート」を文字描画 　　違えば、 　　　(ICBM出現基本数*0.6+((ICBM出現基本数*0.5)の乱数)+((ICBM出現基本数*0.5)の乱数)+1)回繰り返す 　　　　空から0へICBM出現 　　　ここまで 　　　Iで[2,3,4,6,7,8]を反復する 　　　　空からIへICBM出現 　　　ここまで 　　　ICBM増援数は(((ICBM出現基本数*0.5)の乱数)+((ICBM出現基本数*0.5)の乱数)+2)の整数部分 　　　ICBM出現基本数はICBM出現基本数+1 　　　砲台で砲台リストを反復する 　　　　もし、砲台["有効"]＝オンならば、 　　　　　砲台["弾数"]は砲台["弾数"]+((ICBM出現基本数/2)の整数部分) 　　　　ここまで 　　　ここまで 　　　表示カウンタは0 　　ここまで 　ここまで ここまで ●(砲台からXYへ)迎撃発射とは 　もし、砲台["弾数"]＝０||砲台["有効"]≠オンならば、 　　戻る 　ここまで 　砲台["弾数"]は砲台["弾数"]-1 　SPDは迎撃SPD 　Xは砲台["X"] 　Yは砲台["Y"]-建物サイズ*0.35 　DはATAN2(XY[1]-Y,XY[0]-X) 　迎撃は{ 　　X0:X, 　　Y0:Y, 　　X:X, 　　Y:Y, 　　TX:XY[0], 　　TY:XY[1], 　　DX:COS(D)*SPD, 　　DY:SIN(D)*SPD, 　　SPD:SPD, 　　D:D 　} 　迎撃リストに迎撃を配列追加 ここまで ●(OからIへ)ICBM出現とは 　SPDはICBMSPD*0.7+(10の乱数)/10*ICBMSPD*0.3 　多弾頭はオフ 　高度は0 　もし、O=空ならば 　　Xは(画面横の乱数)の整数部分 　　Yは0 　　もし、ステージ≧5ならば、 　　　多弾頭率はステージ/5*20 　　　もし、多弾頭率>80ならば、 　　　　多弾頭率は80 　　　ここまで 　　　もし、(100の乱数)<多弾頭率ならば、 　　　　多弾頭はオン 　　　　高度は画面縦/8+((画面縦/7)の乱数)+((画面縦/7)の乱数) 　　　ここまで 　　ここまで 　違えば、 　　XはO["X"] 　　YはO["Y"] 　ここまで 　もし、I=0ならば、 　　Iは(9の乱数)+1 　ここまで 　TXは画面横/10*I+((10の乱数)-5) 　TYは画面縦-建物高さ 　DはATAN2(TY-Y,TX-X) 　ICBMは{ 　　X0:X, 　　Y0:Y, 　　X:X, 　　Y:Y, 　　DX:COS(D)*SPD, 　　DY:SIN(D)*SPD, 　　SPD:SPD, 　　D:D, 　　有効:オン, 　　多弾頭:多弾頭, 　　分離高度:高度 　} 　ICBMリストにICBMを配列追加 ここまで ●(XYにRDでRの)爆発発生とは 　爆発は{ 　　X:XY[0], 　　Y:XY[1], 　　RMAX:R, 　　R:1, 　　RD:RD 　} 　爆発を爆発リストに配列追加 ここまで ●ICBM進行とは 　ICBM数はICBMリストの配列要素数 　(ICBM数)回繰り返す 　　IはICBM数-回数 　　ICBMはICBMリスト[I] 　　もし、ICBM["多弾頭"]=オン&&ICBM["Y"]>ICBM["分離高度"]ならば、 　　　ICBMリストのIを配列切取 　　　Nは(2の乱数)+(2の乱数)+2 　　　ICBM増援数はICBM増援数-N 　　　もし、ICBM増援数<0ならば、 　　　　ICBM増援数は0 　　　ここまで 　　　(N)回繰り返す 　　　　ICBMから0へICBM出現 　　　ここまで 　　違えば、 　　　ICBM["X"]はICBM["X"]+ICBM["DX"] 　　　ICBM["Y"]はICBM["Y"]+ICBM["DY"] 　　　もし、ICBM["X"]＜0||ICBM["X"]≧画面横ならば、 　　　　ICBMリストのIを配列切取 　　　違えばもしICBM["Y"]＜0||ICBM["Y"]≧画面縦-地面高さならば、 　　　　ICBMリストのIを配列切取 　　　　[ICBM["X"],ICBM["Y"]]にICBM爆発SPDでICBM爆発半径の爆発発生 　　　ここまで 　　ここまで 　ここまで ここまで ●迎撃進行とは 　迎撃数は迎撃リストの配列要素数 　(迎撃数)回繰り返す 　　Iは迎撃数-回数 　　迎撃は迎撃リスト[I] 　　DXは迎撃["X"]-迎撃["TX"] 　　DYは迎撃["Y"]-迎撃["TY"] 　　LはSQRT(DX*DX+DY+DY) 　　もし、L＜迎撃["SPD"]ならば、 　　　迎撃リストのIを配列切取 　　　[迎撃["X"],迎撃["Y"]]に迎撃爆発SPDで迎撃爆発半径の爆発発生 　　違えば、 　　　迎撃["X"]は迎撃["X"]+迎撃["DX"] 　　　迎撃["Y"]は迎撃["Y"]+迎撃["DY"] 　　ここまで 　ここまで ここまで ●爆発進行とは 　爆発数は爆発リストの配列要素数 　(爆発数)回繰り返す 　　Iは爆発数-回数 　　爆発は爆発リスト[I] 　　爆発["R"]は爆発["R"]+爆発["RD"] 　　もし、爆発["RD"]>0ならば、 　　　もし、爆発["R"]≧爆発["RMAX"]ならば、 　　　　爆発["RD"]は0-爆発["RD"] 　　　ここまで 　　違えば 　　　もし、爆発["R"]<1ならば、 　　　　爆発リストのIを配列切取 　　　ここまで 　　ここまで 　ここまで ここまで ●爆発判定とは 　爆発で爆発リストを反復する 　　ICBM数はICBMリストの配列要素数 　　(ICBM数)回繰り返す 　　　IはICBM数-回数 　　　ICBMはICBMリスト[I] 　　　DXはICBM["X"]-爆発["X"] 　　　DYはICBM["Y"]-爆発["Y"] 　　　DLはSQRT(DX*DX+DY*DY) 　　　もし、DL≦爆発["R"]ならば、 　　　　ICBMリストのIを配列切取 　　　　[ICBM["X"],ICBM["Y"]]にICBM爆発SPDでICBM爆発半径の爆発発生 　　　　スコアはスコア+10 　　　　もし、ICBM増援数>0ならば、 　　　　　空から0へICBM出現 　　　　　ICBM増援数はICBM増援数-1 　　　　ここまで 　　　ここまで 　　ここまで 　　#劇劇ミサイルは誘爆しない(爆発を貫通出来なくなり高難易度) 　　# 迎撃数は迎撃リストの配列要素数 　　# (迎撃数)回繰り返す 　　# 　Iは迎撃数-回数 　　# 　迎撃は迎撃リスト[I] 　　# 　DXは迎撃["X"]-爆発["X"] 　　# 　DYは迎撃["Y"]-爆発["Y"] 　　# 　DLはSQRT(DX*DX+DY*DY) 　　# 　もし、DL≦爆発["R"]ならば、 　　# 　　迎撃リストのIを配列切取 　　# 　　[迎撃["X"],迎撃["Y"]]に迎撃爆発SPDで迎撃爆発半径の爆発発生 　　# 　ここまで 　　# ここまで 　　都市数は都市リストの配列要素数 　　(都市数)回繰り返す 　　　Iは都市数-回数 　　　都市は都市リスト[I] 　　　DXは都市["X"]-爆発["X"] 　　　DYは都市["Y"]-爆発["Y"] 　　　DLはSQRT(DX*DX+DY*DY) 　　　もし、DL≦爆発["R"]ならば、 　　　　都市リストのIを配列切取 　　　　[都市["X"],都市["Y"]]に建物爆発SPDで建物爆発半径の爆発発生 　　　　もし、(都市リストの配列要素数)＝０ならば、 　　　　　ゲームオーバーフラグはオン 　　　　ここまで 　　　ここまで 　　ここまで 　　砲台数は砲台リストの配列要素数 　　(砲台数)回繰り返す 　　　Iは砲台数-回数 　　　砲台は砲台リスト[I] 　　　もし、砲台["有効"]＝オンならば、 　　　　DXは砲台["X"]-爆発["X"] 　　　　DYは砲台["Y"]-爆発["Y"] 　　　　DLはSQRT(DX*DX+DY*DY) 　　　　もし、DL≦爆発["R"]ならば、 　　　　　砲台["有効"]はオフ 　　　　　[砲台["X"],砲台["Y"]]に建物爆発SPDで建物爆発半径の爆発発生 　　　　ここまで 　　　ここまで 　　ここまで 　ここまで ここまで ●画面描画とは 　全描画クリア 　爆発描画 　ICBM描画 　迎撃描画 　地面描画 　都市描画 　砲台描画 　ビルボード描画 　カーソル描画 ここまで ●カーソル描画とは 　1に線太さ設定 　黄色に線色設定 　[照準["X"]-5,照準["Y"]]から[照準["X"]+5,照準["Y"]]まで線描画 　[照準["X"],照準["Y"]-5]から[照準["X"],照準["Y"]+5]まで線描画 ここまで ●地面描画とは 　「#FFFF44FF」に塗り色設定 　空に線色設定 　[0-0.5,画面縦-地面高-0.5,画面横+1,地面高+1]に四角描画 ここまで ●砲台描画とは 　黒色に塗色設定 　砲台で砲台リストを反復 　　もし、砲台["有効"]＝オンならば、 　　　「{建物サイズ}px sans-serif」に描画フォント設定 　　　[砲台["X"],砲台["Y"]]に砲台文字を文字描画 　　　「12px sans-serif」に描画フォント設定 　　　[砲台["X"],砲台["Y"]+建物サイズ/2+15]に砲台["弾数"]を文字描画 　　ここまで 　ここまで ここまで ●都市描画とは 　水色に塗色設定 　「{建物サイズ}px sans-serif」に描画フォント設定 　都市で都市リストを反復 　　[都市["X"],都市["Y"]]に都市文字を文字描画 　ここまで ここまで ●ICBM描画とは 　白色に塗り色設定 　1に線太さ設定 　ICBMでICBMリストを反復する 　　もし、ICBM["有効"]ならば、 　　　赤色に線色設定 　　　[ICBM["X0"],ICBM["Y0"]]から[ICBM["X"],ICBM["Y"]]まで線描画 　　　空に線色設定 　　　[ICBM["X"]-0.75,ICBM["Y"]-0.75,1.5,1.5]に四角描画 　　ここまで 　ここまで ここまで ●迎撃描画とは 　赤色に塗り色設定 　1に線太さ設定 　迎撃で迎撃リストを反復する 　　白色に線色設定 　　[迎撃["X0"],迎撃["Y0"]]から[迎撃["X"],迎撃["Y"]]まで線描画 　　空に線色設定 　　[迎撃["X"]-0.75,迎撃["Y"]-0.75,1.5,1.5]に四角描画 　ここまで ここまで ●爆発描画とは 　「#FFCCCCFF」に塗り色設定 　空に線色設定 　爆発で爆発リストを反復する 　　[爆発["X"],爆発["Y"]]へ爆発["R"]の円描画 　ここまで ここまで ●ビルボード描画とは 　白色に塗り色設定 　「16px sans- serif」に描画フォント設定 　[画面横/3*1-40, 16]に「ステージ：{ステージ}」を文字描画 　[画面横/3*2-40, 16]に「スコア：{スコア}」を文字描画 ここまで ●初期画面描画とは 　全描画クリア 　白色に塗り色設定 　「18px sans-serif」に描画フォント設定 　[画面横÷2, 画面縦÷2]に「クリックで開始」を文字描画 ここまで ●ゲーム終了画面描画とは 　白色に塗り色設定 　「24px sans-serif」に描画フォント設定 　[画面横÷2, 画面縦÷2]に「おわり」を文字描画 　「18px sans-serif」に描画フォント設定 　[画面横/2, 画面縦/2+40]に「ステージ：{ステージ}　スコア：{スコア}」を文字描画 ここまで ●ゲーム終とは 　描画中はオフ 　ゲーム後始末 　DOCUMENTの「exitPointerLock」を[]でJSメソッド実行。 　ゲーム終了画面描画 ここまで