Subway train driving game's game

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

No:1162

115

←

Prev Next

→

Subway train driving game
Developer TimoshQ｜Date and time 23/6/18 6:39:22
Build time 32.657 sec｜Game capacity 2.935KB｜

Script

Description: This is a subway train driving game where you have to avoid obstacles and score as many points as possible. Use the up and down arrow keys to move the train. Press Enter to start the game. Avoid the red obstacles by moving the train up and down on the track. If the train hits an obstacle, the game will be over. Your score is displayed on the top-right corner. Have fun playing! 🎮🚊

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>Subway Train Driving Game</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: black;
			color: white;
			font-size: 20px;
			text-align: center;
		}

canvas {
			border: 1px solid white;
			background-color: gray;
		}

#score {
			position: absolute;
			top: 10px;
			right: 10px;
			font-size: 30px;
		}
	</style>
</head>
<body>

// Game Functions
		function drawTrain() {
			var train = new Image();
			train.src = "🚆";
			ctx.drawImage(train, trainX, trackY - 30);
		}

function drawTrack() {
			ctx.fillStyle = "white";
			ctx.fillRect(trackX, trackY, 100, trackHeight);
		}

function moveObstacle() {
			obstacleX -= speed;
			if (obstacleX < -obstacleWidth) {
				obstacleX = width;
			}
			ctx.fillStyle = "red";
			ctx.fillRect(obstacleX, obstacleY, obstacleWidth, obstacleHeight);
		}

function gameOver() {
			isPlaying = false;
			alert("Game Over! Your Score: " + score.innerText);
			location.reload();
		}

function updateScore() {
			score.innerText = parseInt(score.innerText) + 1;
		}

function checkCollision() {
			if (trainX + 50 > obstacleX && trainX < obstacleX + obstacleWidth && trackY + trackHeight - 30 > obstacleY && trackY - 30 < obstacleY + obstacleHeight) {
				gameOver();
			}
		}

function gameLoop() {
			if (isPlaying) {
				ctx.clearRect(0, 0, width, height);
				drawTrain();
				drawTrack();
				moveObstacle();
				checkCollision();
				updateScore();
				window.requestAnimationFrame(gameLoop);
			}
		}

// Game Controls
		document.addEventListener('keydown', function(event) {
			if (event.key === "Enter") {
				isPlaying = true;
				gameLoop();
			}
			if (event.key === "ArrowUp" && trainX > trackX) {
				trainX -= 10;
			}
			if (event.key === "ArrowDown" && trainX < trackX + 100 - 50) {
				trainX += 10;
			}
		});

</script>
</body>
</html>