<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>王様・奴隷・市民ゲーム</title>
</head>
<body>
<h1>王様・奴隷・市民ゲーム</h1>
<p>Player 1は奴隷カード1枚と市民カード4枚、Player 2は王様カード1枚と市民カード4枚を持っています。</p>
<p id="message">プレイヤー1の手札からカードを選んでください:</p>
<div id="player1-cards"></div>
<div id="result"></div>
<script>
const KING = "王様";
const SLAVE = "奴隷";
const CITIZEN = "市民";
const player1Hand = [SLAVE, CITIZEN, CITIZEN, CITIZEN, CITIZEN];
const player2Hand = [KING, CITIZEN, CITIZEN, CITIZEN, CITIZEN];
function shuffle(array) {
for (let i = array.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
}
shuffle(player1Hand);
shuffle(player2Hand);
const player1CardsDiv = document.getElementById('player1-cards');
const resultDiv = document.getElementById('result');
let round = 1;
function renderPlayer1Cards() {
player1CardsDiv.innerHTML = '';
player1Hand.forEach((card, index) => {
const button = document.createElement('button');
button.textContent = card;
button.onclick = () => playRound(index);
player1CardsDiv.appendChild(button);
});
}
function judge(card1, card2) {
if (card1 === card2) return "ドロー";
if ((card1 === KING && card2 === CITIZEN) ||
(card1 === CITIZEN && card2 === SLAVE) ||
(card1 === SLAVE && card2 === KING)) {
return "Player 1 勝利";
}
return "Player 2 勝利";
}
function playRound(player1Index) {
const player1Card = player1Hand[player1Index];
const player2Card = player2Hand[round - 1];
player1Hand.splice(player1Index, 1);
const result = judge(player1Card, player2Card);
resultDiv.innerHTML += `<p>第${round}ラウンド: Player 1 は「${player1Card}」、Player 2 は「${player2Card}」を出した！ 結果: ${result}</p>`;
round++;
if (round > 5) {
resultDiv.innerHTML += "<p>ゲーム終了！</p>";
document.getElementById('message').textContent = "ゲームが終了しました！";
player1CardsDiv.innerHTML = '';
} else {
renderPlayer1Cards();
document.getElementById('message').textContent = `プレイヤー1の手札からカードを選んでください (ラウンド${round}):`;
}
}
renderPlayer1Cards();
</script>
</body>
</html>
