AI game creator

Click here for free DL of the app version that can save data.

No:3382

6728

←

Prev Next

→

become a kite
Developer sayaensm｜Date and time 23/6/24 19:03:07
Build time 43.797 sec｜Game capacity 3.593KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
	<title>Tako game</title>
	<meta charset="UTF-8">
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #66b2ff;
		}
		canvas {
			display: block;
			margin: auto;
			background-color: #ffff66;
		}
		#score {
			text-align: center;
			color: white;
			font-size: 24px;
			margin-top: 10px;
		}
	</style>
</head>
<body>
	<canvas id="gameCanvas" width="360" height="500"></canvas>
	<div id="score"></div>

// たこの情報
		var Tako = function() {
			this.width = 40;
			this.height = 40;
			this.x = canvas.width / 2 - this.width / 2;
			this.y = canvas.height - this.height * 2;
			this.image = new Image();
			this.image.src = "🐙";
			this.moveSpeed = 5;
			this.dead = false;
			this.life = 3;
		}
		Tako.prototype.draw = function() {
			ctx.drawImage(this.image, this.x, this.y, this.width, this.height);
		}
		Tako.prototype.moveLeft = function() {
			this.x -= this.moveSpeed;
			if (this.x <= 0) {
				this.x = 0;
			}
		}
		Tako.prototype.moveRight = function() {
			this.x += this.moveSpeed;
			if (this.x >= canvas.width - this.width) {
				this.x = canvas.width - this.width;
			}
		}
		Tako.prototype.hitTest = function(object) {
			var takoLeft = this.x;
			var takoRight = this.x + this.width;
			var takoTop = this.y;
			var takoBottom = this.y + this.height;
			var objectLeft = object.x;
			var objectRight = object.x + object.width;
			var objectTop = object.y;
			var objectBottom = object.y + object.height;

if (takoLeft > objectRight || takoRight < objectLeft || takoTop > objectBottom || takoBottom < objectTop) {
				return false;
			} else {
				return true;
			}
		}
		Tako.prototype.onHit = function() {
			this.life--;
			if (this.life <= 0) {
				this.dead = true;
				gameOver = true;
			}
		}

// さしみの情報
		var Sashimi = function() {
			this.width = 30;
			this.height = 30;
			this.x = Math.floor(Math.random() * (canvas.width - this.width));
			this.y = 0;
			this.image = new Image();
			this.image.src = "🍣";
			this.speed = 5 + Math.floor(Math.random() * 5);
			this.dead = false;
		}
		Sashimi.prototype.draw = function() {
			ctx.drawImage(this.image, this.x, this.y, this.width, this.height);
		}
		Sashimi.prototype.move = function() {
			this.y += this.speed;
			if (this.y >= canvas.height) {
				this.dead = true;
			}
		}

// 初期化
		function init() {
			canvas = document.getElementById("gameCanvas");
			ctx = canvas.getContext("2d");

tako = new Tako();

addEventListener("keydown", function(e) {
				if (e.key === "ArrowLeft") {
					tako.moveLeft();
				} else if (e.key === "ArrowRight") {
					tako.moveRight();
				}
			});

setInterval(function() {
				if (!gameOver) {
					ctx.clearRect(0, 0, canvas.width, canvas.height);

tako.draw();

if (Math.random() < 0.1) {
						sashimiList.push(new Sashimi());
					}

for (var i = 0; i < sashimiList.length; i++) {
						sashimiList[i].draw();
						sashimiList[i].move();

if (tako.hitTest(sashimiList[i])) {
							tako.onHit();
							sashimiList[i].dead = true;
						}

if (sashimiList[i].dead) {
							score++;
							sashimiList.splice(i, 1);
							i--;
						}
					}

ctx.fillText("Score: " + score, 10, 30);
					ctx.fillText("Life: " + tako.life, canvas.width - 100, 30);

} else {
					ctx.fillText("Game Over", canvas.width / 2 - 60, canvas.height / 2);
				}
			}, 1000 / 60);
		}

window.onload = init;
	</script>
</body>
</html>