コード
<!DOCTYPE html>
<html>
<head>
<title>FieldWalk8</title>
<meta charset="UTF-8">
<script>
var map0 = [
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 96, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 15],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[11, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 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, 08, 09, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 13, 08, 08, 08, 08, 08, 08, 08],
];
var map1 = [
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 08, 09, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 08, 09, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 08, 09, 09, 09, 09, 99, 08, 09, 09, 08, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 09, 10],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 09, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 12, 08, 08, 08, 08, 08, 08],
];
var map2 = [
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 11, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 09, 08, 08, 08, 08, 08, 08],
[08, 08, 94, 09, 09, 08, 08, 08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 08, 09, 09, 09, 09, 09, 09, 08, 08, 08, 09, 08, 09, 08, 09, 08, 08],
[08, 08, 09, 08, 09, 08, 08, 09, 08, 09, 08, 09, 09, 09, 08, 09, 08, 09, 08, 08],
[08, 08, 09, 08, 09, 08, 08, 09, 08, 09, 09, 09, 08, 09, 09, 09, 08, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 08, 09, 08, 08, 08, 09, 08, 08, 08, 09, 08, 08],
[08, 08, 09, 08, 08, 08, 08, 09, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 13],
[08, 08, 09, 09, 09, 09, 09, 09, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
];
var map3 = [
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 10, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 09, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 08, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 08, 09, 09, 09, 09, 09, 08, 09, 08, 09, 08, 09, 08, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 09, 08, 08, 08],
[12, 09, 09, 09, 09, 08, 09, 09, 08, 09, 09, 08, 09, 08, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 09, 09, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
];
var map4 = [
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 96, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 15],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[11, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 08, 08],
[08, 08, 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, 08, 09, 08, 08, 08, 08, 08, 08, 08],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 13, 08, 08, 08, 08, 08, 08, 08],
];
var map5 = [
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 27, 27, 18, 27],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 27, 27, 30, 27],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 27, 30, 27],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 30, 27],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 27, 30, 27],
[10, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 16],
[08, 08, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 09, 27, 27, 27],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 27, 27],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 27, 27, 27],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 27, 27, 27, 27],
[08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 08, 27, 27, 27, 27, 27, 27],
];
var map6 = [
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 29, 02, 29, 29, 27, 27, 27, 29, 29, 29, 27, 27, 27, 29, 29, 29, 96, 27],
[27, 27, 29, 27, 27, 02, 29, 29, 27, 29, 27, 29, 29, 27, 02, 29, 27, 29, 27, 27],
[27, 27, 29, 27, 29, 29, 27, 29, 02, 29, 27, 27, 29, 27, 27, 27, 27, 29, 27, 27],
[15, 29, 29, 29, 29, 27, 27, 27, 29, 27, 27, 02, 29, 29, 29, 29, 29, 29, 27, 27],
[27, 27, 29, 27, 29, 29, 27, 29, 29, 02, 27, 27, 29, 27, 27, 27, 27, 29, 27, 27],
[27, 27, 29, 27, 27, 29, 29, 29, 27, 29, 27, 29, 29, 27, 02, 02, 27, 29, 27, 27],
[27, 27, 29, 29, 29, 29, 27, 27, 27, 02, 29, 02, 27, 27, 27, 29, 29, 29, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 29, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 17, 27, 27],
];
var map7 = [
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 16, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 29, 27, 27],
[27, 27, 93, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 96, 27],
[27, 27, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 27, 27],
[27, 27, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 27, 27],
[27, 27, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 27, 27],
[27, 27, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 27, 27],
[27, 27, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 27, 27],
[27, 27, 27, 03, 03, 27, 52, 52, 27, 53, 53, 27, 54, 54, 27, 55, 55, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
];
var map8 = [
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 29, 29, 29, 29, 29, 29, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 29, 29, 98, 29, 29, 29, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 29, 29, 29, 29, 29, 29, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 29, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 29, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 27],
[27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 15, 27],
];
var map =[map0, map1, map2, map3, map4, map5, map6, map7, map8];
var cv, gc, gp=0, gpw=1, stage=0, px=12, py=6, flag1=false, flag4=false, flag2=false, flag3=false;
function init() {
cv = document.getElementById("field");
gc = cv.getContext("2d");
window.addEventListener("keydown", fieldkeydown);
fieldpaint();
}
function fieldkeydown(e) {
var dx = px, dy = py;
switch (e.keyCode) {
case 37: dx--; break;
case 38: dy--; break;
case 39: dx++; break;
case 40: dy++; break;
}
var mpt = map[stage][dy][dx];
if (mpt==07 || mpt==09 || mpt==29 || mpt==30) {
px = dx;
py = dy;
fieldpaint();
}
if (mpt==02) {
px = dx;
py = dy;
gp+=gpw;
fieldpaint();
}
else if (mpt==10 || mpt==11 || mpt==12 || mpt==13 || mpt==14 || mpt==15 || mpt==16 || mpt==17 || mpt==18) {
stage = mpt-10;
switch (e.keyCode) {
case 37: case 39: px = 19-dx; py = dy; break; //左or右
case 38: case 40: px = dx; py = 10-dy; break; //上or下
}
fieldpaint();
}
else if (mpt==93 || mpt==94 || mpt==95 || mpt==96 || mpt==97 || mpt==99) {
px = dx;
py = dy;
switch (e.keyCode) {
case 65: gp+=gp; break;
}
fieldpaint();
eventpaint(mpt);
}
else if (mpt==98) {
px = dx;
py = dy;
switch (e.keyCode) {
case 65: gp+=gpw; break;
}
fieldpaint();
eventpaint(mpt);
}
else if (mpt==03 && gp>=10) {
px = dx;
py = dy;
gp-=10;
gpw+=1;
fieldpaint();
}
else if (mpt==52 && gp>=100) {
px = dx;
py = dy;
gp-=100;
gpw+=10;
fieldpaint();
}
else if (mpt==53 && gp>=1000) {
px = dx;
py = dy;
gp-=1000;
gpw+=100;
fieldpaint();
}
else if (mpt==54 && gp>=10000) {
px = dx;
py = dy;
gp-=10000;
gpw+=1000;
fieldpaint();
}
else if (mpt==55 && gp>=100000) {
px = dx;
py = dy;
gp-=100000;
gpw+=10000;
fieldpaint();
}
else if (mpt==04 && gp>=1000) {
px = dx;
py = dy;
gp-=1000;
gpw+=10000;
fieldpaint();
}
}
function fieldpaint() {
gc.fillStyle = "rgba(34, 139, 34, 1)";
gc.fillRect(0, 0, 800, 440);
var y, x;
for (y = 0; y < map[stage].length; y++) {
for (x = 0; x < map[stage][y].length; x++) {
var mpt = map[stage][y][x];
if (mpt==07 || mpt==08 || mpt==97) {
gc.drawImage(imgForest, x * 40, y * 40, 40, 40);
}
else if (mpt==28 || mpt==29 || mpt==16 || mpt==17) {
gc.drawImage(imgWall, x * 40, y * 40, 40, 40);
}
else if (mpt==02) {
gc.drawImage(imggp, x * 40, y * 40, 40, 40);
}
else if (mpt==27 || mpt==30 || mpt==18) {
gc.drawImage(imgiwa, x * 40, y * 40, 40, 40);
}
else if (mpt==03) {
gc.drawImage(imggpw, x * 40, y * 40, 40, 40);
}
else if (mpt==52) {
gc.drawImage(imglv2, x * 40, y * 40, 40, 40);
}
else if (mpt==53) {
gc.drawImage(imglv3, x * 40, y * 40, 40, 40);
}
else if (mpt==54) {
gc.drawImage(imglv4, x * 40, y * 40, 40, 40);
}
else if (mpt==55) {
gc.drawImage(imglv5, x * 40, y * 40, 40, 40);
}
else if (mpt==96) {
gc.drawImage(imgmenu, x * 40, y * 40, 40, 40);
}
else if (mpt==93) {
gc.drawImage(imgkan, x * 40, y * 40, 40, 40);
}
else if (mpt==98) {
gc.drawImage(imgkinkai, x * 40, y * 40, 40, 40);
}
else if(mpt==94 || mpt==99) {
gc.drawImage(imgEventPoint, x * 40, y * 40, 40, 40);
}
else if {
gc.drawImage(imgmain, px * 40, py * 40, 40, 40);
}
}
}
function eventpaint(evnum) {
document.getElementById("sound").play();
gc.fillStyle = "Black";
gc.fillRect(200, 20, 400, 400);
var imgev = document.getElementById("Event"+evnum+"");
gc.drawImage(imgev, 350, 50, 100, 100);
gc.fillStyle = "White";
gc.font = "12px serif";
switch (evnum) {
case 93:
gc.fillText("ここはかじやだ", 250, 200);
gc.fillText("ひだりしたのマスをふむと", 250, 210);
gc.fillText("きんを10つかってさいくつりょくを1あげる", 250, 220);
gc.fillText("みぎにいくごとにひようとぞうかちを10ばいにする", 250, 230);
break;
case 94:
if(flag4==false) {
flag4=true
gc.fillText("やあ、いまさいくつできるひとをさがしているんだ", 250, 200);
gc.fillText("もしきみがきんを10000こさいくつできたら", 250, 215);
gc.fillText("なかまにするよ", 250, 230);
}
else if(flag4==true && gp>=10000){
gc.fillText("すごいさいくつできたんだ", 250, 200);
gc.fillText("ぜひなかまになってくれ", 250, 215);
gc.fillText("ゲームクリア", 250, 250);
}
else {
gc.fillText("きんはどうくつにあるよ", 250, 200);
gc.fillText("ふむことでさいくつできるんだ", 250, 215);
}
break;
case 96:
gc.fillText(`金${gp}こ`, 250, 200);
gc.fillText(`採掘力${gpw}`, 250, 230);
break;
case 98:
gc.fillText("おおきなきんをはっけんした", 285, 200);
gc.fillText("Aをおすとさいくつできます", 285, 230);
gc.fillText(`${gp}こ`, 285, 260);
break;
case 99:
gc.fillText("ずっとおもっていることがあるんだが", 285, 200);
gc.fillText("あのどうくついりぐちがほそすぎる", 285, 230);
gc.fillText("なにかありそう", 285, 260);
break;
}
}
</script>
</head>
<body onload="init()">
<canvas id="field" width="800" height="440"></canvas>
<img id="imgForest" src="imgForest.png" style="display:none" />
<img id="imggp" src="imggp.png" style="display:none" />
<img id="imggpw" src="imggpw.png" style="display:none" />
<img id="imglv2" src="imglv2.png" style="display:none" />
<img id="imglv3" src="imglv3.png" style="display:none" />
<img id="imglv4" src="imglv4.png" style="display:none" />
<img id="imglv5" src="imglv5.png" style="display:none" />
<img id="imgiwa" src="imgiwa.png" style="display:none" />
<img id="imgkan" src="imgkan.png" style="display:none" />
<img id="imgkinkai" src="imgkinkai.png" style="display:none" />
<img id="imgmenu" src="imgmenu.png" style="display:none" />
<img id="imgmain" src="imgmain.png" style="display:none" />
<img id="imgSlime" src="imgSlime.png" style="display:none" />
<img id="imgGate" src="imgGate.png" style="display:none" />
<img id="imgWall" src="imgWall.png" style="display:none" />
<img id="imgEventPoint" src="imgEventPoint.png" style="display:none" />
<img id="Event93" src="imgkan.png" style="display:none" />
<img id="Event94" src="imgHuman.png" style="display:none" />
<img id="Event96" src="imgmenu.png" style="display:none" />
<img id="Event98" src="imgkinkai.png" style="display:none" />
<img id="Event99" src="imgHuman.png" style="display:none" />
<audio src="sound.mp3" id="sound"></audio>
</body>
</html>