Start typing to see posts you are looking for.
Set your categories menu in Header builder -> Mobile -> Mobile menu element -> Show/Hide -> Choose menu
document.addEventListener("DOMContentLoaded", function() {
const API_URL = "https://zenbalancebox-tarot-1.onrender.com/tarot?card=";
const IMAGE_BASE = "https://raw.githubusercontent.com/Regatta1092/zenbalancebox-tarot/main/";
const tarotCards = ["The Fool","The Magician","The High Priestess","The Empress","The Emperor","The Hierophant","The Lovers","The Chariot","Strength","The Hermit","Wheel of Fortune","Justice","The Hanged Man","Death","Temperance","The Devil","The Tower","The Star","The Moon","The Sun","Judgement","The World","Ace of Wands","Two of Wands","Three of Wands","Four of Wands","Five of Wands","Six of Wands","Seven of Wands","Eight of Wands","Nine of Wands","Ten of Wands","Page of Wands","Knight of Wands","Queen of Wands","King of Wands","Ace of Cups","Two of Cups","Three of Cups","Four of Cups","Five of Cups","Six of Cups","Seven of Cups","Eight of Cups","Nine of Cups","Ten of Cups","Page of Cups","Knight of Cups","Queen of Cups","King of Cups","Ace of Swords","Two of Swords","Three of Swords","Four of Swords","Five of Swords","Six of Swords","Seven of Swords","Eight of Swords","Nine of Swords","Ten of Swords","Page of Swords","Knight of Swords","Queen of Swords","King of Swords","Ace of Pentacles","Two of Pentacles","Three of Pentacles","Four of Pentacles","Five of Pentacles","Six of Pentacles","Seven of Pentacles","Eight of Pentacles","Nine of Pentacles","Ten of Pentacles","Page of Pentacles","Knight of Pentacles","Queen of Pentacles","King of Pentacles"];
function getRandomCard() { return tarotCards[Math.floor(Math.random() * tarotCards.length)]; }
function getCardImageUrl(cardName) {
let slug = cardName.toLowerCase().replace(/ /g, '-');
return `${IMAGE_BASE}${slug}.JPG`;
}
async function fetchCard(cardName) {
const response = await fetch(API_URL + encodeURIComponent(cardName));
return await response.json();
}
async function revealCardsOneByOne(cards, positions) {
const container = document.getElementById('spread-container');
container.innerHTML = 'Shuffling the eternal deck…
';
let html = '';
for (let i = 0; i < cards.length; i++) {
const cardName = cards[i];
const data = await fetchCard(cardName);
const imageUrl = getCardImageUrl(cardName);
html += `
${positions[i]}
${data.card}
${data.meaning}
`;
container.innerHTML = html;
await new Promise(r => setTimeout(r, 850));
}
}
// Button Functions
async function dailyDraw() {
const container = document.getElementById('spread-container');
container.innerHTML = 'Drawing your daily card…
';
const card = getRandomCard();
const data = await fetchCard(card);
const imageUrl = getCardImageUrl(card);
container.innerHTML = `
${data.card}
${data.meaning}
`;
}
async function threeCardDraw() {
const cards = Array.from({length:3}, getRandomCard);
const positions = ["The Past", "The Present", "The Future"];
await revealCardsOneByOne(cards, positions);
}
async function fiveCardDraw() {
const cards = Array.from({length:5}, getRandomCard);
const positions = ["The Present", "The Challenge", "The Past", "The Future", "The Advice"];
await revealCardsOneByOne(cards, positions);
}
async function celticCross() {
const cards = Array.from({length:10}, getRandomCard);
const positions = ["1. Heart of the Matter","2. Crossing","3. Root","4. Recent Past","5. Crown","6. Near Future","7. Self","8. Environment","9. Hopes & Fears","10. Outcome"];
await revealCardsOneByOne(cards, positions);
}
// Rune Functions (simplified)
const runeMeanings = { /* paste your runeMeanings object here */ };
async function threeRuneDraw() {
const container = document.getElementById('spread-container');
container.innerHTML = 'The runes are cast into the firelight…
';
// ... (keep your current rune logic)
}
async function fiveRuneDraw() {
const container = document.getElementById('spread-container');
container.innerHTML = 'The runes are being cast…
';
// ... (keep your current rune logic)
}
// Attach click events (this is more reliable on mobile)
document.getElementById('btn-daily').addEventListener('click', dailyDraw);
document.getElementById('btn-3card').addEventListener('click', threeCardDraw);
document.getElementById('btn-5card').addEventListener('click', fiveCardDraw);
document.getElementById('btn-celtic').addEventListener('click', celticCross);
document.getElementById('btn-3rune').addEventListener('click', threeRuneDraw);
document.getElementById('btn-5rune').addEventListener('click', fiveRuneDraw);
});
