占うと言うボタンを押すと占うことが出来ます。
大アルカナしか使っていませんが、このソースをエディタでHTMLファイルにすれば、ブラウザで遊ぶことが出来ます。
絵は表示されません。文字だけのさみしい表示ですが、遊べるのではないでしょうか。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ワンオラクル タロット占い</title>
</head>
<body>
<h1>ワンオラクル タロット占い</h1>
<button onclick="drawCard()">占う</button>
<div id="result" style="margin-top: 20px;"></div>
<script>
// 大アルカナのカード情報（番号、名前、正位置と逆位置の意味）
const tarotCards = [
{ number: 0, name: "The Fool", upright: "自由、冒険、無邪気", reversed: "愚行、不注意、無謀" },
{ number: 1, name: "The Magician", upright: "意志力、創造性、才能", reversed: "欺瞞、無力、不実" },
{ number: 2, name: "The High Priestess", upright: "直感、知識、秘密", reversed: "無知、不信、不安" },
{ number: 3, name: "The Empress", upright: "豊かさ、育成、愛情", reversed: "依存、抑制、創造性の欠如" },
{ number: 4, name: "The Emperor", upright: "権威、安定、統制", reversed: "独裁、頑固、無責任" },
{ number: 5, name: "The Hierophant", upright: "伝統、教育、助言", reversed: "反逆、束縛、自己主張" },
{ number: 6, name: "The Lovers", upright: "愛、選択、調和", reversed: "不和、誘惑、困難な選択" },
{ number: 7, name: "The Chariot", upright: "勝利、意思の強さ、成功", reversed: "挫折、焦り、対立" },
{ number: 8, name: "Strength", upright: "勇気、忍耐、自己信頼", reversed: "弱気、不安、自己疑念" },
{ number: 9, name: "The Hermit", upright: "内省、探求、孤独", reversed: "孤立、誤解、退屈" },
{ number: 10, name: "Wheel of Fortune", upright: "幸運、転機、サイクル", reversed: "不運、停滞、悪循環" },
{ number: 11, name: "Justice", upright: "正義、公平、真実", reversed: "不正、不平等、不正確" },
{ number: 12, name: "The Hanged Man", upright: "犠牲、見直し、悟り", reversed: "固執、自己犠牲、停滞" },
{ number: 13, name: "Death", upright: "終焉、変容、再生", reversed: "抵抗、停滞、変化の拒否" },
{ number: 14, name: "Temperance", upright: "調和、バランス、忍耐", reversed: "不調和、過剰、無秩序" },
{ number: 15, name: "The Devil", upright: "束縛、欲望、誘惑", reversed: "解放、希望、自己改善" },
{ number: 16, name: "The Tower", upright: "崩壊、変化、啓示", reversed: "恐怖、抑圧、危機の回避" },
{ number: 17, name: "The Star", upright: "希望、癒し、目標", reversed: "絶望、失望、自己疑念" },
{ number: 18, name: "The Moon", upright: "直感、夢、無意識", reversed: "混乱、不安、幻滅" },
{ number: 19, name: "The Sun", upright: "成功、幸福、活力", reversed: "失敗、憂鬱、不安" },
{ number: 20, name: "Judgement", upright: "覚醒、審判、再生", reversed: "自己否定、無理解、反省不足" },
{ number: 21, name: "The World", upright: "達成、完成、統合", reversed: "未達成、不満、達成の遅れ" }
];
// カードをランダムに引く関数
function drawCard() {
const card = tarotCards[Math.floor(Math.random() * tarotCards.length)];
const isUpright = Math.random() < 0.5; // 正位置か逆位置かをランダムに決める
const position = isUpright ? "正位置" : "逆位置";
const meaning = isUpright ? card.upright : card.reversed;
// 結果を表示
document.getElementById("result").innerHTML = `
<h2>結果</h2>
<p>カード: ${card.number} - ${card.name} (${position})</p>
<p>意味: ${meaning}</p>
`;
}
</script>
</body>
</html>
