2526-web/Kelompok04-UlardanApel-Wenzel-Daud-Boanerges
2526-web/Kelompok04-UlardanApel-Wenzel-Daud-Boanerges
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

P

Browse Source
This commit is contained in:
JERRY F 2025-12-07 22:40:54 +07:00
parent 06ffdaaf7d
commit 0bec0e3f83
2 changed files with 320 additions and 330 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
GameLogic.js
View File

@ -20,20 +20,20 @@
const persiapan = document.getElementById("start"); const persiapan = document.getElementById("start");
//generate gambar external //generate gambar external
var KepalaUlarImage = new Image(); var KepalaKeKanan = new Image();
KepalaUlarImage.src = "image/KepalaHorizontalKanan.png"; KepalaKeKanan.src = "image/KepalaHorizontalKanan.png";
var KepalAtas = new Image(); var KepalaKeAtas = new Image();
KepalAtas.src = "image/KepalaVertikalAtas.png"; KepalaKeAtas.src = "image/KepalaVertikalAtas.png";
var KepalaBawah = new Image(); var KepalaKeKiri = new Image();
KepalaBawah.src = "image/KepalaVertikalBawah.png"; KepalaKeKiri.src = "image/KepalaVertikalBawah.png";
var KepalaKiri = new Image(); var KepalaKeBawah = new Image();
KepalaKiri.src = "image/KepalaHorizontalKiri.png"; KepalaKeBawah.src = "image/KepalaHorizontalKiri.png";
var KepalaKanan = new Image();
KepalaKanan.src = "image/KepalaHorizontalKanan.png";
// ↑ kepala ular // ↑ kepala ular
var BadanUlarImage = new Image(); var BadanHori = new Image();
BadanUlarImage.src = "image/BadanVertikal.png"; BadanHori.src = "image/BadanHorizontal.png";
var BadanVerti = new Image();
BadanVerti.src = "image/BadanVertical.png";
// ↑ badan ular // ↑ badan ular
var ApelImage = new Image(); var ApelImage = new Image();
@ -49,7 +49,7 @@
RandomizeApel(); RandomizeApel();
//mastiin gambar external generate dulu sebelum game start //mastiin gambar external generate dulu sebelum game start
KepalaUlarImage.onload = function () { KepalaKeKanan.onload = function () {
function gameLoop() {} function gameLoop() {}
}; };
@ -66,15 +66,11 @@
} }
//buat ngatur batu spwan apa ga nanti //buat ngatur batu spwan apa ga nanti
document document.getElementById("mode-normal").addEventListener("click", function () {
.getElementById("mode-normal")
.addEventListener("click", function () {
StartingGame(false); StartingGame(false);
}); });
document document.getElementById("mode-tambahan").addEventListener("click", function () {
.getElementById("mode-tambahan")
.addEventListener("click", function () {
StartingGame(true); StartingGame(true);
}); });
@ -177,12 +173,7 @@
score = amount > 0 ? score + amount : 0; score = amount > 0 ? score + amount : 0;
highscore = score > highscore ? score : highscore; highscore = score > highscore ? score : highscore;
Text.innerHTML = Text.innerHTML =
"Score: " + "Score: " + score + "<br>Highscore: " + highscore + "<br>Speed: " + speed;
score +
"<br>Highscore: " +
highscore +
"<br>Speed: " +
speed;
PenambahanTembok(); PenambahanTembok();
} }
@ -217,33 +208,33 @@
var posisiKepalaImage; var posisiKepalaImage;
if (Ular.dx === grid) { if (Ular.dx === grid) {
// KANAN // KANAN
posisiKepalaImage = KepalaKanan; posisiKepalaImage = KepalaKeKanan;
} else if (Ular.dx === -grid) { } else if (Ular.dx === -grid) {
// KIRI // KIRI
posisiKepalaImage = KepalaKiri; posisiKepalaImage = KepalaKeKiri;
} else if (Ular.dy === -grid) { } else if (Ular.dy === -grid) {
// ATAS // ATAS
posisiKepalaImage = KepalAtas; posisiKepalaImage = KepalaKeBawah;
} else if (Ular.dy === grid) { } else if (Ular.dy === grid) {
// BAWAH // BAWAH
posisiKepalaImage = KepalaBawah; posisiKepalaImage = KepalaKeAtas;
} else { } else {
// Default, misalnya saat game baru mulai (dx=grid, dy=0, atau default awal) // Default, misalnya saat game baru mulai (dx=grid, dy=0, atau default awal)
posisiKepalaImage = KepalaKanan; posisiKepalaImage = KepalaKeKanan;
} }
content.drawImage(posisiKepalaImage, cell.x, cell.y, grid, grid); content.drawImage(posisiKepalaImage, cell.x, cell.y, grid, grid);
} else { } else {
content.drawImage(BadanUlarImage, cell.x, cell.y, grid, grid); content.drawImage(BadanHori, cell.x, cell.y, grid, grid);
} }
}); });
//bagian generate ular //bagian generate ular
Ular.cells.forEach(function (cell, index) { Ular.cells.forEach(function (cell, index) {
if (index === 0) { if (index === 0) {
content.drawImage(KepalaUlarImage, cell.x, cell.y, grid, grid); content.drawImage(KepalaKeKanan, cell.x, cell.y, grid, grid);
} else { } else {
content.drawImage(BadanUlarImage, cell.x, cell.y, grid, grid); content.drawImage(BadanHori, cell.x, cell.y, grid, grid);
} }
//buat pas ular makan Apel //buat pas ular makan Apel
@ -264,8 +255,7 @@
//buat pas ular mati kena badan sendiri //buat pas ular mati kena badan sendiri
for (var i = index + 1; i < Ular.cells.length; i++) for (var i = index + 1; i < Ular.cells.length; i++)
if (cell.x === Ular.cells[i].x && cell.y === Ular.cells[i].y) if (cell.x === Ular.cells[i].x && cell.y === Ular.cells[i].y) GameOver();
GameOver();
}); });
} }
@ -329,9 +319,9 @@
if (e.code === "KeyE" || e.code == "KeyQ") if (e.code === "KeyE" || e.code == "KeyQ")
speed = speed =
e.code == "KeyE" && speed > 5 e.code == "KeyE" && speed > 2
? speed - 1 ? speed - 1
: e.code == "KeyQ" && speed < 15 : e.code == "KeyQ" && speed < 30
? speed + 1 ? speed + 1
: speed; : speed;
}); });

2
game.html
View File

@ -17,7 +17,7 @@
<h1>Snake</h1> <h1>Snake</h1>
</div> </div>
</header> </header>
<img src="" alt="">
<!-- main konten --> <!-- main konten -->
<div class="HalamanFull"> <div class="HalamanFull">
<canvas width="1056" height="480" id="game"></canvas> <canvas width="1056" height="480" id="game"></canvas>