JavaScriptトランプ占いのソースコード

<h1>トランプを引く</h1>
<p><img id="result" src="card-back.png" alt="カード"></p>
<p id="comment"></p>
<button id="drawButton" onclick="drawCard()">カードを引く</button>
<script>
// カードデッキの作成
const deck = [];
const suits = ["spade", "heart", "diamond", "club"];
const values = ["A", "2", "3", "4", "5", "6", "7", "8", "9", "10", "J", "Q", "K"];

// デッキにカードを追加
for (let suit of suits) {
for (let value of values) {
deck.push({suit: suit, value: value});
}
}

// デッキをシャッフル
for (let i = deck.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[deck[i], deck[j]] = [deck[j], deck[i]];
}

// 今日の日付を "YYYY-MM-DD" の形式で取得
const today = new Date().toISOString().split('T')[0];

// 前回カードを引いた日付を取得
const lastDrawDate = localStorage.getItem('lastDrawDate');

// ボタンを有効または無効にする
if (lastDrawDate === today) {
document.getElementById('comment').innerHTML = "今日はもうカードを引きました。明日また挑戦してください！";
document.getElementById('drawButton').disabled = true;
}

function drawCard() {
// カードのスートと数値に対応する占い結果を定義
const fortunes = {
heart: {
"A": "新しい恋の予感",
"2": "絆が深まる出来事があるかもしれません",
"3": "友情が深まるかもしれません",
"4": "物事が停滞するかもしれません",
"5": "無くしものに注意しましょう",
"6": "懐かしい人に出会えるかも",
"7": "空想に捕らわれるかもしれません",
"8": "次の目的地に進んでみましょう",
"9": "願いが叶うかもしれません",
"10": "幸せに満ちた日になるでしょう",
"J": "夢に向かって進んでみましょう",
"Q": "思いやりを持ちましょう",
"K": "責任をもってやり遂げましょう"
},
club: {
"A": "何かがはじまる予感",
"2": "方向性が定まるでしょう",
"3": "準備を怠らないようにしましょう",
"4": "今日はゆっくり休みましょう",
"5": "争いが起きるかもしれません",
"6": "チームワークが大事です",
"7": "勇気を出して立ち上がりましょう",
"8": "物事が急速に進展するかもしれません",
"9": "慎重に進みましょう",
"10": "困難な出来事があるかもしれません",
"J": "直感を信じて進んでみましょう",
"Q": "自信がつく出来事があるかもしれません",
"K": "リーダーシップを発揮しましょう"
},
diamond: {
"A": "幸運な出来事があるかもしれません",
"2": "臨機応変に対応しましょう",
"3": "チームワークが成功をもたらすでしょう",
"4": "執着を捨てましょう",
"5": "経済的な損失に注意しましょう",
"6": "困っている人を助けましょう",
"7": "根気よく待ちましょう",
"8": "努力は無駄になりません",
"9": "十分な成果が得られるでしょう",
"10": "家族の幸せが訪れるでしょう",
"J": "地道な努力が実を結びます",
"Q": "広い心を持ちましょう",
"K": "経済的な成功の予感"
},
spade: {
"A": "勇気を出して進んでみましょう",
"2": "冷静に判断しましょう",
"3": "トラブルに注意しましょう",
"4": "休息を取りましょう",
"5": "私利私欲に注意しましょう",
"6": "物事が好転するかもしれません",
"7": "裏切りに会うかもしれません",
"8": "八方塞がりになるかもしれません",
"9": "心配事が出来るかもしれません",
"10": "最悪の状況になるかもしれません",
"J": "自分を信じて進みましょう",
"Q": "強い意志を持ちましょう",
"K": "決断力が求められます"
}
};

const card = deck.pop();
const fortuneResult = fortunes[card.suit][card.value];

// 結果を表示する
document.getElementById('comment').innerHTML = `${fortuneResult}`;
document.getElementById("result").src = `${card.suit}${card.value}.png`;

// 今日の日付を localStorage に保存して、再度引けないようにする
localStorage.setItem('lastDrawDate', today);
document.getElementById('drawButton').disabled = true;
}

</script>