+ + + {/* Header */} +

Dream Architect

+ Creativity: {formatNumber(creativity)} + + (per second: {formatNumber(autoCreativity)}) + +

+ {prestigePoints > 0 && ( +

+ Dream Essence: {prestigePoints} +

+ )} + {dreamFragments > 0 && ( +

+ Fragments: {dreamFragments} +

+ )} + {debugMode && ( +

+ DEBUG MODE +

+ )} +

+ + {/* Main Game Area */} +

+ {/* Dream Visualization */} +

Dream Core

+ + {/* Click particle effect */} + {showParticle && ( +

+ +{clickPower.toFixed(1)} +

+ )} +

+ + {/* Background dream particles */} + {settings.particles && dreamParticles.map(particle => ( +

+ ))} + + {/* Auto production particles */} + {settings.particles && productionParticles.map(particle => ( +

+ +{particle.value} +

+ ))} + +

+ + {totalCreativity >= 1000000 && ( + + )} +

+ + {/* Achievement notification */} + {showAchievement && ( +

+ {achievementText} +

+ )} + + {/* Random event notification */} + {randomEvent && ( +

{randomEvent.name}

{randomEvent.description}

+ )} + + {/* Debug panel */} + {showDebugPanel && ( +

setShowDebugPanel(false)}> +

e.stopPropagation()}> +

Debug Mode

+ Ctrl+F1 to toggle +

+ +

+ Creativity + setDebugValues({...debugValues, creativity: Number(e.target.value)})} + className="w-full p-2 border border-gray-300 rounded-md" + /> +

+ +

+ Click Power + setDebugValues({...debugValues, clickPower: Number(e.target.value)})} + className="w-full p-2 border border-gray-300 rounded-md" + /> +

+ +

+ Dream Level (1-{dreamBackgrounds.length}) + setDebugValues({...debugValues, dreamLevel: Number(e.target.value)})} + className="w-full p-2 border border-gray-300 rounded-md" + /> +

+ +

+ Dream Fragments + setDebugValues({...debugValues, dreamFragments: Number(e.target.value)})} + className="w-full p-2 border border-gray-300 rounded-md" + /> +

+ +

+ Dream Essence + setDebugValues({...debugValues, prestigePoints: Number(e.target.value)})} + className="w-full p-2 border border-gray-300 rounded-md" + /> +

+ +

+ + +

+ )} + + {/* Stats modal */} + {showStats && ( +

setShowStats(false)}> +

e.stopPropagation()}> +

Dream Statistics

Total Creativity

{formatNumber(totalCreativity)}

Production

{formatNumber(autoCreativity)}/s

Click Power

{formatNumber(clickPower)}

Dream Level

{dreamLevel}

+ +

Total Clicks: {totalClicks}

Total Creativity: {formatNumber(totalCreativity)}

Dream Level: {dreamLevel}

Dream Essence: {prestigePoints}

Dream Fragments: {dreamFragments}

Highest Creativity/sec: {formatNumber(highestProduction)}

Total Elements Purchased: {totalElementsBought}

Total Upgrades Purchased: {totalUpgradesBought}

Times Awakened: {prestigeCount}

Play Time: {formatPlayTime(Date.now() - gameStartTime)}

+ +

Production Breakdown

+ {elements.filter(e => e.count > 0).map(element => ( +

+ {element.name} ({element.count}) + {formatNumber(element.count * element.production)}/s +

+ ))} + {elements.filter(e => e.count > 0).length === 0 && ( +

No elements purchased yet

+ )} +

+ Total Production + {formatNumber(autoCreativity)}/s +

+ +

Upgrade Effects

+ {upgrades.filter(u => u.count > 0).map(upgrade => ( +

+ {upgrade.name} + Level {upgrade.count} +

+ ))} + {upgrades.filter(u => u.count > 0).length === 0 && ( +

No upgrades purchased yet

+ )} +

+ Prestige Bonus + {prestigePoints > 0 ? `+${prestigePoints * 10}%` : 'None'} +

+ +

Achievements

+ {achievements.map(achievement => ( +

+ {achievement.name} +

{achievement.description}

Reward: {achievement.reward} dream fragments

+ {achievement.earned && !achievement.rewardClaimed && ( + + )} + {achievement.earned && achievement.rewardClaimed && ( + Claimed + )} + {!achievement.earned && ( + Incomplete + )} +

+ ))} +

+ + +

+ )} +

+ + {/* Shop Panel */} +

+ {/* Tab Navigation - Scrollable */} +

+ + + + + +

+ {/* Scroll indicator */} +

+ + {/* Tab Content Area - Scrollable */} +

+ {activeTab === 'elements' ? ( +

Dream Elements

+ {elements.filter(element => element.unlocked).map(element => ( +

{element.name}

{element.description}

Owned: {element.count}

Produces: {element.production} per second

Total: {formatNumber(element.count * element.production)} per second

+ +

+ ))} +

+ ) : activeTab === 'upgrades' ? ( +

Dream Upgrades

+ {upgrades.map(upgrade => { + // For Dream Evolution and Collective Unconscious, don't allow multiple purchases + const isOnePurchaseOnly = upgrade.id === 5 || upgrade.id === 6; + const showBuyButton = !isOnePurchaseOnly || (isOnePurchaseOnly && upgrade.count === 0); + + return ( + (upgrade.unlocked || upgrade.unlockCondition()) && ( +

{upgrade.name} {upgrade.count > 0 && !isOnePurchaseOnly ? `(Level ${upgrade.count})` : ""}

{upgrade.effect}

+ {upgrade.count > 0 && !isOnePurchaseOnly && ( +

+ Current level: {upgrade.count} +

+ )} + {upgrade.count > 0 && isOnePurchaseOnly && ( +

+ Unlocked +

+ )} +

+ {showBuyButton ? ( + + ) : ( +

Purchased

+ )} +

+ ) + ); + })} +

+ ) : activeTab === 'achievements' ? ( +

Achievements

+ {achievements.map(achievement => ( +

+ {achievement.name} +

{achievement.description}

Reward: {achievement.reward} dream fragments

+ {achievement.earned ? ( + achievement.rewardClaimed ? + Completed : + + ) : ( + Incomplete + )} +

+ ))} + +

Statistics

Total Clicks: {totalClicks}

Total Creativity: {formatNumber(totalCreativity)}

Dream Level: {dreamLevel}

Dream Essence: {prestigePoints}

Times Awakened: {prestigeCount}

Play Time: {formatPlayTime(Date.now() - gameStartTime)}

+ + {totalCreativity >= 1000000 && ( + + )} +

+ ) : activeTab === 'fragments' ? ( +

Dream Fragments

Current Fragments: {dreamFragments}

Fragments can be used to purchase special dream items

+ 0 + 1000 fragments +

+ +

Fragment Shop

Dream Accelerator

Boosts creativity production by 25% for 1 hour

+ +

Creativity Cache

Instantly gain 10,000 creativity

+ +

Dream Surge

+50% click power for 30 minutes

+ +

Lucid Enhancer

Doubles dream evolution effect for 15 minutes

+ +

Dream Essence Converter

Turn 500 dream fragments into 1 dream essence

+ +

+ ) : activeTab === 'essence' ? ( +

Dream Essence

+ +

Current Essence: {prestigePoints}

Essence is gained when you wake up from dreams

Current production bonus: +{prestigePoints * 10}%

+ +

Permanent Upgrades

+ {essenceUpgrades.map(upgrade => ( +

{upgrade.name}

{upgrade.description}

+ Level {upgrade.count} +

{upgrade.effect(upgrade.count)}

+ +

+ ))} +

+ + {totalCreativity >= 1000000 && ( + + )} +

+ ) : activeTab === 'settings' ? ( +

Settings

+ +

+ Background Particles +

setSettings(prev => ({...prev, particles: !prev.particles}))} + > +

+ +

+ Notifications +

setSettings(prev => ({...prev, notifications: !prev.notifications}))} + > +

+ +

+ SFX Volume + setSettings(prev => ({...prev, sfxVolume: parseInt(e.target.value)}))} + className="w-full h-2 rounded-lg appearance-none bg-gray-300 focus:outline-none focus:bg-gray-400" + /> +

{settings.sfxVolume}%

+ +

+ Music Volume + setSettings(prev => ({...prev, musicVolume: parseInt(e.target.value)}))} + className="w-full h-2 rounded-lg appearance-none bg-gray-300 focus:outline-none focus:bg-gray-400" + /> +

{settings.musicVolume}%

+ +

+ ) : null} +

+ ); +}; + +export default DreamArchitect; \ No newline at end of file diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..08a3ac9 --- /dev/null +++ b/src/index.css @@ -0,0 +1,68 @@ +:root { + font-family: system-ui, Avenir, Helvetica, Arial, sans-serif; + line-height: 1.5; + font-weight: 400; + + color-scheme: light dark; + color: rgba(255, 255, 255, 0.87); + background-color: #242424; + + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +a { + font-weight: 500; + color: #646cff; + text-decoration: inherit; +} +a:hover { + color: #535bf2; +} + +body { + margin: 0; + display: flex; + place-items: center; + min-width: 320px; + min-height: 100vh; +} + +h1 { + font-size: 3.2em; + line-height: 1.1; +} + +button { + border-radius: 8px; + border: 1px solid transparent; + padding: 0.6em 1.2em; + font-size: 1em; + font-weight: 500; + font-family: inherit; + background-color: #1a1a1a; + cursor: pointer; + transition: border-color 0.25s; +} +button:hover { + border-color: #646cff; +} +button:focus, +button:focus-visible { + outline: 4px auto -webkit-focus-ring-color; +} + +@media (prefers-color-scheme: light) { + :root { + color: #213547; + background-color: #ffffff; + } + a:hover { + color: #747bff; + } + button { + background-color: #f9f9f9; + } +} diff --git a/src/main.jsx b/src/main.jsx new file mode 100644 index 0000000..b9a1a6d --- /dev/null +++ b/src/main.jsx @@ -0,0 +1,10 @@ +import { StrictMode } from 'react' +import { createRoot } from 'react-dom/client' +import './index.css' +import App from './App.jsx' + +createRoot(document.getElementById('root')).render( + + + , +) diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..2328e17 --- /dev/null +++ b/vite.config.js @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import react from '@vitejs/plugin-react-swc' + +// https://vite.dev/config/ +export default defineConfig({ + plugins: [react()], +})