AI game creator

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

No:20361

←

Prev Next

→

Cartas lut
Developer User9019｜Date and time 23/10/9 6:55:14
Build time 14.893 sec｜Game capacity 2.654KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Cartas Lut</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			overflow: hidden;
		}
		canvas {
			background-color: #eee;
		}
	</style>
</head>
<body>
	<canvas id="gameCanvas"></canvas>
	<script>
		// Criação do objeto para representar cada carta
		function Carta(nome, ataque, defesa, imagem) {
			this.nome = nome;
			this.ataque = ataque;
			this.defesa = defesa;
			this.imagem = imagem;
		}

// Criação das cartas do jogo
		var carta1 = new Carta("Carta 1", 100, 50, "img/carta1.png");
		var carta2 = new Carta("Carta 2", 80, 70, "img/carta2.png");
		var carta3 = new Carta("Carta 3", 120, 30, "img/carta3.png");

// Função para iniciar o jogo
		function startGame() {
			// Criação do canvas e obtenção do contexto 2D
			var canvas = document.getElementById("gameCanvas");
			var context = canvas.getContext("2d");

// Carregamento das imagens das cartas
			var carta1Img = new Image();
			carta1Img.src = carta1.imagem;
			var carta2Img = new Image();
			carta2Img.src = carta2.imagem;
			var carta3Img = new Image();
			carta3Img.src = carta3.imagem;

// Evento de clique no canvas
			canvas.addEventListener("click", function(event) {
				// Obtém a posição do clique
				var clickX = event.clientX - canvas.offsetLeft;
				var clickY = event.clientY - canvas.offsetTop;

// Verifica se houve clique na região da carta 1
				if (clickX > 100 && clickX < 200 && clickY > 100 && clickY < 200) {
					alert("Você atacou com " + carta1.nome + "! Ataque: " + carta1.ataque);
				}
				// Verifica se houve clique na região da carta 2
				else if (clickX > 300 && clickX < 400 && clickY > 100 && clickY < 200) {
					alert("Você atacou com " + carta2.nome + "! Ataque: " + carta2.ataque);
				}
				// Verifica se houve clique na região da carta 3
				else if (clickX > 500 && clickX < 600 && clickY > 100 && clickY < 200) {
					alert("Você atacou com " + carta3.nome + "! Ataque: " + carta3.ataque);
				}
			});

// Função principal do jogo que atualiza o canvas
			function updateGameArea() {
				// Limpa o canvas
				context.clearRect(0, 0, canvas.width, canvas.height);

// Desenha as cartas na tela
				context.drawImage(carta1Img, 100, 100, 100, 100);
				context.drawImage(carta2Img, 300, 100, 100, 100);
				context.drawImage(carta3Img, 500, 100, 100, 100);

// Chama a função novamente após um intervalo de tempo
				requestAnimationFrame(updateGameArea);
			}

// Inicia a atualização do jogo
			updateGameArea();
		}

// Inicia o jogo ao carregar a página
		window.onload = startGame;
	</script>
</body>
</html>