<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>トランプの大富豪に似たゲーム</title>
</head>
<body>
<h1>トランプの大富豪に似たゲーム</h1>
<button id="start-btn">ゲームスタート</button>
<button id="reset-btn" style="display:none;">再開</button>
<div id="result" style="display:none;">
<h2>結果</h2>
<ul>
<li><span id="player1-icon"></span>：<span id="player1-score"></span></li>
<li><span id="player2-icon"></span>：<span id="player2-score"></span></li>
<li><span id="player3-icon"></span>：<span id="player3-score"></span></li>
</ul>
<div id="win-btns" style="display:none;">
<button id="win-icon-btn">🌷</button>
<button id="lose-icon-btn">💩</button>
</div>
</div>
<script>
const icons = ['👦', '👩', '🧑'];
const cardValues = {
'2': 1,
'3': 11,
'4': 4,
'5': 5,
'6': 6,
'7': 7,
'8': 8,
'9': 9,
'10': 10,
'J': 10,
'Q': 10,
'K': 10,
'A': 1
};
const players = [
{name: 'Player 1', score: 0},
{name: 'Player 2', score: 0},
{name: 'Player 3', score: 0}
];
function startGame() {
const cards = [];
for (let suit of ['S', 'H', 'C', 'D']) {
for (let value in cardValues) {
cards.push(suit + value);
}
}
cards.push('JOKER');
shuffle(cards);
for (let i = 0; i < 3; i++) {
for (let j = 0; j < 10; j++) {
const card = cards[i * 10 + j];
players[i].cards.push(card);
}
players[i].cards.sort((a, b) => { return cardValues[b.slice(1)] - cardValues[a.slice(1)]; });
players[i].score = calculateScore(players[i].cards);
}
const resultElm = document.getElementById('result');
resultElm.style.display = 'block';
const scoreElms = resultElm.getElementsByTagName('span');
for (let i = 0; i < scoreElms.length; i++) {
if (scoreElms[i].id.includes('icon')) {
scoreElms[i].textContent = icons[i];
} else if (scoreElms[i].id.includes('score')) {
scoreElms[i].textContent = players[i].score;
}
}
const winBtnsElm = document.getElementById('win-btns');
winBtnsElm.style.display = 'block';
const winIconBtnElm = document.getElementById('win-icon-btn');
const loseIconBtnElm = document.getElementById('lose-icon-btn');
winIconBtnElm.onclick = showWinIcon;
loseIconBtnElm.onclick = showLoseIcon;
document.getElementById('start-btn').disabled = true;
document.getElementById('reset-btn').style.display = 'inline-block';
}
function resetGame() {
players.forEach(player => {
player.cards = [];
player.score = 0;
});
const resultElm = document.getElementById('result');
resultElm.style.display = 'none';
const scoreElms = resultElm.getElementsByTagName('span');
for (let i = 0; i < scoreElms.length; i++) {
if (scoreElms[i].id.includes('score')) {
scoreElms[i].textContent = '';
}
}
const winBtnsElm = document.getElementById('win-btns');
winBtnsElm.style.display = 'none';
const winIconBtnElm = document.getElementById('win-icon-btn');
const loseIconBtnElm = document.getElementById('lose-icon-btn');
winIconBtnElm.onclick = null;
loseIconBtnElm.onclick = null;
document.getElementById('start-btn').disabled = false;
document.getElementById('reset-btn').style.display = 'none';
}
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]];
}
}
function calculateScore(cards) {
const cardCounts = {};
const pairCounts = {};
let score = 0;
let hasSpade3 = false;
let hasJoker = false;
cards.forEach(card => {
const value = card.slice(1);
if (value === '3' && card.slice(0, 1) === 'S') {
hasSpade3 = true;
}
if (value === 'JOKER') {
hasJoker = true;
} else {
if (cardCounts[value] === undefined) {
cardCounts[value] = 1;
} else {
cardCounts[value]++;
if (cardCounts[value] === 3) {
score += cardValues[value] * 3;
} else if (cardCounts[value] === 2) {
const key = value === 'A' ? '2A' : value;
if (pairCounts[key] === undefined) {
pairCounts[key] = 1;
} else {
pairCounts[key]++;
}
}
}
}
});
if (hasSpade3 && pairCounts['23'] !== undefined) {
pairCounts['23']++;
}
if (hasJoker && pairCounts['JOKER'] !== undefined) {
pairCounts['JOKER']++;
}
for (let key in pairCounts) {
if (pairCounts.hasOwnProperty(key)) {
const pairValue = key.slice(-1);
if (pairValue === 'A') {
score += cardValues['2'] * pairCounts[key];
} else {
score += cardValues[pairValue] * pairCounts[key];
}
}
}
for (let value in cardCounts) {
if (cardCounts.hasOwnProperty(value)) {
if (cardCounts[value] === 1) {
score += cardValues[value];
}
}
}
return score;
}
function showWinIcon() {
const maxScore = Math.max.apply(null, players.map(player => player.score));
players.filter(player => player.score === maxScore).forEach(player => {
document.getElementById(`player${players.indexOf(player) + 1}-icon`).textContent += '💐';
});
}
function showLoseIcon() {
const minScore = Math.min.apply(null, players.map(player => player.score));
players.filter(player => player.score === minScore).forEach(player => {
document.getElementById(`player${players.indexOf(player) + 1}-icon`).textContent += '💩';
});
}
document.getElementById('start-btn').onclick = startGame;
document.getElementById('reset-btn').onclick = resetGame;
// 初期化
players.forEach(player => {
player.cards = [];
});
</script>
</body>
</html>
