[編集モード] ミサイルなんとか

その昔ゲームセンターにあった、ミサイルコマンドっぽいなにかです。３つボタンマウス推奨。ミサイルコマンドは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メソッド実行。
　ゲーム終了画面描画
ここまで

デバッグキャンバス: 幅 × 高

🍯 なでしこ3貯蔵庫

[編集モード] ミサイルなんとか

素材のアップロード