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

No:31646

Automatic Subway The game is about riding self-dr..ALL
Developer User15214｜Date and time 23/12/28 2:43:22
Build time 25.577 sec｜Game capacity 2.859KB｜

Script

Automatic Subway - The Game

Score: 0

In this game, you ride self-driving subway trains by clicking on pictograms of different types of trains that appear on the screen. The game starts when you click the "Start" button and stops when you click the "Stop" button. Your score is displayed on the screen which increases every time you click on a correct pictogram. Once you stop the game, an alert dialog will appear showing your final score. The game can be played in a smartphone's web browser. Please note that in order to show pictograms correctly, the device should support emoji display.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
	<title>Automatic Subway - The Game</title>
	<style>
		body {
			background-color: #eee;
			text-align: center;
		}
		#container {
			width: 300px;
			margin: 20px auto;
			border: 1px solid #aaa;
			padding: 10px;
		}
		#gameArea {
			padding: 10px;
			background-color: #fff;
			border: 1px solid #ccc;
			height: 200px;
			margin-bottom: 10px;
			overflow-y: scroll;
			overflow-x: hidden;
		}
		#score {
			margin-top: 10px;
		}
		#controls {
			margin-top: 10px;
		}
		.btn {
			display: inline-block;
			margin: 5px;
			padding: 10px 20px;
			background-color: #4CAF50;
			border: none;
			color: #fff;
			text-align: center;
			text-decoration: none;
			font-size: 16px;
			cursor: pointer;
		}
		.btn:hover {
			background-color: #45a049;
		}
	</style>
</head>
<body>
	<div id="container">
		<h1>Automatic Subway - The Game</h1>
		<div id="gameArea"></div>
		<h2 id="score">Score: 0</h2>
		<div id="controls">
			<button class="btn" onclick="startGame()">Start</button>
			<button class="btn" onclick="stopGame()">Stop</button>
		</div>
	</div>
	<script>
	// Game Variables
	let score = 0;
	let gameInterval;
	
	// Pictograms
	const pictograms = [
		"🚆", "🚌", "🚇", "🚝", "🚄", "🚋", "🚈", "🚂"
	];
	
	// Game Area Element
	const gameArea = document.getElementById("gameArea");
	
	// Function to start the game
	function startGame() {
		gameInterval = setInterval(addPictogram, 1000);
	}
	
	// Function to stop the game
	function stopGame() {
		clearInterval(gameInterval);
		alert("Game Over! Final Score: " + score);
		score = 0;
		updateScore();
		gameArea.innerHTML = "";
	}
	
	// Function to add a random pictogram to game area
	function addPictogram() {
		const randomIndex = Math.floor(Math.random() * pictograms.length);
		const pictogram = pictograms[randomIndex];
		gameArea.innerHTML += pictogram;
	}
	
	// Function to update the score
	function updateScore() {
		document.getElementById("score").textContent = "Score: " + score;
	}
	
	// Function to handle pictogram click
	gameArea.addEventListener("click", function(event) {
		const target = event.target;
		const pictogram = target.textContent;
		if (pictograms.includes(pictogram)) {
			target.remove();
			score++;
			updateScore();
		}
	});
	</script>
</body>
</html>
```

Please note that in order to show pictograms correctly, the device should support emoji display.