Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Alterando velocidade para 0.9 #4

Open
wants to merge 12 commits into
base: master
Choose a base branch
from
Open

Alterando velocidade para 0.9 #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
a548686
adiciona um TODO para o gitday
alynnefs Oct 12, 2022
3587342
Alterando cores do jogo
gabrielapcustodio Oct 15, 2022
aef74df
Alterando velocidade para 0.9
gabrielapcustodio Oct 29, 2022
30d200c
Adicionando styles.css e placar
gabrielapcustodio Oct 31, 2022
b99c183
Adicionando Fim de Jogo ao placar, caso perca
gabrielapcustodio Oct 31, 2022
658110f
Corrigindo variável
gabrielapcustodio Oct 31, 2022
ea4a42d
Ajustando texto game over
gabrielapcustodio Oct 31, 2022
55cd4f0
Alterando display css
gabrielapcustodio Oct 31, 2022
04f5619
Alterando cor e tamanho da fonte do placar
gabrielapcustodio Oct 31, 2022
c9a4a54
Modificando posição inicial da fruta para aleatório
gabrielapcustodio Oct 31, 2022
bbb0078
Ajustando arquivos
gabrielapcustodio Oct 31, 2022
9b151ba
acrescentando css
gabrielapcustodio Nov 1, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 25 additions & 8 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,25 @@
<html>
<head>
<title>SNAKE!</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<section id="score">
<p id="title">PONTUAÇÃO
<div class="scoreDisplay"></div>
</p>
</section>
<canvas id="stage" width="600" height="600"></canvas>

<script type="text/javascript">
// TODO: Melhorar layout do jogo
// TODO: Incorporar score | botão de pausar

let scoreDisplay = document.querySelector(".scoreDisplay");
let score = 0;
let fimDeJogo = "FIM DE JOGO!!!!"
let posicaoInicial = Math.floor(Math.random() * (19 - 0 + 1)) + 0;

window.onload = function(){
var stage = document.getElementById('stage');
// contexto
Expand All @@ -18,7 +29,7 @@
document.addEventListener("keydown", keyPush);
setInterval(game, 60);
// velocidade
const vel = 1;
const vel = 1; // TODO: mudar a velocidade
// trajeto da cobrinha;
var trail = [];
// tamanho da cobra
Expand All @@ -29,14 +40,16 @@
var vx = vy = 0;
// posição da cabeça
var px = 10, py = 15;
// posicao da maçã - inicialmente 15,15
var ax = ay = 15;
// posicao da maçã - alterada para iniciar de forma aleatória
var ax = ay = posicaoInicial;

// chama a função game - onde vai estar toda a lógica do jogo que será atualizada no intervalo de tempo abaio
function game(){
px += vx;
py += vy;

scoreDisplay.innerHTML = score;

// se a cobra chega na borda esquerda -> ela é redirecionada pra borda direita
// os 4 ifs abaixo se referem a essa troca de posição da cobrinha
// esquerda -> direita
Expand All @@ -57,16 +70,16 @@
}

// pintando o stage
ctx.fillStyle = "gray";
ctx.fillStyle = "rgb(209, 218, 226)";
ctx.fillRect(0, 0, stage.width, stage.height);

// pintando a maçã
ctx.fillStyle = "red";
// pintando a fruta
ctx.fillStyle = "rgb(190, 47, 226)";
ctx.fillRect(ax*lp, ay*lp, lp, lp);

// pintando a cobra

ctx.fillStyle = "green";
ctx.fillStyle = "rgb(76, 241, 126)";
// verificações
for(var i = 0; i < trail.length; i++){
// pintando o rastro na posicao i
Expand All @@ -76,6 +89,8 @@
if (trail[i].x == px && trail[i].y == py){
vx = vy = 0;
tail = 5;
score = 0
scoreDisplay.textContent = fimDeJogo;
// TODO: fazer tratamento para aparecer imagem de GAMEOVER
}
}
Expand All @@ -91,6 +106,8 @@
tail++;
ax = Math.floor(Math.random()*qp);
ay = Math.floor(Math.random()*qp);
score++;
scoreDisplay.textContent = score;
}
}

Expand Down Expand Up @@ -120,4 +137,4 @@
}
</script>
</body>
</html>
</html>
22 changes: 22 additions & 0 deletions styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
body{
display:grid;
justify-content: center;
}
#score{
font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
font-size:medium;
font-weight: 700;
text-align: center;
width: 33vw;
margin: none;
border-radius: 3px;
padding-bottom: 15px;
padding-top: 15px;

}
#title{
font-size: 22px;
}
.scoreDisplay{
font-size: 18px;
}