Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 157

Warning: in_array() expects parameter 2 to be array, bool given in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 476

Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 484
A game in which you aim for your destination while avoiding oncoming cars's game | AI game creator

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

No:922

423

←

Prev Next

→

A game in which you aim for your destination while..ALL
Developer User3194｜Date and time 23/6/17 22:38:52
Build time 70.469 sec｜Game capacity 5.242KB｜

Script

対向車を避けよう！

Score: 0

タップしてスタート！

このゲームは、プレイヤーが車を操作し、対向車を避けながらできるだけ長い距離を移動することを目的としたゲームです。プレイヤーは左右キーを使用して車を動かします。対向車は画面上から下へ動き、プレイヤーが避けなければならない障害物として機能します。対向車に当たるとゲームオーバーになります。プレイヤーのスコアは、避けた対向車の数に基づいて計算されます。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>対向車を避けよう！</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #f5f5f5;
			font-family: Arial, sans-serif;
			text-align: center;
		}

#canvas {
			display: block;
			margin: 20px auto;
			border: 2px solid #444;
		}

h1 {
			margin: 20px auto;
			font-size: 30px;
			color: #444;
		}

#score {
			margin: 10px auto;
			color: #444;
			font-weight: bold;
			font-size: 20px;
		}

#message {
			margin: 10px auto;
			color: #444;
			font-weight: bold;
			font-size: 20px;
		}

.button {
			display: inline-block;
			padding: 10px 20px;
			background-color: #1abc9c;
			color: #fff;
			font-size: 20px;
			border-radius: 5px;
			cursor: pointer;
			margin: 20px;
			transition: all 0.3s ease-in-out;
		}

.button:hover {
			background-color: #148f77;
		}
	</style>
</head>
<body>
	<h1>対向車を避けよう！</h1>
	<canvas id="canvas" width="400" height="600"></canvas>
	<div id="score">Score: 0</div>
	<div id="message">タップしてスタート！</div>

// 車を描く関数
		function drawCar(x, y) {
			ctx.fillStyle = "#c0392b";
			ctx.fillRect(x, y, car.width, car.height);
			ctx.fillStyle = "#ffffff";
			ctx.fillRect(x + 10, y + 10, 10, 10);
			ctx.fillRect(x + 25, y + 10, 10, 10);
			ctx.fillRect(x + 10, y + 30, 25, 40);
			ctx.beginPath();
			ctx.arc(x + 15, y + 70, 10, 0, Math.PI * 2, false);
			ctx.arc(x + 35, y + 70, 10, 0, Math.PI * 2, false);
			ctx.fill();
		}

// 車を動かす関数
		function moveCar() {
			if (leftPressed) {
				car.x -= car.speed;
			} else if (rightPressed) {
				car.x += car.speed;
			}

if (car.x < 0) {
				car.x = 0;
			} else if (car.x + car.width > canvas.width) {
				car.x = canvas.width - car.width;
			}
		}

// 車を描画する関数
		function render() {
			ctx.clearRect(0, 0, canvas.width, canvas.height);

for (var i = 0; i < cars.length; i++) {
				ctx.fillStyle = "#2980b9";
				ctx.fillRect(cars[i].x, cars[i].y, cars[i].width, cars[i].height);
				ctx.fillStyle = "#ffffff"
				ctx.fillRect(cars[i].x + 5, cars[i].y + 5, 10, 10);
				ctx.fillRect(cars[i].x + 25, cars[i].y + 5, 10, 10);
				ctx.fillRect(cars[i].x + 5, cars[i].y + 25, 30, 40);
				ctx.beginPath();
				ctx.arc(cars[i].x + 15, cars[i].y + 70, 10, 0, Math.PI * 2, false);
				ctx.arc(cars[i].x + 35, cars[i].y + 70, 10, 0, Math.PI * 2, false);
				ctx.fill();

cars[i].y += cars[i].speed;

if (cars[i].y > canvas.height) {
					cars.splice(i, 1);
					score++;
					i--;
				}

if (cars[i].x < car.x + car.width && cars[i].x + cars[i].width > car.x &&
					cars[i].y < car.y + car.height && cars[i].y + cars[i].height > car.y) {
					clearInterval(intervalId);
					document.getElementById("message").innerHTML = "ゲームオーバー！";
					document.getElementById("score").innerHTML = "Score: " + score;
					document.getElementById("start-button").style.display = "inline-block";
				}
			}

drawCar(car.x, car.y);
			document.getElementById("score").innerHTML = "Score: " + score;
		}

// 車を生成する関数
		function createCar() {
			var x = Math.floor(Math.random() * canvas.width);
			var width = 40;
			var height = 80;
			var speed = 3;
			var car = {x, y: -height, width, height, speed};
			cars.push(car);
		}

// キーボードが押された時の処理
		document.addEventListener("keydown", function(event) {
			if (event.keyCode == 37) {
				leftPressed = true;
			} else if (event.keyCode == 39) {
				rightPressed = true;
			}
		});

// キーボードが離された時の処理
		document.addEventListener("keyup", function(event) {
			if (event.keyCode == 37) {
				leftPressed = false;
			} else if (event.keyCode == 39) {
				rightPressed = false;
			}
		});

// スタートボタンが押された時の処理
		document.getElementById("start-button").addEventListener("click", function() {
			score = 0;
			cars = [];
			car.x = 180;
			document.getElementById("message").innerHTML = "";
			document.getElementById("start-button").style.display = "none";
			intervalId = setInterval(function() {
				createCar();
			}, 1000);
			intervalId = setInterval(function() {
				moveCar();
				render();
			}, 20);
		});
	</script>