This is the initial commit of the sveltekit version of On The Spectrum:

A game brought to you by Sludge and Friends
This commit is contained in:
2025-12-08 10:51:18 -06:00
commit 117099bea4
20 changed files with 837 additions and 0 deletions

307
static/OnTheSpectrum.html Normal file
View File

@@ -0,0 +1,307 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>On the Spectrum - Party Game</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body.win95 { font-family: 'MS Sans Serif', Arial, sans-serif; background: #008080; padding: 20px; }
.win95 .window { background: #c0c0c0; border: 2px solid; border-color: #dfdfdf #808080 #808080 #dfdfdf; max-width: 800px; margin: 0 auto; box-shadow: 2px 2px 0 rgba(0,0,0,0.5); }
.win95 .title-bar { background: linear-gradient(to right, #000080, #1084d0); color: white; padding: 3px 5px; font-weight: bold; }
.win95 .window-body { padding: 15px; }
.win95 fieldset { border: 2px groove #c0c0c0; padding: 10px; margin-bottom: 15px; }
.win95 .chart-display, .win95 .dice-display { background: white; border: 2px inset #808080; padding: 15px; min-height: 120px; margin-bottom: 15px; }
.win95 button { background: #c0c0c0; border: 2px solid; border-color: #ffffff #000000 #000000 #ffffff; padding: 5px 20px; font-family: 'MS Sans Serif', Arial, sans-serif; font-size: 11px; cursor: pointer; }
.win95 button:active { border-color: #000000 #ffffff #ffffff #000000; }
body.cyberpunk { font-family: 'Courier New', monospace; background: #0a0e27; padding: 20px; color: #00ffff; }
.cyberpunk .window { background: rgba(10, 14, 39, 0.95); border: 2px solid #00ffff; box-shadow: 0 0 20px #ff00ff; max-width: 800px; margin: 0 auto; }
.cyberpunk .title-bar { background: linear-gradient(90deg, #ff00ff, #00ffff); color: #000; padding: 10px; font-weight: bold; text-transform: uppercase; }
.cyberpunk .window-body { padding: 20px; }
.cyberpunk fieldset { border: 1px solid #ff00ff; padding: 15px; margin-bottom: 20px; }
.cyberpunk legend { color: #ff00ff; text-transform: uppercase; }
.cyberpunk .chart-display, .cyberpunk .dice-display { background: rgba(0, 255, 255, 0.05); border: 1px solid #00ffff; padding: 20px; min-height: 120px; margin-bottom: 15px; }
.cyberpunk button { background: transparent; border: 2px solid #ff00ff; color: #ff00ff; padding: 10px 25px; font-family: 'Courier New', monospace; font-weight: bold; cursor: pointer; text-transform: uppercase; }
.cyberpunk button:hover { background: #ff00ff; color: #000; }
body.typewriter { font-family: 'Courier', monospace; background: #f4e8d0; padding: 20px; color: #2c2416; }
.typewriter .window { background: #fffef7; border: 3px double #2c2416; max-width: 800px; margin: 0 auto; box-shadow: 5px 5px 15px rgba(0,0,0,0.3); }
.typewriter .title-bar { background: #2c2416; color: #f4e8d0; padding: 12px; text-align: center; text-transform: uppercase; letter-spacing: 3px; }
.typewriter .window-body { padding: 25px; }
.typewriter fieldset { border: 2px solid #2c2416; padding: 15px; margin-bottom: 20px; }
.typewriter legend { font-weight: bold; text-decoration: underline; }
.typewriter .chart-display, .typewriter .dice-display { background: #fffef7; border: 1px solid #2c2416; padding: 20px; min-height: 120px; margin-bottom: 15px; }
.typewriter button { background: #2c2416; border: 2px solid #2c2416; color: #f4e8d0; padding: 8px 20px; font-family: 'Courier', monospace; font-weight: bold; cursor: pointer; }
body.nightmare { font-family: 'Georgia', serif; background: #000000; padding: 20px; color: #8b0000; }
.nightmare .window { background: #0d0000; border: 3px solid #8b0000; max-width: 800px; margin: 0 auto; box-shadow: 0 0 30px #ff0000; }
.nightmare .title-bar { background: linear-gradient(180deg, #3a0000, #000000); color: #ff0000; padding: 15px; text-align: center; text-transform: uppercase; letter-spacing: 5px; text-shadow: 0 0 10px #ff0000; }
.nightmare .window-body { padding: 20px; }
.nightmare fieldset { border: 2px solid #8b0000; padding: 15px; margin-bottom: 20px; }
.nightmare legend { color: #ff0000; text-shadow: 0 0 5px #ff0000; }
.nightmare .chart-display, .nightmare .dice-display { background: #000000; border: 2px solid #8b0000; padding: 20px; min-height: 120px; margin-bottom: 15px; }
.nightmare button { background: #3a0000; border: 2px solid #8b0000; color: #ff0000; padding: 10px 25px; font-family: 'Georgia', serif; font-weight: bold; cursor: pointer; text-transform: uppercase; }
.nightmare button:hover { background: #8b0000; }
body.vaporwave { font-family: 'Arial', sans-serif; background: linear-gradient(180deg, #ff6ad5 0%, #c774e8 50%, #ad8cff 100%); padding: 20px; color: #fff; }
.vaporwave .window { background: rgba(255, 106, 213, 0.3); backdrop-filter: blur(10px); border: 3px solid #00f0ff; max-width: 800px; margin: 0 auto; box-shadow: 0 8px 32px rgba(0, 240, 255, 0.4); }
.vaporwave .title-bar { background: linear-gradient(90deg, #ff6ad5, #00f0ff); color: #fff; padding: 15px; text-align: center; text-transform: uppercase; letter-spacing: 4px; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); }
.vaporwave .window-body { padding: 25px; }
.vaporwave fieldset { border: 2px solid #00f0ff; padding: 20px; margin-bottom: 20px; background: rgba(255, 255, 255, 0.1); }
.vaporwave legend { color: #00f0ff; text-transform: uppercase; font-weight: bold; }
.vaporwave .chart-display, .vaporwave .dice-display { background: rgba(255, 255, 255, 0.15); border: 2px solid #ff6ad5; padding: 20px; min-height: 120px; margin-bottom: 15px; }
.vaporwave button { background: linear-gradient(135deg, #ff6ad5, #c774e8); border: 2px solid #00f0ff; color: #fff; padding: 12px 30px; font-weight: bold; cursor: pointer; text-transform: uppercase; }
body.nintendo { font-family: 'Arial', sans-serif; background: #e60012; padding: 20px; color: #fff; }
.nintendo .window { background: #fff; border: 8px solid #e60012; border-radius: 20px; max-width: 800px; margin: 0 auto; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3); overflow: hidden; }
.nintendo .title-bar { background: #e60012; color: #fff; padding: 20px; text-align: center; font-weight: bold; font-size: 24px; letter-spacing: 2px; }
.nintendo .window-body { padding: 25px; color: #484848; }
.nintendo fieldset { border: 3px solid #e60012; border-radius: 15px; padding: 20px; margin-bottom: 20px; background: #f7f7f7; }
.nintendo legend { color: #e60012; font-weight: bold; font-size: 16px; }
.nintendo .chart-display, .nintendo .dice-display { background: #fff; border: 3px solid #00a3e0; border-radius: 10px; padding: 20px; min-height: 120px; margin-bottom: 15px; }
.nintendo button { background: #e60012; border: none; border-radius: 25px; color: #fff; padding: 12px 30px; font-weight: bold; cursor: pointer; text-transform: uppercase; box-shadow: 0 4px 0 #a00009; transition: all 0.1s; }
.nintendo button:hover { background: #ff0018; }
.nintendo button:active { box-shadow: 0 2px 0 #a00009; transform: translateY(2px); }
.button-row { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.empty-state { font-style: italic; text-align: center; padding: 20px; opacity: 0.7; }
.axis { margin: 8px 0; padding: 10px; border: 1px solid; opacity: 0.9; }
.axis-label { font-weight: bold; margin-bottom: 5px; font-size: 11px; text-transform: uppercase; }
.chart-title { font-weight: bold; margin-bottom: 15px; font-size: 16px; }
.dice-result { font-size: 28px; font-weight: bold; margin-top: 10px; }
.toggle-container { display: flex; align-items: center; gap: 10px; justify-content: center; margin: 10px 0; }
.toggle-switch { position: relative; width: 50px; height: 24px; background: #ccc; border-radius: 12px; cursor: pointer; transition: background 0.3s; }
.toggle-switch.active { background: #ff6b6b; }
.toggle-slider { position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; background: white; border-radius: 50%; transition: transform 0.3s; }
.toggle-switch.active .toggle-slider { transform: translateX(26px); }
</style>
</head>
<body class="win95">
<div class="window">
<div class="title-bar">On the Spectrum - Party Game</div>
<div class="window-body">
<fieldset>
<legend>Theme Selector</legend>
<div class="button-row">
<button onclick="setTheme('win95')">Windows 95</button>
<button onclick="setTheme('cyberpunk')">Cyberpunk</button>
<button onclick="setTheme('typewriter')">Typewriter</button>
<button onclick="setTheme('nightmare')">Nightmare</button>
<button onclick="setTheme('vaporwave')">Vaporwave</button>
<button onclick="setTheme('nintendo')">Nintendo</button>
</div>
</fieldset>
<fieldset>
<legend>Adult Mode (18+)</legend>
<div class="toggle-container">
<span>Family Friendly</span>
<div class="toggle-switch" id="adultToggle" onclick="toggleAdultMode()">
<div class="toggle-slider"></div>
</div>
<span>Adult</span>
</div>
</fieldset>
<fieldset>
<legend>Chart Generator</legend>
<div class="chart-display" id="chartDisplay">
<div class="empty-state">Click Generate!</div>
</div>
<div class="button-row">
<button onclick="generateRandom()">Generate</button>
</div>
</fieldset>
<fieldset>
<legend>Position Roller</legend>
<div class="dice-display" id="diceDisplay">
<div class="empty-state">Click Roll!</div>
</div>
<div class="button-row">
<button onclick="rollDice()">Roll Dice</button>
</div>
</fieldset>
</div>
</div>
<script>
let adultMode = false;
const familyCharts = [
{title: "Pizza", x: ["Traditional", "Experimental"], y: ["Thin", "Thick"]},
{title: "Travel", x: ["Budget", "Luxury"], y: ["Planned", "Spontaneous"]},
{title: "Movies", x: ["Classics", "New"], y: ["Drama", "Comedy"]},
{title: "Morning", x: ["Early", "Late"], y: ["Slow", "Energetic"]},
{title: "Social", x: ["Small", "Large"], y: ["Quiet", "Loud"]},
{title: "Coffee", x: ["Black", "Fancy"], y: ["Work", "Socialize"]},
{title: "Music", x: ["Old", "New"], y: ["Calm", "Upbeat"]},
{title: "Exercise", x: ["Cardio", "Weights"], y: ["Indoor", "Outdoor"]},
{title: "Reading", x: ["Fiction", "Nonfiction"], y: ["Physical", "Digital"]},
{title: "Gaming", x: ["Casual", "Hardcore"], y: ["Single", "Multi"]},
{title: "Fashion", x: ["Comfort", "Style"], y: ["Neutral", "Bold"]},
{title: "Food", x: ["Homemade", "Takeout"], y: ["Healthy", "Indulgent"]},
{title: "Pets", x: ["Cats", "Dogs"], y: ["Low-maint", "High-maint"]},
{title: "Beach", x: ["Relax", "Active"], y: ["Morning", "Evening"]},
{title: "Weather", x: ["Cold", "Hot"], y: ["Dry", "Humid"]},
{title: "Texting", x: ["Brief", "Long"], y: ["Fast", "Delayed"]},
{title: "Art", x: ["Classic", "Modern"], y: ["Realistic", "Abstract"]},
{title: "Camping", x: ["Minimal", "Glamping"], y: ["Solo", "Group"]},
{title: "Dessert", x: ["Chocolate", "Fruit"], y: ["Simple", "Elaborate"]},
{title: "Sports", x: ["Watch", "Play"], y: ["Team", "Individual"]},
{title: "Shopping", x: ["Online", "In-store"], y: ["Quick", "Browse"]},
{title: "Driving", x: ["Slow", "Fast"], y: ["City", "Highway"]},
{title: "Holidays", x: ["Home", "Travel"], y: ["Relaxed", "Packed"]},
{title: "Decor", x: ["Minimal", "Maximal"], y: ["Neutral", "Colorful"]},
{title: "Cleaning", x: ["Daily", "Weekly"], y: ["Surface", "Deep"]},
{title: "Tech", x: ["Basic", "Cutting-edge"], y: ["Mobile", "Desktop"]},
{title: "Snacks", x: ["Salty", "Sweet"], y: ["Light", "Heavy"]},
{title: "Photos", x: ["Candid", "Posed"], y: ["Phone", "Camera"]},
{title: "Parties", x: ["Host", "Guest"], y: ["Early", "Late"]},
{title: "Learning", x: ["Visual", "Audio"], y: ["Structured", "Flexible"]},
{title: "Cooking", x: ["Recipes", "Improvise"], y: ["Simple", "Complex"]},
{title: "Temperature", x: ["Cold", "Hot"], y: ["Stable", "Variable"]},
{title: "Humor", x: ["Dry", "Slapstick"], y: ["Clean", "Edgy"]},
{title: "Time", x: ["Punctual", "Flexible"], y: ["Morning", "Night"]},
{title: "Risk", x: ["Safe", "Adventure"], y: ["Calculated", "Impulsive"]},
{title: "Workspace", x: ["Organized", "Chaotic"], y: ["Open", "Private"]},
{title: "Transport", x: ["Walk", "Drive"], y: ["Direct", "Scenic"]},
{title: "Budget", x: ["Saver", "Spender"], y: ["Needs", "Luxuries"]},
{title: "Contact", x: ["Text", "Call"], y: ["Brief", "Detailed"]},
{title: "Seasons", x: ["Spring", "Fall"], y: ["Summer", "Winter"]},
{title: "Streaming", x: ["Home", "Theater"], y: ["Binge", "Weekly"]},
{title: "Breakfast", x: ["Light", "Heavy"], y: ["Sweet", "Savory"]},
{title: "Hobbies", x: ["Creative", "Physical"], y: ["Solo", "Group"]},
{title: "Plants", x: ["Low-care", "High-care"], y: ["Indoor", "Outdoor"]},
{title: "Beverage", x: ["Water", "Soda"], y: ["Hot", "Cold"]},
{title: "Sleep", x: ["Early", "Late"], y: ["Light", "Heavy"]},
{title: "Celebrate", x: ["Intimate", "Grand"], y: ["Traditional", "Unique"]},
{title: "Learn", x: ["Books", "Videos"], y: ["Theory", "Practice"]},
{title: "Vacation", x: ["Beach", "Mountains"], y: ["Active", "Restful"]},
{title: "Noise", x: ["Silence", "Background"], y: ["Natural", "Music"]}
];
const adultCharts = [
{title: "Alcohol", x: ["Beer", "Cocktails"], y: ["Occasional", "Frequent"]},
{title: "Dating Apps", x: ["Swipe-happy", "Selective"], y: ["Hookups", "Relationships"]},
{title: "Partying", x: ["House party", "Club"], y: ["Chill", "Wild"]},
{title: "Smoking", x: ["Never", "Social"], y: ["Cigarettes", "Other"]},
{title: "Late Night", x: ["Home", "Out"], y: ["Sober", "Drinking"]},
{title: "Flirting", x: ["Subtle", "Direct"], y: ["Shy", "Confident"]},
{title: "Relationship", x: ["Monogamous", "Open"], y: ["Casual", "Serious"]},
{title: "Arguments", x: ["Avoid", "Confront"], y: ["Calm", "Heated"]},
{title: "Exes", x: ["Cut-off", "Friends"], y: ["No-contact", "Cordial"]},
{title: "PDAs", x: ["Private", "Public"], y: ["Reserved", "Affectionate"]},
{title: "First Date", x: ["Coffee", "Dinner"], y: ["Day", "Night"]},
{title: "Jealousy", x: ["None", "High"], y: ["Trusting", "Suspicious"]},
{title: "Break-ups", x: ["Amicable", "Drama"], y: ["Move-on", "Linger"]},
{title: "Online Dating", x: ["Never", "Always"], y: ["Profile-brief", "Profile-detailed"]},
{title: "Nightlife", x: ["Bar", "Club"], y: ["Early-out", "Last-call"]},
{title: "Wedding", x: ["Small", "Big"], y: ["Traditional", "Unique"]},
{title: "Living Together", x: ["Wait", "Move-fast"], y: ["Test", "Commit"]},
{title: "Arguments Style", x: ["Silent", "Loud"], y: ["Resolve-fast", "Hold-grudge"]},
{title: "Commitment", x: ["Slow", "Fast"], y: ["Cautious", "All-in"]},
{title: "Romance", x: ["Practical", "Grand-gestures"], y: ["Words", "Actions"]},
{title: "Bar Scene", x: ["Dive-bar", "Upscale"], y: ["Shots", "Cocktails"]},
{title: "Social Drinking", x: ["Rarely", "Often"], y: ["Light", "Heavy"]},
{title: "Nightclub", x: ["Never", "Regular"], y: ["Dance", "VIP"]},
{title: "One Night Stand", x: ["Never", "Open"], y: ["Regret", "No-regret"]},
{title: "Red Flags", x: ["Ignore", "Run"], y: ["Give-chance", "Zero-tolerance"]},
{title: "Love Language", x: ["Words", "Touch"], y: ["Gifts", "Time"]},
{title: "Proposal", x: ["Private", "Public"], y: ["Simple", "Elaborate"]},
{title: "Bachelor Party", x: ["Tame", "Wild"], y: ["Local", "Vegas"]},
{title: "Drunk Texting", x: ["Never", "Always"], y: ["Delete", "Send"]},
{title: "Bar Karaoke", x: ["No-way", "Love-it"], y: ["Sober-only", "Drunk-only"]},
{title: "Wine", x: ["Red", "White"], y: ["Cheap", "Expensive"]},
{title: "Tinder", x: ["Left", "Right"], y: ["Bio-matters", "Pics-only"]},
{title: "Marriage", x: ["Young", "Older"], y: ["Traditional", "Modern"]},
{title: "Kids", x: ["None", "Many"], y: ["Soon", "Later"]},
{title: "Work Drinks", x: ["Skip", "Go"], y: ["One-drink", "Stay-late"]},
{title: "Hangover", x: ["Suffer", "Hair-of-dog"], y: ["Stay-in", "Power-through"]},
{title: "Happy Hour", x: ["Never", "Always"], y: ["Cheap-drinks", "Good-drinks"]},
{title: "Strip Club", x: ["Never", "Sometimes"], y: ["Awkward", "Fun"]},
{title: "Beer", x: ["Domestic", "Craft"], y: ["Light", "Heavy"]},
{title: "Cocktails", x: ["Simple", "Complex"], y: ["Sweet", "Strong"]},
{title: "Wine Tasting", x: ["Pretentious", "Fun"], y: ["Spit", "Swallow"]},
{title: "Champagne", x: ["Special", "Anytime"], y: ["Cheap", "Expensive"]},
{title: "Body Mods", x: ["None", "Many"], y: ["Hidden", "Visible"]},
{title: "Tattoos", x: ["None", "Covered"], y: ["Small", "Large"]},
{title: "Piercings", x: ["Standard", "Unconventional"], y: ["Few", "Many"]},
{title: "Age Gap", x: ["Same-age", "Large-gap"], y: ["Younger", "Older"]},
{title: "Meeting Parents", x: ["Soon", "Later"], y: ["Stressed", "Relaxed"]},
{title: "Social Media", x: ["Private", "Public"], y: ["Single", "Coupled"]},
{title: "Fight Style", x: ["Yell", "Silent"], y: ["Resolve", "Avoid"]},
{title: "Apologies", x: ["Immediate", "Delayed"], y: ["Verbal", "Actions"]},
{title: "Money Talk", x: ["Open", "Private"], y: ["Split", "Treat"]},
{title: "Date Planning", x: ["Spontaneous", "Planned"], y: ["Cheap", "Expensive"]},
{title: "Texting Freq", x: ["Constant", "Minimal"], y: ["Long", "Short"]},
{title: "Phone Calls", x: ["Avoid", "Love"], y: ["Short", "Hours"]},
{title: "Video Calls", x: ["Hate", "Prefer"], y: ["Camera-off", "Camera-on"]},
{title: "Love at First", x: ["Skeptical", "Believer"], y: ["Slow", "Fast"]},
{title: "Dealbreakers", x: ["Few", "Many"], y: ["Flexible", "Strict"]},
{title: "Past Discuss", x: ["Open-book", "Private"], y: ["Details", "General"]},
{title: "Future Talk", x: ["Avoid", "Plan"], y: ["Vague", "Specific"]},
{title: "Living Style", x: ["Roommate", "Alone"], y: ["Clean", "Messy"]},
{title: "Pets Decision", x: ["Cat-person", "Dog-person"], y: ["None", "Many"]},
{title: "Travel Together", x: ["Separate", "Always"], y: ["Plan", "Spontaneous"]},
{title: "Friend Group", x: ["Separate", "Merge"], y: ["Small", "Large"]},
{title: "Game Night", x: ["Competitive", "Casual"], y: ["Drinks", "Sober"]},
{title: "Concert", x: ["Seats", "Pit"], y: ["Sober", "Drunk"]},
{title: "Festival", x: ["Never", "Every-year"], y: ["Camping", "Hotel"]},
{title: "Road Trip", x: ["Driver", "Passenger"], y: ["Music", "Podcasts"]},
{title: "Sports Bar", x: ["Never", "Weekly"], y: ["Watch", "Ignore"]},
{title: "Brunch", x: ["Coffee", "Mimosas"], y: ["Light", "Heavy"]},
{title: "Dinner Party", x: ["Host", "Guest"], y: ["Formal", "Casual"]},
{title: "Game Night Drinks", x: ["Sober", "Tipsy"], y: ["Wine", "Beer"]},
{title: "Movie Night", x: ["Home", "Theater"], y: ["Sober", "Buzzed"]},
{title: "Cooking", x: ["Together", "Take-turns"], y: ["Recipe", "Improvise"]},
{title: "Grocery", x: ["Separate", "Together"], y: ["List", "Browse"]},
{title: "Chores", x: ["Split", "Assigned"], y: ["Schedule", "Whenever"]},
{title: "Finances", x: ["Joint", "Separate"], y: ["Budget", "Flexible"]},
{title: "Gift Giving", x: ["Practical", "Romantic"], y: ["Cheap", "Expensive"]},
{title: "Anniversaries", x: ["Big-deal", "No-big-deal"], y: ["Go-out", "Stay-in"]},
{title: "Birthdays", x: ["Party", "Quiet"], y: ["Surprise", "Plan"]},
{title: "Holidays", x: ["Family", "Friends"], y: ["Traditional", "New"]},
{title: "New Years", x: ["Out", "In"], y: ["Party", "Quiet"]},
{title: "Halloween", x: ["Costume", "No-costume"], y: ["Party", "Stay-in"]},
{title: "Valentine's", x: ["Big-deal", "Ignore"], y: ["Fancy", "Casual"]},
{title: "Office Party", x: ["Skip", "Go"], y: ["Sober", "Drinks"]},
{title: "Karaoke Night", x: ["Never", "Always"], y: ["Sober", "Drunk"]},
{title: "Trivia Night", x: ["Serious", "Fun"], y: ["Sober", "Drinking"]},
{title: "Comedy Show", x: ["Never", "Often"], y: ["Sober", "Buzzed"]},
{title: "Spa Day", x: ["Never", "Regular"], y: ["Cheap", "Luxury"]},
{title: "Gym Together", x: ["Never", "Always"], y: ["Spot", "Separate"]},
{title: "Morning After", x: ["Breakfast", "Leave"], y: ["Cuddle", "Space"]},
{title: "Text Response", x: ["Immediate", "Hours"], y: ["Short", "Essay"]},
{title: "Compliments", x: ["Rare", "Constant"], y: ["Looks", "Character"]},
{title: "Criticism", x: ["Direct", "Gentle"], y: ["Private", "Public"]},
{title: "Habits Annoy", x: ["Tolerate", "Mention"], y: ["Immediate", "Build-up"]},
{title: "Space Need", x: ["Always-together", "Need-alone"], y: ["Communicate", "Assume"]},
{title: "Compromise", x: ["Easy", "Difficult"], y: ["Fair", "Keep-score"]},
{title: "Trust Level", x: ["High", "Low"], y: ["Verify", "Faith"]},
{title: "Privacy", x: ["Open-phone", "Private"], y: ["Share-all", "Boundaries"]}
];
function setTheme(theme) {
document.body.className = theme;
}
function toggleAdultMode() {
adultMode = !adultMode;
document.getElementById('adultToggle').classList.toggle('active');
}
function generateRandom() {
const charts = adultMode ? [...familyCharts, ...adultCharts] : familyCharts;
const random = charts[Math.floor(Math.random() * charts.length)];
const display = document.getElementById('chartDisplay');
display.innerHTML = `
<div class="chart-title">${random.title}</div>
<div class="axis">
<div class="axis-label">X-Axis</div>
<div>${random.x[0]}${random.x[1]}</div>
</div>
<div class="axis">
<div class="axis-label">Y-Axis</div>
<div>${random.y[0]}${random.y[1]}</div>
</div>
`;
}
function rollDice() {
const die1 = Math.floor(Math.random() * 10) + 1;
const die2 = Math.floor(Math.random() * 10) + 1;
const display = document.getElementById('diceDisplay');
display.innerHTML = `
<div style="font-size: 48px; text-align: center;">🎲 🎲</div>
<div class="dice-result" style="text-align: center;">X: ${die1} | Y: ${die2}</div>
`;
}
</script>
</body>
</html>