▶ 実 行
▶ 実行
クリア
ひたすら避けるゲーム(mouse専用)
by てぃふと@うぇいく
画面横は描画中キャンバス["width"] 画面縦は描画中キャンバス["height"] 自サイズは24 敵サイズは12 隕石サイズは12 爆発サイズは24 弾サイズは{半径:3} 自文字は「🛸」 敵文字は「👾」 隕石文字は「🥔」 爆発文字は「💥」 進入禁止幅は24 Xは画面横÷2 Yは画面縦÷2 スコアは0 スコアタイマは0 エンカウンターは0 ゲームオーバーフラグはオフ 描画中はオフ 敵群は[] 敵弾群は[] 隕石群は[] 爆発中は[] キャンバスIDは描画中キャンバス["id"] CTXは描画中コンテキスト 枠モードは0 基準日時は0 前回日時は0 経過時間は0 経過レートは1.0 fidは-1 tidは-1 # 描画高速化機能 文字描画準備文字列は『 ctx.save(); if (size) { ctx.font=""+size+"px sans- serif"; } ctx.textAlign="center"; ctx.textBaseline="middle"; 』 文字描画文字列は『 ctx.save(); ctx.translate(X,Y); if (R != null) { r=R*(Math.PI/180); ctx.rotate(r); } ctx.fillText(c,0,0); ctx.restore(); 』 文字描画復帰文字列は『 ctx.restore(); 』 文字描画準備関数は"ctx,size"と文字描画準備文字列でJS関数作成 文字描画関数は"ctx,X,Y,R,c"と文字描画文字列でJS関数作成 文字描画復帰関数は"ctx"と文字描画復帰文字列でJS関数作成 単文字描画文字列は『 ctx.save(); if (size) { ctx.font=""+size+"px sans- serif"; } ctx.textAlign="center"; ctx.textBaseline="middle"; ctx.translate(X,Y); ctx.fillText(c,0,0); ctx.restore(); 』 単文字描画関数は"ctx,size,X,Y,c"と単文字描画文字列でJS関数作成 開始する。 ●開始とは もし、!(ポインターロックAPIチェック)ならば、 「必要なAPI(Pointer Lock API)が無いため実行できませんでした」を表示 戻る ここまで DOCUMENTの「pointerlockchange」に「POINTERLOCK変更」をDOMイベント追加 描画中キャンバスをクリックした時には、 もし、(キャンバスIDにマウスキャプチャ済)でなければ、 WINDOW["event"]["target"]にポインターロック設定 違えば、 枠モードは1−枠モード ここまで ここまで 初期画面描画 ここまで ●POINTERLOCK変更とは もし、(キャンバスIDにマウスキャプチャ済)ならば、 描画中はオン DOCUMENTの「mousemove」に「マウス移動」をDOMイベント追加 基準日時は「Date.now()」をJS実行 処理予約 違えば、 描画中はオフ 描画中キャンバスをクリックした時には ここまで DOCUMENTの「mousemove」から「マウス移動」をDOMイベント削除 DOCUMENTの「pointerlockchange」から「POINTERLOCK変更」をDOMイベント削除 ここまで ここまで ●(値を下限から上限で)範囲制限とは もし、値>上限ならば、 値は上限 違えばもし、値<下限ならば、 値は下限 ここまで 値で戻る ここまで ●(値を下限から上限で)範囲ループとは もし、値>上限ならば、 値は下限+値-上限 違えばもし、値<下限ならば、 値は上限-(下限-値) ここまで 値で戻る ここまで ●マウス移動とは XはX+WINDOW["event"]["movementX"] YはY+WINDOW["event"]["movementY"] もし、枠モードが0ならば、 XはXを進入禁止幅から(画面横−進入禁止幅)で範囲制限 YはYを進入禁止幅から(画面縦−進入禁止幅)で範囲制限 違えば、 XはXを進入禁止幅から(画面横−進入禁止幅)で範囲ループ YはYを進入禁止幅から(画面縦−進入禁止幅)で範囲ループ ここまで ここまで ●(群を)進行処理とは 個体数は群の配列要素数 (個体数)回、 個体は群[個体数-回数] 個体["X"]は個体["X"]+個体["DX"]×経過レート 個体["Y"]は個体["Y"]+個体["DY"]×経過レート もし、個体["R"]=NULLでなければ、 個体["R"]は個体["R"]+個体["DR"]×経過レート もし、個体["R"]<0ならば 個体["R"]は個体["R"]+360 違えばもし、個体["R"]≧360ならば、 個体["R"]は個体["R"]−360 ここまで ここまで もし、個体["X"]<0||個体["X"]>画面横||個体["Y"]<0||個体["Y"]>画面縦ならば、 群の個体数−回数を配列切り取る ここまで ここまで ここまで ●敵弾進行とは 敵弾群を進行処理 ここまで ●隕石進行とは 隕石群を進行処理 ここまで ●敵進行とは 敵群を進行処理 ここまで ●爆発処理とは 爆発数は爆発中の配列要素数 (爆発数)回、 爆発は爆発中[爆発数-回数] 爆発["カウンタ"]は爆発["カウンタ"]−経過時間 もし、爆発["カウンタ"]<0ならば、 爆発中の爆発数-回数を配列切り取り ここまで ここまで ここまで ●(速さで)出現基礎とは 出現Xは(画面横×0.1+((画面横×0.8)の乱数)) 出現Yは(画面縦×0.1+((画面横×0.8)の乱数)) 出現向きは(50の乱数)+(50の乱数)+90 出現位置は4の乱数 もし、出現位置<1ならば 出現Xは0 出現向きは出現向き+180 違えばもし、出現位置<2ならば 出現Yは0 出現向きは出現向き+270 違えばもし、出現位置<3ならば 出現Xは画面横 出現向きは出現向き+0 違えば 出現Yは画面縦 出現向きは出現向き+90 ここまで もし、出現向き≧360ならば、 出現向きは出現向き−360 ここまで 向きはDEG2RAD(出現向き) 個体は{ X:出現X, Y:出現Y, 向:出現向き, 速:速さ, DX:COS(向き)×速さ, DY:SIN(向き)×速さ } 個体を戻す ここまで ●隕石出現とは 速さは0.4+(20の乱数)÷10+スコア÷500 もし、速さ>3.0ならば、 速さは3.0 ここまで 隕石は速さで出現基礎 隕石["サイズ"]は隕石サイズ 隕石["R"]は360の乱数 回転速度は(5の乱数)+(5の乱数) もし、(2の乱数)<1ならば、 回転速度は回転速度×(-1) ここまで 隕石["DR"]は回転速度 隕石群に隕石を配列追加 ここまで ●敵出現とは 速さは0.5+(20の乱数)÷10 敵は速さで出現基礎 敵["サイズ"]は敵サイズ 敵["攻撃カウンタ"]は0 敵["攻撃インターバル"]は200+(100の乱数)×10 敵["R"]はNULL 敵群に敵を配列追加 ここまで ●ランダムエンカウンターとは エンカウンターはエンカウンター+1×経過レート もし、エンカウンター>10ならば、 敵数は敵群の配列要素数 色々数は(隕石群の配列要素数)+敵数 もし、(色々数の乱数)<(スコア÷100)+2ならば、 もし、(100の乱数)<12ならば、 敵出現 違えば 隕石出現 ここまで ここまで エンカウンターは0 ここまで ここまで ●スコア処理とは スコアタイマはスコアタイマ+経過時間 もし、スコアタイマ>1000ならば、 スコアはスコア+10 スコアタイマはスコアタイマ−1000 ここまで ここまで ●(敵から)弾発射とは 速さは1.0 出現向きは(45の乱数)+(45の乱数) もし、X<敵["X"]ならば、 出現向きは出現向き+90 ここまで もし、Y<敵["Y"]ならば、 出現向きは360-出現向き ここまで もし、出現向き≧360ならば、 出現向きは出現向き−360 ここまで 向きはDEG2RAD(出現向き) 弾は{ X:敵["X"], Y:敵["Y"], 向:出現向き, 速:速さ, DX:COS(向き)×速さ, DY:SIN(向き)×速さ, R:NULL, サイズ: 弾サイズ["半径"] } 敵弾群に弾を配列追加 ここまで ●敵処理とは (敵群の配列要素数)回、 敵は敵群[回数-1] 敵["攻撃カウンタ"]は敵["攻撃カウンタ"]+経過時間 もし、敵["攻撃カウンタ"]>敵["攻撃インターバル"]ならば、 敵から弾発射 敵["攻撃カウンタ"]は0 ここまで ここまで ここまで ●敵弾判定処理とは 弾数は敵弾群の配列要素数 隕石数は隕石群の配列要素数 もし、弾数が0ならば、 戻る ここまで (弾数)回 Tは弾数-回数 弾は敵弾群[T] もし、弾["X"]-弾["サイズ"]<X+自サイズ×0.4&&弾["X"]+弾["サイズ"]>X−自サイズ×0.4ならば、 もし、弾["Y"]-弾["サイズ"]<Y+自サイズ×0.3&&弾["Y"]+弾["サイズ"]>Y-自サイズ×0.2ならば、 ゲームオーバーフラグはオン 戻る ここまで ここまで もし、隕石数>0ならば (隕石数)回 Pは隕石数-回数 隕石は隕石群[P] もし、弾["X"]-弾["サイズ"]<隕石["X"]+隕石["サイズ"]×0.4&&弾["X"]+弾["サイズ"]>隕石["X"]−隕石["サイズ"]×0.4ならば、 もし、弾["Y"]-弾["サイズ"]<隕石["Y"]+隕石["サイズ"]×0.4&&弾["Y"]+弾["サイズ"]>隕石["Y"]-隕石["サイズ"]×0.4ならば、 隕石群のPを配列切取 敵弾群のTを配列切取 爆発は{X:隕石["X"], Y:隕石["Y"], サイズ:爆発サイズ, R:NULL, カウンタ: 1000} 爆発中に爆発を配列追加 隕石数は隕石群の配列要素数 スコアはスコア+5 抜ける ここまで ここまで ここまで ここまで ここまで ここまで ●隕石判定処理とは 隕石数は隕石群の配列要素数 もし、隕石数が0ならば、 戻る ここまで (隕石数)回 隕石は隕石群[回数-1] もし、隕石["X"]-隕石["サイズ"]×0.3<X+自サイズ×0.4&&隕石["X"]+隕石["サイズ"]×0.3>X−自サイズ×0.4ならば、 もし、隕石["Y"]-隕石["サイズ"]×0.3<Y+自サイズ×0.3&&隕石["Y"]+隕石["サイズ"]×0.3>Y-自サイズ×0.2ならば、 ゲームオーバーフラグはオン 戻る ここまで ここまで ここまで ここまで ●爆発判定処理とは 爆発数は爆発中の配列要素数 もし、爆発数が0ならば、 戻る ここまで 敵弾数は敵弾群の配列要素数 隕石数は隕石群の配列要素数 (爆発数)回 Iは爆発数-回数 爆発は爆発中[I] もし、爆発["X"]-爆発["サイズ"]×0.3<X+自サイズ×0.4&&爆発["X"]+爆発["サイズ"]×0.3>X−自サイズ×0.4ならば、 もし、爆発["Y"]-爆発["サイズ"]×0.3<Y+自サイズ×0.3&&爆発["Y"]+爆発["サイズ"]×0.3>Y-自サイズ×0.2ならば、 ゲームオーバーフラグはオン 戻る ここまで ここまで もし、敵弾数>0ならば (敵弾数)回 Tは敵弾数-回数 弾は敵弾群[T] もし、弾["X"]-弾["サイズ"]<爆発["X"]+爆発["サイズ"]×0.4&&弾["X"]+弾["サイズ"]>爆発["X"]−爆発["サイズ"]×0.4ならば、 もし、弾["Y"]-弾["サイズ"]<爆発["Y"]+爆発["サイズ"]×0.4&&弾["Y"]+弾["サイズ"]>爆発["Y"]-爆発["サイズ"]×0.4ならば、 敵弾群のTを配列切取 爆発["カウンタ"]は爆発["カウンタ"]+400 スコアはスコア+1 ここまで ここまで ここまで 敵弾数は敵弾群の配列要素数 ここまで もし、隕石数>0ならば (隕石数)回 Pは隕石数-回数 隕石は隕石群[P] もし、爆発["X"]−爆発["サイズ"]×0.4<隕石["X"]+隕石["サイズ"]×0.4&&爆発["X"]+爆発["サイズ"]×0.4>隕石["X"]−隕石["サイズ"]×0.4ならば、 もし、爆発["Y"]-爆発["サイズ"]×0.4<隕石["Y"]+隕石["サイズ"]×0.4&&爆発["Y"]+爆発["サイズ"]×0.4>隕石["Y"]-隕石["サイズ"]×0.4ならば、 隕石群のPを配列切取 爆発は{X:隕石["X"], Y:隕石["Y"], サイズ:爆発サイズ, R:NULL, カウンタ: 1000} 爆発中に爆発を配列追加 スコアはスコア+5 ここまで ここまで ここまで 隕石数は隕石群の配列要素数 ここまで ここまで ここまで ●処理予約とは tidは"処理フレーム"を0.02秒タイマー開始時 ここまで ●処理中止とは 全タイマー停止 ここまで ●処理フレームとは 前回日時は基準日時 基準日時は「Date.now()」をJS実行 経過時間は基準日時−前回日時 経過レートは経過時間÷20.0 爆発処理 敵処理 敵弾進行 敵弾判定処理 敵進行 隕石進行 隕石判定処理 爆発判定処理 ランダムエンカウンター スコア処理 もし、ゲームオーバーフラグがオンならば、 ゲーム終わり ここまで もし、描画中ならば、 描画予約 違えば、 処理中止 ここまで ここまで ●自機描画とは 単文字描画関数(CTX,自サイズ,X,Y,自文字) ここまで ●敵弾描画とは 弾数は敵弾群の配列要素数 もし、弾数>0ならば、 1に線太さ設定 黒色に線色設定 白色に塗り色設定 (弾数)回 弾は敵弾群[回数-1] [弾["X"], 弾["Y"]]へ弾サイズ["半径"]の円描画。 ここまで ここまで ここまで ●(群を文字で)群文字描画処理とは 個体数は群の配列要素数 もし、個体数>0ならば、 文字描画準備関数(CTX,群[0]["サイズ"]) (個体数)回、 個体は群[回数-1] 文字描画関数(CTX,個体["X"],個体["Y"],個体["R"],文字) ここまで 文字描画復帰関数(CTX) ここまで ここまで ●隕石描画とは 隕石群を隕石文字で群文字描画処理 ここまで ●爆発描画とは 爆発中を爆発文字で群文字描画処理 ここまで ●敵描画とは 敵群を敵文字で群文字描画処理 ここまで ●進入禁止枠描画とは 白色に塗り色設定 1.0に線太さ設定 もし、枠モードが0ならば、 赤色に線色設定 違えば、 青色に線色設定 ここまで [進入禁止幅, 進入禁止幅, 画面横−進入禁止幅×2, 画面縦−進入禁止幅×2]の四角描画 ここまで ●ビルボード描画とは もし、枠モードが0ならば、 モードは「ストップ」 違えば モードは「ループ」 ここまで 黒色に塗り色設定 「12px sans- serif」に描画フォント設定 [画面横÷3×1-40, 20]に「スコア:{スコア}」を文字描画 [画面横÷3×2-40, 20]に「境界:{モード}」を文字描画 ここまで ●描画予約とは もし、fidが(-1)ならば、 fidは「画面描画フレーム」を画面更新時実行 ここまで ここまで ●画面描画フレームとは fidは-1 [0,0,画面横,画面縦]の描画クリア 進入禁止枠描画 自機描画 隕石描画 敵描画 爆発描画 敵弾描画 ビルボード描画 ここまで ●初期画面描画とは [0,0,画面横,画面縦]の描画クリア 黒色に線色設定 黒色に塗り色設定 2に線太さ設定 「18px sans- serif」に描画フォント設定 [画面横÷2-60, 画面縦÷2]に「クリックで開始」を文字描画 ここまで ●ゲーム終とは 描画中はオフ ポインターロック解除 黒色に線色設定 黒色に塗り色設定 2に線太さ設定 「24px sans- serif」に描画フォント設定 [画面横÷2-20, 画面縦÷2]に「おわり」を文字描画 ここまで # Pointer Lock API機能 ●ポインターロックAPIチェックとは 「(typeof document.exitPointerLock !== "undefined")」をJS実行で戻る ここまで ●(OBJに)ポインターロック設定とは OBJの"requestPointerLock"を[]でJSメソッド実行。 ここまで ●ポインターロック解除とは DOCUMENTの"exitPointerLock"を[]でJSメソッド実行。 ここまで ●(IDに)マウスキャプチャ済とは 「document.pointerLockElement === document.getElementById("{ID}")」をJS実行で戻る。 ここまで # 基本機能 JSメソッド実行文字列は『return IF.OBJ[IF.METHOD].apply(IF.OBJ,IF.ARGS)』 JSメソッド実行関数は["IF"]とJSメソッド実行文字列でJS関数作成 ●(FuncNameを)実行予約とは [FuncNameのJSオブジェクト取得]でWINDOW["requestAnimationFrame"]をJS関数実行で戻る ここまで ●(ARGSとBODYで)JS関数作成とは 『(function(A,B){return new Function(A,B);})』を[ARGS,BODY]でJS関数実行を戻す ここまで