p5实现射击虫子类小游戏代码-html代码-BFW代码库

代码语言：html

所属分类：游戏

代码描述：p5实现射击虫子类小游戏代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  


  
  
  
<style>
@import url("https://fonts.googleapis.com/css2?family=Pixelify+Sans:wght@700&display=swap");

html,
body {
	margin: 0;
	padding: 0;
}

canvas {
	display: block;
	cursor: crosshair;
	overflow: none;
}

.footer {
	position: fixed;
	bottom: 10px;
	right: 10px;
	color: white;
	font-size: 12px;
	text-align: right;
	font-family: monospace;
	pointer-events: none;
}

.footer a {
	color: white;
	text-decoration: none;
}
</style>

  
</head>

<body>
  <div class="footer">
	Made with ❤️ by Marcus | Visit <a href="h" target="_blank">Shopblocks</a>
</div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5.1.4.0.js"></script>
      <script >
const tileSize = 32;

let isGamePaused = false;
let spiders = [];
let player;
let spiderSpawnTime = 300;
let spiderMaxSpeed = 1.2;
let frame = 0;
let score = 0;
let highScore = 0;

// Preload images
let playerSprite;
let spiderSprite;

function preload() {
	playerSprite = loadImage(
		"//repo.bfw.wiki/bfwrepo/images/shoot/spiritsone.png"
	);
	spiderSprite = loadImage(
		"//repo.bfw.wiki/bfwrepo/images/shoot/spiritstwo.png"
	);
}

let touches = [];
let isMobileDevice = false;

function setup() {
	canvas = createCanvas(windowWidth, windowHeight);
	canvas.elt.setAttribute("style", "display: block");
	pixelDensity(1);
	player = new Player();

	for (let i = 0; i < 42; i++) {
		spiders.push(new Spider(random(spiderMaxSpeed)));
	}

	// Detect if it's a mobile device
	detectMobile();

	if (isMobileDevice) {
		// Add touch event listeners for player movement and shooting
		canvas.mousePressed(() => {
			// Trigger shooting on touch (for mobile devices)
			if (mouseButton === LEFT) {
				player.shoot();
			}
		});

		// Add touch event listeners for player movement
		canvas.touchStarted(handleTouch);
		canvas.touchMoved(handleTouch);
		canvas.touchEnded(handleTouch);
	}

	const savedHighScore = localStorage.getItem("highScore");
	if (savedHighScore) {
		highScore = parseInt(savedHighScore);
	}
}

function handleTouch(event) {
	touches = event.touches;
}

// Detect if it's a mobile device
function detectMobile() {
	if (
		/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
			navigator.userAgent
		)
	) {
		isMobileDevice = true;
	}
}

function windowResized() {
	resizeCanvas(windowWidth, windowHeight);
}

function handleGameOver() {
	isGamePaused = true;

	if (score > highScore) {
		highScore = score; // Update the high score
		localStorage.setItem("highScore", highScore); // Save the high score to local storage
	}
}

function draw() {
	if (isGamePaused) {
		// Display the pause screen with a transparent background
		background(0, 0, 0, 200); // Transparent black background
		textSize(32);
		fill(255);
		textAlign(CENTER);
		text("Game Over", width / 2, height / 2 - 100);
		text("Current Score: " + score, width / 2, height / 2);
		text("High Score: " + highScore, width / 2, height / 2 + 50);

		// Draw the "Restart" button (you can customize the appearance)
		fill(100, 100, 200);
		rectMode(CENTER); // Set the rectangle mode to CENTER
		rect(width / 2, height / 2 + 117, 150, 50);
		fill(255);
		textSize(24); // Adjust text size
		text("Restart", width / 2, height / 2 + 125); // Center the text
		textSize(32); // Restore the text size for other text

		// Handle player input to restart the game
		if (mouseIsPressed) {
			// Check if the mouse is over the "Restart" button
			if (
				mouseX > width / 2 - 75 &&
				mouseX < width / 2 + 75 &&
				mouseY > height / 2 + 75 &&
				mouseY < height / 2 + 125
			) {
				restart();
				isGamePaused = false; // Unpause the game
			}
		}
	} else {
		// Normal game loop
		background(97, 87, 97);
		rectMode(CENTER);

		player.draw();
		player.update();
		player.animate();

		for (let i = spiders.length - 1; i >= 0; i--) {
			spiders[i].draw();
			spiders[i].update();

			if (spiders[i].ateYou()) {
				restart();
				break;
			}

			if (player.hasShot(spiders[i])) {
				score++;
				spiders.splice(i, 1);
			}
		}

		if (frame >= random(spiderSpawnTime, spiderSpawnTime * 1.2)) {
			spiders.push(new Spider(random(spiderMaxSpeed)));
			spiderSpawnTime *= 0.95;
			frame = 0;
		}

		if (frameCount % 1000 == 0) {
			spiderMaxSpeed += 0.1;
		}

		frame++;

		// Draw the score.........完整代码请登录后点击上方下载按钮下载查看