Fighting one punch man 3-D's game

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

No:25393

126

←

Prev Next

→

Fighting one punch man 3-D
Developer User12419｜Date and time 23/11/21 7:25:15
Build time 75.876 sec｜Game capacity 2.284KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>Fighting One Punch Man 3-D</title>
	<style>
		canvas {
			border: 1px solid black;
		}
	</style>
</head>
<body>
	<script>
		// Create a canvas element
		var canvas = document.createElement("canvas");
		canvas.width = 800;
		canvas.height = 600;
		document.body.appendChild(canvas);
		
		// Get the 2D rendering context
		var context = canvas.getContext("2d");
		
		// Game variables
		var playerX = canvas.width / 2;
		var playerY = canvas.height / 2;
		var playerSize = 50;
		var enemyX = Math.random() * canvas.width;
		var enemyY = Math.random() * canvas.height;
		var enemySize = 50;
		var score = 0;
		
		// Function to draw the player
		function drawPlayer() {
			var playerImage = new Image();
			playerImage.src = "player.png"; // Replace with the path to your player image
			context.drawImage(playerImage, playerX - playerSize/2, playerY - playerSize/2, playerSize, playerSize);
		}
		
		// Function to draw the enemy
		function drawEnemy() {
			var enemyImage = new Image();
			enemyImage.src = "enemy.png"; // Replace with the path to your enemy image
			context.drawImage(enemyImage, enemyX - enemySize/2, enemyY - enemySize/2, enemySize, enemySize);
		}
		
		// Function to update the game
		function update() {
			// Clear the canvas
			context.clearRect(0, 0, canvas.width, canvas.height);
			
			// Update player position based on input
			
			// TODO: Handle player movement using smartphone controls
			// Example: playerX += 2; // Move player to the right by 2 pixels
			
			// Draw the player and enemy
			drawPlayer();
			drawEnemy();
			
			// Check for collision between player and enemy
			var dx = playerX - enemyX;
			var dy = playerY - enemyY;
			var distance = Math.sqrt(dx * dx + dy * dy);
			
			if (distance < playerSize/2 + enemySize/2) {
				// Player and enemy collide, increase score and reset enemy position
				score++;
				enemyX = Math.random() * canvas.width;
				enemyY = Math.random() * canvas.height;
			}
			
			// Display the score on the screen
			context.font = "20px Arial";
			context.fillStyle = "black";
			context.fillText("Score: " + score, 10, 30);
			
			// Request the next animation frame
			requestAnimationFrame(update);
		}
		
		// Start the game
		update();
	</script>
</body>
</html>