[編集モード] Jumping Snowman

空から降ってくる雪をたくさん集めましょう。雪は顔のあたりで受け止めることができます。ひょうが頭や胴に当たるとゲームオーバーです。雪だるまは、ゲーム画面の下部中央にある３つのボタンをクリックまたはタップすることで操作することが出来ます。

全描画クリア。
px=240。py=428。　#操作盤の位置
a=0.25。y0=68。
mx0=275。my0=312。mx=mx0。my=y0。
vx=0。vy=-12。
ax=0。ay=1。
sx1=100。sy1=y0。se1=0。
sx2=300。sy2=y0。se2=0。
sx3=500。sy3=y0。se3=0。
hx=（580の乱数）+10。hy=y0。he=0。
捕獲数=「00」。catch=0。atari=0。
ty=2。uy=7。wv=0。
i=0。
終了フラグはオフ。
描画フラグはオン。
0に線太設定。「#44ccff」に線色設定。「#44ccff」に塗色設定。
[0,0,600,480]へ四角描画。
0に線太設定。「#eeeeee」に線色設定。「#eeeeee」に塗色設定。
nを0から10まで繰り返す
　　[60*n,0]へ70の円描画。
ここまで。
0に線太設定。「#ffffff」に線色設定。「#dddddd」に塗色設定。
[0,412,600,268]へ四角描画。
灰色に塗色設定。
「12px sans-serif」に描画フォント設定。
[472,472]へ「Westfarland PC Club」を文字描画。
黒色に塗色設定。
「40px sans-serif」に描画フォント設定。
[110,50]へ「Jumping Snowman」を文字描画。
「16px sans-serif」に描画フォント設定。
[130,105]へ「空から降ってくる雪をたくさん集めましょう。」を文字描画。
[130,130]へ「雪は顔のあたりで受け止めることができます。」を文字描画。
[172,155]へ「ときどき、ひょうが降ってきます。」を文字描画。
[120,180]へ「ひょうが頭や胴に当たるとゲームオーバーです。」を文字描画。
[85,205]へ「雪だるまは、3つの操作ボタンで操作することが出来ます。」を文字描画。
[110,230]へ「操作ボタンは、ゲーム画面の下部中央にあります。」を文字描画。
[90,443]へ「この画面をクリックすると、ゲームがすぐに始まります。」を文字描画。
mx=256。my=256。a=0.4。
mx,myへaの雪だるま。

描画中キャンバスの「click」に「ゲーム実行」をDOMイベント追加。

●ゲーム実行とは
　　描画中キャンバスの「click」から「ゲーム実行」をDOMイベント削除。
　　全描画クリア。
　　a=0.25。
　　mx=mx0。my=y0。
　　0に線太設定。「#44ccff」に線色設定。「#44ccff」に塗色設定。
　　[0,0,600,480]へ四角描画。
　　0に線太設定。「#eeeeee」に線色設定。「#eeeeee」に塗色設定。
　　nを0から10まで繰り返す
　　　　[60*n,0]へ50の円描画。
　　ここまで。
　　黒色に塗色設定。
　　「32px sans-serif」に描画フォント設定。
　　[152,32]へ「Jumping Snowman」を文字描画。
　　0に線太設定。「#ffffff」に線色設定。「#dddddd」に塗色設定。
　　[0,412,600,268]へ四角描画。
　　白色に塗色設定。
　　「36px sans-serif」に描画フォント設定。
　　[25,460]へ「❆」を文字描画。
　　灰色に塗色設定。
　　「12px sans-serif」に描画フォント設定。
　　[472,472]へ「Westfarland PC Club」を文字描画。
　　px,pyへ操作盤。
　　
　　# マウス設定
　　描画中キャンバスをマウス押した時には
　　　　xx=マウスX。yy=マウスY
　　　　もし、（yy>py）かつ（yy<py+39）ならば、
　　　　　　もし、（xx>px）かつ（xx<px+40）かつ（vx>-5）ならば、vx=vx-1。
　　　　　　もし、（xx>px+40）かつ（xx<px+80）ならば、vx=0。
　　　　　　もし、（xx>px+80）かつ（xx<px+120）かつ（vx<5）ならば、vx=vx+1。
　　　　ここまで。
　　ここまで。
　　
　　「アニメ描画」を画面更新時実行。
ここまで。

●アニメ描画とは
　　雪だるま処理
　　雪降下処理
　　雹降下処理
　　情報表示処理
　　もし、終了フラグがオンならば、
　　　　終了処理。
　　ここまで。
　　もし、描画フラグがオンならば、
    　　「アニメ描画」を画面更新時実行。
　　ここまで。
ここまで。

●雪だるま処理とは
　　my=my0+vy*i+ay*i*i/2
　　i=i+1。
　　もし、i>24ならば、i=0。
    mx=mx+vx
    もし（mx>541）または（mx<6）ならば
    　vx＝vx*(-1)
    ここまで。
    0に線太設定。「#44ccff」に線色設定。「#44ccff」に塗色設定。
　　[0,y0-17,600,411-y0+16]へ四角描画。
    mx,myへaの雪だるま。
ここまで。

●風処理とは
　　もし、(ABS(wv)<10)かつ(catch!=0)かつ(catch%10＝0)ならば、
　　　　wv=catch/50。
　　　　もし、（２の乱数）が1ならば、
　　　　　　wv=-wv
　　　　ここまで。
　　ここまで。
ここまで。

●雪降下処理とは
　　白色に塗色設定。
　　「24px sans-serif」に描画フォント設定。
　　もし、se1=1ならば、
　　　　[sx1,sy1]へ「❆」を文字描画。
　　　　もし、(sx1>mx+3)かつ(sx1<mx+29)かつ(sy1>my+20)かつ(sy1<my+46)ならば、
　　　　　　catch=catch+1
　　　　　　sx1=（180の乱数）+10-wv*150
　　　　　　sy1=y0
　　　　　　se1=0
　　　　　　風処理
　　　　違えば、
　　　　　　sx1=sx1+（5の乱数）-2+wv
　　　　　　sy1=sy1+ty+（3の乱数）-1
　　　　　　もし、sy1>410ならば、
　　　　　　　　sx1=（180の乱数）+10-wv*150
　　　　　　　　sy1=y0
　　　　　　　　se1=0
　　　　　　ここまで。
　　　　ここまで。
　　違えば
　　　　se1=（50の乱数）
　　ここまで。

もし、se2=1ならば、
　　　　[sx2,sy2]へ「❆」を文字描画。
　　　　もし、(sx2>mx+3)かつ(sx2<mx+29)かつ(sy2>my+20)かつ(sy2<my+46)ならば、
　　　　　　catch=catch+1
　　　　　　sx2=（180の乱数）+210-wv*150
　　　　　　sy2=y0
　　　　　　se2=0
　　　　　　風処理
　　　　違えば、
　　　　　　sx2=sx2+（5の乱数）-2+wv
　　　　　　sy2=sy2+ty+（3の乱数）-1
　　　　　　もし、sy2>410ならば、
　　　　　　　　sx2=（180の乱数）+210-wv*150
　　　　　　　　sy2=y0
　　　　　　　　se2=0
　　　　　　ここまで。
　　　　ここまで。
　　違えば
　　　　se2=（50の乱数）
　　ここまで。

もし、se3=1ならば、
　　　　[sx3,sy3]へ「❆」を文字描画。
　　　　もし、(sx3>mx+3)かつ(sx3<mx+29)かつ(sy3>my+20)かつ(sy3<my+46)ならば、
　　　　　　catch=catch+1
　　　　　　sx3=（180の乱数）+400-wv*150
　　　　　　sy3=y0
　　　　　　se3=0
　　　　　　風処理
　　　　違えば、
　　　　　　sx3=sx3+（5の乱数）-2+wv
　　　　　　sy3=sy3+ty+（3の乱数）-1
　　　　　　もし、sy3>410ならば、
　　　　　　　　sx3=（180の乱数）+400-wv*150
　　　　　　　　sy3=y0
　　　　　　　　se3=0
　　　　　　ここまで。
　　　　ここまで。
　　違えば
　　　　se3=（50の乱数）
　　ここまで。
ここまで。

●雹降下処理とは
　　白色に塗色設定。
　　「24px sans-serif」に描画フォント設定。
　　もし、he=1ならば、
　　　　[hx,hy]へ「●」を文字描画。
　　　　もし、(hx>mx-5)かつ(hx<mx+30)かつ(hy>my+15)かつ(hy<my+85)ならば、
　　　　　　atari=atari+1
　　　　　　he=0
　　　　　　「#cccccc」に塗色設定。
　　　　　　「24px sans-serif」に描画フォント設定。
　　　　　　[hx,hy]へ「●」を文字描画。
　　　　　　もし、atari=1ならば、
　　　　　　　　終了フラグはオン。
　　　　　　ここまで。
　　　　違えば、
　　　　　　hx=hx+wv/2
　　　　　　hy=hy+uy
　　　　　　もし、hy>410ならば、
　　　　　　　　hx=（570の乱数）+10-wv*75
　　　　　　　　hy=y0
　　　　　　　　he=0
　　　　　　ここまで。
　　　　ここまで。
　　違えば
　　　　he=（300の乱数）-atari*3
　　ここまで。
ここまで。

●情報表示処理とは
　　0に線太設定。「#dddddd」に線色設定。「#dddddd」に塗色設定。
　　[60,420,80,54]へ四角描画。
　　「#888888」に塗色設定。
　　捕獲数はRIGHT(「0｛catch｝」,2)
　　「36px sans-serif」に描画フォント設定。
　　[65,460]へ捕獲数を文字描画。
ここまで。

●終了処理とは
　　描画フラグはオフ。
　　DOCUMENTをキー押した時には、
　　ここまで。
　　黒色に線色設定。
　　黒色に塗り色設定。
　　２に線太さ設定。
　　「36px sans- serif」に描画フォント設定。
　　[200,175]に「Game Over」を文字描画。
　　「24px sans- serif」に描画フォント設定。
　　[80,230]に「ブラウザの再読み込みボタンをクリック」を文字描画。
ここまで

●（x,yへaの）雪だるまとは
　　2に線太設定。「#000000」に線色設定。「#ffffff」に塗色設定。
　　[x+100*a,y+260*a]へ125*aの円描画。
　　[x+100*a,y+100*a]へ88*aの円描画。
　　2に線太設定。「#000000」に線色設定。「#000000」に塗色設定。
　　[x+50*a,y+60*a,30*a,10*a]へ四角描画。
　　[x+120*a,y+60*a,30*a,10*a]へ四角描画。
　　[x+65*a,y+90*a]へ10*aの円描画。
　　[x+135*a,y+90*a]へ10*aの円描画。
　　[x+95*a,y+105*a,10*a,30*a]へ四角描画。
　　[x+80*a,y+150*a,40*a,10*a]へ四角描画。
ここまで。

●（x,yへ）操作盤とは
　　0に線太設定。「#888888」に線色設定。「#555555」に塗色設定。
　　[x,y,40,39]へ四角描画。　#左へ加速
　　[x+40,y,40,39]へ四角描画。　#停止
　　[x+80,y,40,39]へ四角描画。　#右へ加速
　　「#ffffff」に線色設定。「#ffffff」に塗色設定。
　　[[x+13,y+20],[x+28,y+12],[x+28,y+28]]で多角形描画。
　　[x+53,y+12,15,15]へ四角描画。
　　[[x+108,y+20],[x+93,y+12],[x+93,y+28]]で多角形描画。
ここまで。

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

🍯 なでしこ3貯蔵庫

[編集モード] Jumping Snowman

素材のアップロード