Skip to content

Create JJk.html #1795

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

Closed
bkhiemm wants to merge 1 commit into from
Closed

Create JJk.html #1795

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
55 changes: 55 additions & 0 deletions JJk.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<!DOCTYPE html>
<html>
<head>
<title>JJK Mobile Game</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body { background: #1a1a1a; color: #fff; font-family: sans-serif; text-align: center; }
#game-box { border: 2px solid #7d2ae8; margin: 20px auto; padding: 20px; max-width: 90%; border-radius: 10px; }
button { background: #7d2ae8; color: white; border: none; padding: 10px 20px; margin: 5px; border-radius: 5px; font-weight: bold; }
#status { color: #ff4757; font-weight: bold; margin: 15px 0; }
.hp-bar { background: #444; height: 20px; width: 100%; border-radius: 10px; margin-bottom: 10px; }
#hp-fill { background: #2ed573; height: 100%; width: 100%; border-radius: 10px; transition: 0.5s; }
</style>
</head>
<body>
<h2>JUJUTSU KAISEN: CỬA TỬ</h2>
<div id="game-box">
<p>Đang đối đầu với: <strong>Nguyền Hồn Cấp Đặc Biệt</strong></p>
<div class="hp-bar"><div id="hp-fill"></div></div>
<p id="message">Bạn nhìn thấy một thực thể đáng sợ. Hãy chọn chiêu thức!</p>
<div id="status"></div>
<button onclick="attack('Black Flash')">Hắc Thiểm (70% trúng)</button>
<button onclick="attack('Divergent Fist')">Kính Đấm (Chắc chắn trúng)</button>
</div>

<script>
let bossHP = 100;
function attack(move) {
let damage = 0;
let msg = "";
if(move === 'Black Flash') {
if(Math.random() > 0.3) {
damage = 35;
msg = "KHOẢNH KHẮC CỦA TIA CHỚP ĐEN! Bạn gây " + damage + " sát thương!";
} else {
msg = "Hắc thiểm thất bại! Bạn bị phản đòn!";
}
} else {
damage = 15;
msg = "Bạn dùng Kính Đấm trúng đích! Gây " + damage + " sát thương.";
}
Comment on lines +27 to +41
Copy link
Contributor

@gemini-code-assist gemini-code-assist bot Jan 3, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The script uses several "magic numbers" and strings (e.g., 100, 'Black Flash', 0.3, 35, 15). Hardcoding these values makes the code harder to read, maintain, and balance. Consider defining them as constants at the top of the script with descriptive names. This will make your game logic much clearer and easier to tweak in the future.

For example:

const BOSS_MAX_HP = 100;
const BLACK_FLASH_HIT_CHANCE = 0.7; // (1 - 0.3)
const BLACK_FLASH_DAMAGE = 35;
// etc.


bossHP -= damage;
if(bossHP <= 0) {
bossHP = 0;
msg = "CHÚC MỪNG! Bạn đã thanh tẩy Nguyền hồn!";
}
Comment on lines +44 to +47
Copy link
Contributor

@gemini-code-assist gemini-code-assist bot Jan 3, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The victory message ("CHÚC MỪNG! ...") overwrites the message from the final, winning attack. This means the player doesn't get to see which attack finished the fight. It would provide a better user experience to append the victory message to the attack message instead of replacing it entirely.

Suggested change
if(bossHP <= 0) {
bossHP = 0;
msg = "CHÚC MỪNG! Bạn đã thanh tẩy Nguyền hồn!";
}
if(bossHP <= 0) {
bossHP = 0;
msg += " CHÚC MỪNG! Bạn đã thanh tẩy Nguyền hồn!";
}


document.getElementById('hp-fill').style.width = bossHP + "%";
document.getElementById('message').innerText = msg;
if(bossHP <= 0) document.querySelector('#game-box').innerHTML += "<h3>VICTORY!</h3>";
Copy link
Contributor

@gemini-code-assist gemini-code-assist bot Jan 3, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

high

There are two issues with the game's end state:

  1. The attack buttons are not disabled after the boss is defeated. This allows the player to keep clicking them, which repeatedly appends "VICTORY!" messages.
  2. Using innerHTML += ... is inefficient for appending elements and can have unintended side effects. It's better practice to create and append a new element using document.createElement() and appendChild().

This suggestion fixes both issues.

            if(bossHP <= 0) {
                const victoryEl = document.createElement('h3');
                victoryEl.textContent = "VICTORY!";
                document.querySelector('#game-box').appendChild(victoryEl);
                document.querySelectorAll('button').forEach(b => b.disabled = true);
            }

}
</script>
</body>
</html>