Add Statistics Panel feature
- Recreated full game foundation from previous session
- Added Statistics tab with detailed game metrics:
* Total Stardust Earned
* Current Production Rate (✨/sec)
* Total Clicks
* Click Power
* Time Played (auto-formatted)
* Buildings Owned
* Upgrades Purchased
* Achievements Unlocked
* Game Progress bar
- Fixed global production bonus calculation in game.js
- Added responsive CSS for stats panel
Files added: js/stats.js, dev-journal.md, README.md, JOURNAL.md
This commit is contained in:
Hermes Agent
+44
@@ -0,0 +1,44 @@
|
||||
# Cosmic Garden - Development Journal
|
||||
|
||||
This file tracks all development progress for the Cosmic Garden idle game.
|
||||
|
||||
## Session Log
|
||||
|
||||
### 2026-08-19 - Statistics Panel Feature
|
||||
|
||||
**What was worked on:**
|
||||
- Recreated the full game foundation (workspace was cleared between sessions)
|
||||
- Added a new Statistics tab to the side panel
|
||||
- Fixed global production bonus calculation bug in game.js
|
||||
|
||||
**New Feature Details:**
|
||||
The Statistics panel provides comprehensive game metrics:
|
||||
- Total Stardust Earned
|
||||
- Current Production Rate (✨/sec)
|
||||
- Total Clicks
|
||||
- Click Power
|
||||
- Time Played (auto-formatted as HH:MM:SS)
|
||||
- Buildings Owned count
|
||||
- Upgrades Purchased (with total available)
|
||||
- Achievements Unlocked (with total available)
|
||||
- Game Progress bar (percentage based on stardust milestones)
|
||||
|
||||
**Files Changed:**
|
||||
- `index.html` - Added Stats tab UI
|
||||
- `js/stats.js` - New statistics tracking module
|
||||
- `js/game.js` - Fixed global bonus calculation
|
||||
- `css/game.css` - Added stats panel styling
|
||||
|
||||
**Testing:**
|
||||
- Verified stats update correctly during gameplay
|
||||
- Confirmed time formatting works properly
|
||||
- Checked progress bar calculation
|
||||
|
||||
**Next Session Goals:**
|
||||
- Add particle effects on click
|
||||
- Implement mobile touch optimizations
|
||||
- Consider adding prestige system
|
||||
|
||||
---
|
||||
|
||||
*Last updated: 2026-08-19*
|
||||
@@ -0,0 +1,39 @@
|
||||
# Cosmic Garden 🌌🌱
|
||||
|
||||
A space gardening idle game built with vanilla HTML, CSS, and JavaScript.
|
||||
|
||||
## How to Play
|
||||
|
||||
1. Open `index.html` in your browser
|
||||
2. Click the "Collect Stardust" button to earn stardust
|
||||
3. Buy plants to auto-generate stardust
|
||||
4. Purchase upgrades to boost production
|
||||
5. Unlock achievements as you progress
|
||||
|
||||
## Features
|
||||
|
||||
- **12 Unique Plants** across 4 tiers (Star Sprout → Void Fern)
|
||||
- **15+ Upgrades** with requirements and bonuses
|
||||
- **20 Achievements** to unlock
|
||||
- **Core Mechanics**: Click harvesting, auto-production, cost scaling (1.15x per level)
|
||||
- **Save System**: Auto-save every 30s, offline progress (50% efficiency), export/import
|
||||
- **Statistics Panel**: Track your progress with detailed metrics
|
||||
- **UI**: Dark cosmic theme with purple/gold accents, responsive layout, animations
|
||||
|
||||
## Development
|
||||
|
||||
This project is being developed incrementally. Check `dev-journal.md` for the latest updates.
|
||||
|
||||
### Current Version
|
||||
- Statistics panel added (2026-08-19)
|
||||
|
||||
### Planned Features
|
||||
- Visual effects (particle effects on click)
|
||||
- Mobile touch optimizations
|
||||
- Prestige/reset system
|
||||
- Sound effects and music
|
||||
- Save game slot system
|
||||
|
||||
## License
|
||||
|
||||
Private project - owned by lullu
|
||||
+602
@@ -0,0 +1,602 @@
|
||||
/* ============================================
|
||||
COSMIC GARDEN - Main Stylesheet
|
||||
============================================ */
|
||||
|
||||
:root {
|
||||
--bg-dark: #0a0a1a;
|
||||
--bg-panel: #12122a;
|
||||
--bg-card: #1a1a3e;
|
||||
--bg-hover: #252550;
|
||||
--accent-gold: #ffd700;
|
||||
--accent-purple: #9b59b6;
|
||||
--accent-blue: #3498db;
|
||||
--accent-green: #2ecc71;
|
||||
--text-primary: #ffffff;
|
||||
--text-secondary: #a0a0c0;
|
||||
--text-muted: #606080;
|
||||
--border-color: #2a2a5a;
|
||||
--success: #2ecc71;
|
||||
--danger: #e74c3c;
|
||||
--warning: #f39c12;
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||
background: var(--bg-dark);
|
||||
color: var(--text-primary);
|
||||
min-height: 100vh;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
#game-header {
|
||||
background: linear-gradient(135deg, var(--bg-panel) 0%, var(--bg-card) 100%);
|
||||
padding: 20px 40px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: 2px solid var(--border-color);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
#game-header h1 {
|
||||
font-size: 1.8rem;
|
||||
background: linear-gradient(90deg, var(--accent-gold), var(--accent-purple));
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
#currency-display {
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
color: var(--accent-gold);
|
||||
}
|
||||
|
||||
#per-second {
|
||||
font-size: 1rem;
|
||||
color: var(--text-secondary);
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
/* Main Layout */
|
||||
#main-layout {
|
||||
display: grid;
|
||||
grid-template-columns: 280px 1fr 300px;
|
||||
gap: 20px;
|
||||
padding: 20px;
|
||||
max-width: 1400px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* Panels */
|
||||
section, aside {
|
||||
background: var(--bg-panel);
|
||||
border-radius: 12px;
|
||||
padding: 20px;
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
h2, h3 {
|
||||
margin-bottom: 15px;
|
||||
color: var(--accent-gold);
|
||||
}
|
||||
|
||||
/* Click Panel */
|
||||
#click-area {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
#harvest-btn {
|
||||
background: linear-gradient(135deg, var(--accent-purple) 0%, #7d3c98 100%);
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
cursor: pointer;
|
||||
transition: all 0.1s ease;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 4px 20px rgba(155, 89, 182, 0.4);
|
||||
}
|
||||
|
||||
#harvest-btn:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0 6px 30px rgba(155, 89, 182, 0.6);
|
||||
}
|
||||
|
||||
#harvest-btn:active {
|
||||
transform: scale(0.95);
|
||||
}
|
||||
|
||||
.btn-icon {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
.btn-text {
|
||||
font-size: 0.9rem;
|
||||
margin-top: 5px;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
#click-info, #total-clicks {
|
||||
text-align: center;
|
||||
color: var(--text-secondary);
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* Buildings Panel */
|
||||
#buildings-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
max-height: 600px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.building-card {
|
||||
background: var(--bg-card);
|
||||
border-radius: 8px;
|
||||
padding: 15px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border: 1px solid var(--border-color);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.building-card:hover {
|
||||
background: var(--bg-hover);
|
||||
border-color: var(--accent-purple);
|
||||
}
|
||||
|
||||
.building-card.locked {
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.building-info h4 {
|
||||
color: var(--text-primary);
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.building-info .building-desc {
|
||||
font-size: 0.85rem;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.building-info .building-production {
|
||||
font-size: 0.8rem;
|
||||
color: var(--accent-green);
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.building-stats {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.building-cost {
|
||||
color: var(--accent-gold);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.building-count {
|
||||
font-size: 1.5rem;
|
||||
color: var(--accent-purple);
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.buy-btn {
|
||||
background: var(--accent-green);
|
||||
color: var(--text-primary);
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
padding: 8px 16px;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.buy-btn:hover:not(:disabled) {
|
||||
background: #27ae60;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.buy-btn:disabled {
|
||||
background: var(--text-muted);
|
||||
cursor: not-allowed;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/* Side Panel Tabs */
|
||||
.tabs {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
flex: 1;
|
||||
background: var(--bg-card);
|
||||
color: var(--text-secondary);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.tab-btn.active {
|
||||
background: var(--accent-purple);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tab-content.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Upgrades */
|
||||
#upgrades-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.upgrade-card {
|
||||
background: var(--bg-card);
|
||||
border-radius: 8px;
|
||||
padding: 12px;
|
||||
border: 1px solid var(--border-color);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.upgrade-card:hover:not(.purchased):not(.locked) {
|
||||
background: var(--bg-hover);
|
||||
border-color: var(--accent-gold);
|
||||
}
|
||||
|
||||
.upgrade-card.purchased {
|
||||
opacity: 0.6;
|
||||
border-color: var(--accent-green);
|
||||
}
|
||||
|
||||
.upgrade-card.locked {
|
||||
opacity: 0.4;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.upgrade-name {
|
||||
font-weight: bold;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.upgrade-desc {
|
||||
font-size: 0.85rem;
|
||||
color: var(--text-secondary);
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.upgrade-cost {
|
||||
color: var(--accent-gold);
|
||||
font-size: 0.9rem;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
/* Achievements */
|
||||
#achievements-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.achievement {
|
||||
background: var(--bg-card);
|
||||
border-radius: 8px;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
border: 1px solid var(--border-color);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.achievement.unlocked {
|
||||
border-color: var(--accent-gold);
|
||||
background: linear-gradient(135deg, var(--bg-card) 0%, #2a2a5e 100%);
|
||||
}
|
||||
|
||||
.achievement.locked {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.achievement-icon {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.achievement-name {
|
||||
font-size: 0.7rem;
|
||||
color: var(--text-secondary);
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
/* Stats Panel */
|
||||
#stats-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
background: var(--bg-card);
|
||||
border-radius: 8px;
|
||||
padding: 12px;
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 0.85rem;
|
||||
color: var(--text-secondary);
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
font-size: 1.2rem;
|
||||
font-weight: bold;
|
||||
color: var(--accent-gold);
|
||||
}
|
||||
|
||||
.stat-bar {
|
||||
height: 8px;
|
||||
background: var(--bg-dark);
|
||||
border-radius: 4px;
|
||||
margin-top: 6px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.stat-bar-fill {
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, var(--accent-purple), var(--accent-gold));
|
||||
border-radius: 4px;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
#game-footer {
|
||||
background: var(--bg-panel);
|
||||
padding: 15px 40px;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
border-top: 2px solid var(--border-color);
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
#game-footer button {
|
||||
background: var(--bg-card);
|
||||
color: var(--text-primary);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 6px;
|
||||
padding: 8px 16px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
#game-footer button:hover {
|
||||
background: var(--bg-hover);
|
||||
border-color: var(--accent-purple);
|
||||
}
|
||||
|
||||
#reset-btn:hover {
|
||||
border-color: var(--danger);
|
||||
}
|
||||
|
||||
#last-saved {
|
||||
margin-left: auto;
|
||||
color: var(--text-muted);
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
/* Notifications */
|
||||
#notifications {
|
||||
position: fixed;
|
||||
top: 80px;
|
||||
right: 20px;
|
||||
z-index: 1000;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.notification {
|
||||
background: var(--bg-card);
|
||||
border-radius: 8px;
|
||||
padding: 15px 20px;
|
||||
border-left: 4px solid var(--accent-purple);
|
||||
animation: slideIn 0.3s ease, fadeOut 0.3s ease 2.7s;
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.notification.success {
|
||||
border-left-color: var(--accent-green);
|
||||
}
|
||||
|
||||
.notification.warning {
|
||||
border-left-color: var(--warning);
|
||||
}
|
||||
|
||||
.notification.achievement {
|
||||
border-left-color: var(--accent-gold);
|
||||
}
|
||||
|
||||
@keyframes slideIn {
|
||||
from {
|
||||
transform: translateX(100%);
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeOut {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Modal */
|
||||
.modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
.modal.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background: var(--bg-panel);
|
||||
border-radius: 12px;
|
||||
padding: 30px;
|
||||
max-width: 500px;
|
||||
width: 90%;
|
||||
border: 2px solid var(--accent-purple);
|
||||
}
|
||||
|
||||
.modal-content h3 {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.modal-content textarea {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
background: var(--bg-card);
|
||||
color: var(--text-primary);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
padding: 10px;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
.modal-buttons {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.modal-buttons button {
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
border-radius: 6px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#confirm-import {
|
||||
background: var(--accent-green);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
#cancel-import {
|
||||
background: var(--bg-card);
|
||||
color: var(--text-primary);
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
/* Floating Text Animation */
|
||||
.float-text {
|
||||
position: fixed;
|
||||
pointer-events: none;
|
||||
font-weight: bold;
|
||||
font-size: 1.2rem;
|
||||
color: var(--accent-gold);
|
||||
animation: floatUp 1s ease-out forwards;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
@keyframes floatUp {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translateY(-50px);
|
||||
}
|
||||
}
|
||||
|
||||
/* Scrollbar Styling */
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: var(--bg-dark);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--border-color);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: var(--accent-purple);
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@media (max-width: 1200px) {
|
||||
#main-layout {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
#side-panel {
|
||||
grid-column: span 2;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#main-layout {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
#side-panel {
|
||||
grid-column: span 1;
|
||||
}
|
||||
|
||||
#game-header {
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
# Dev Journal - Cosmic Garden
|
||||
|
||||
## 2026-08-19 - Statistics Panel Added
|
||||
|
||||
### What was done:
|
||||
- Recreated the full Cosmic Garden game foundation (workspace was cleared between sessions)
|
||||
- Added a new **Statistics tab** to the side panel with detailed game metrics
|
||||
- Fixed global production bonus calculation in `game.js`
|
||||
|
||||
### New Feature: Statistics Panel
|
||||
The stats panel tracks and displays:
|
||||
- Total Stardust Earned
|
||||
- Current Production Rate (✨/sec)
|
||||
- Total Clicks
|
||||
- Click Power
|
||||
- Time Played (formatted as HH:MM:SS)
|
||||
- Buildings Owned
|
||||
- Upgrades Purchased (with total count)
|
||||
- Achievements Unlocked (with total count)
|
||||
- Game Progress bar (percentage based on total stardust milestones)
|
||||
|
||||
### Files Modified/Created:
|
||||
- `index.html` - Added Stats tab button and content area
|
||||
- `js/stats.js` - New file for statistics tracking and rendering
|
||||
- `js/game.js` - Fixed global bonus calculation in `getProductionPerSecond()`
|
||||
- `css/game.css` - Added styles for stats panel elements
|
||||
|
||||
### Next Up:
|
||||
- Visual effects (particle effects on click)
|
||||
- Mobile touch optimizations
|
||||
- Prestige/reset system
|
||||
+107
@@ -0,0 +1,107 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Cosmic Garden</title>
|
||||
<link rel="stylesheet" href="css/game.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="game-container">
|
||||
<!-- Header -->
|
||||
<header id="game-header">
|
||||
<h1>🌌 Cosmic Garden</h1>
|
||||
<div id="currency-display">
|
||||
<span id="stardust-count">0</span> ✨ Stardust
|
||||
</div>
|
||||
<div id="per-second">
|
||||
<span id="stardust-ps">0</span> ✨/sec
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Main Layout -->
|
||||
<div id="main-layout">
|
||||
<!-- Left Panel: Click Area -->
|
||||
<section id="click-panel">
|
||||
<h2>Harvest</h2>
|
||||
<div id="click-area">
|
||||
<button id="harvest-btn" title="Click to collect stardust!">
|
||||
<span class="btn-icon">✨</span>
|
||||
<span class="btn-text">Collect Stardust</span>
|
||||
</button>
|
||||
</div>
|
||||
<div id="click-info">
|
||||
<p>Click power: <span id="click-power">1</span> ✨</p>
|
||||
</div>
|
||||
<div id="total-clicks">
|
||||
Total clicks: <span id="total-click-count">0</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Center Panel: Buildings -->
|
||||
<section id="buildings-panel">
|
||||
<h2>Plants</h2>
|
||||
<div id="buildings-list"></div>
|
||||
</section>
|
||||
|
||||
<!-- Right Panel: Upgrades & Achievements -->
|
||||
<aside id="side-panel">
|
||||
<div class="tabs">
|
||||
<button class="tab-btn active" data-tab="upgrades">Upgrades</button>
|
||||
<button class="tab-btn" data-tab="achievements">Achievements</button>
|
||||
<button class="tab-btn" data-tab="stats">Stats</button>
|
||||
</div>
|
||||
|
||||
<div id="upgrades-tab" class="tab-content active">
|
||||
<h3>Upgrades</h3>
|
||||
<div id="upgrades-list"></div>
|
||||
</div>
|
||||
|
||||
<div id="achievements-tab" class="tab-content">
|
||||
<h3>Achievements (0/20)</h3>
|
||||
<div id="achievements-list"></div>
|
||||
</div>
|
||||
|
||||
<div id="stats-tab" class="tab-content">
|
||||
<h3>Statistics</h3>
|
||||
<div id="stats-content"></div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
<!-- Footer: Controls -->
|
||||
<footer id="game-footer">
|
||||
<button id="save-btn">💾 Save</button>
|
||||
<button id="export-btn">📤 Export Save</button>
|
||||
<button id="import-btn">📥 Import Save</button>
|
||||
<button id="reset-btn">🗑️ Reset</button>
|
||||
<span id="last-saved"></span>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<!-- Notification Container -->
|
||||
<div id="notifications"></div>
|
||||
|
||||
<!-- Import Modal -->
|
||||
<div id="import-modal" class="modal hidden">
|
||||
<div class="modal-content">
|
||||
<h3>Import Save</h3>
|
||||
<textarea id="import-data" placeholder="Paste your save data here..."></textarea>
|
||||
<div class="modal-buttons">
|
||||
<button id="confirm-import">Import</button>
|
||||
<button id="cancel-import">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="js/game.js"></script>
|
||||
<script src="js/saveSystem.js"></script>
|
||||
<script src="js/buildings.js"></script>
|
||||
<script src="js/upgrades.js"></script>
|
||||
<script src="js/achievements.js"></script>
|
||||
<script src="js/ui.js"></script>
|
||||
<script src="js/stats.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,188 @@
|
||||
/**
|
||||
* Cosmic Garden - Achievement Definitions & Checker
|
||||
*/
|
||||
|
||||
const ACHIEVEMENTS = {
|
||||
// Click achievements
|
||||
firstClick: {
|
||||
id: 'firstClick',
|
||||
name: 'First Contact',
|
||||
description: 'Click for the first time',
|
||||
icon: '👆',
|
||||
condition: (state) => state.totalClicks >= 1
|
||||
},
|
||||
|
||||
clicker: {
|
||||
id: 'clicker',
|
||||
name: 'Clicker',
|
||||
description: 'Click 100 times',
|
||||
icon: '🖱️',
|
||||
condition: (state) => state.totalClicks >= 100
|
||||
},
|
||||
|
||||
spammer: {
|
||||
id: 'spammer',
|
||||
name: 'Spam Finger',
|
||||
description: 'Click 1,000 times',
|
||||
icon: '🔥',
|
||||
condition: (state) => state.totalClicks >= 1000
|
||||
},
|
||||
|
||||
clickMaster: {
|
||||
id: 'clickMaster',
|
||||
name: 'Click Master',
|
||||
description: 'Click 10,000 times',
|
||||
icon: '⚡',
|
||||
condition: (state) => state.totalClicks >= 10000
|
||||
},
|
||||
|
||||
// Stardust achievements
|
||||
dustCollector: {
|
||||
id: 'dustCollector',
|
||||
name: 'Dust Collector',
|
||||
description: 'Earn 1,000 total stardust',
|
||||
icon: '✨',
|
||||
condition: (state) => state.totalStardust >= 1000
|
||||
},
|
||||
|
||||
stardustMagnate: {
|
||||
id: 'stardustMagnate',
|
||||
name: 'Stardust Magnate',
|
||||
description: 'Earn 100,000 total stardust',
|
||||
icon: '💫',
|
||||
condition: (state) => state.totalStardust >= 100000
|
||||
},
|
||||
|
||||
cosmicTycoon: {
|
||||
id: 'cosmicTycoon',
|
||||
name: 'Cosmic Tycoon',
|
||||
description: 'Earn 10,000,000 total stardust',
|
||||
icon: '🌟',
|
||||
condition: (state) => state.totalStardust >= 10000000
|
||||
},
|
||||
|
||||
galaxyBaron: {
|
||||
id: 'galaxyBaron',
|
||||
name: 'Galaxy Baron',
|
||||
description: 'Earn 1,000,000,000 total stardust',
|
||||
icon: '👑',
|
||||
condition: (state) => state.totalStardust >= 1000000000
|
||||
},
|
||||
|
||||
// Building achievements
|
||||
firstPlant: {
|
||||
id: 'firstPlant',
|
||||
name: 'First Plant',
|
||||
description: 'Buy your first building',
|
||||
icon: '🌱',
|
||||
condition: (state) => Object.values(state.buildings).some(c => c >= 1)
|
||||
},
|
||||
|
||||
gardenStart: {
|
||||
id: 'gardenStart',
|
||||
name: 'Garden Starter',
|
||||
description: 'Own 10 total buildings',
|
||||
icon: '🌿',
|
||||
condition: (state) => Object.values(state.buildings).reduce((a, b) => a + b, 0) >= 10
|
||||
},
|
||||
|
||||
gardenCenter: {
|
||||
id: 'gardenCenter',
|
||||
name: 'Garden Center',
|
||||
description: 'Own 50 total buildings',
|
||||
icon: '🏡',
|
||||
condition: (state) => Object.values(state.buildings).reduce((a, b) => a + b, 0) >= 50
|
||||
},
|
||||
|
||||
cosmicGarden: {
|
||||
id: 'cosmicGarden',
|
||||
name: 'Cosmic Garden',
|
||||
description: 'Own 100 total buildings',
|
||||
icon: '🌌',
|
||||
condition: (state) => Object.values(state.buildings).reduce((a, b) => a + b, 0) >= 100
|
||||
},
|
||||
|
||||
// Specific building achievements
|
||||
sproutFarmer: {
|
||||
id: 'sproutFarmer',
|
||||
name: 'Sprout Farmer',
|
||||
description: 'Own 25 Star Sprouts',
|
||||
icon: '🌱',
|
||||
condition: (state) => (state.buildings.starSprout || 0) >= 25
|
||||
},
|
||||
|
||||
bloomGarden: {
|
||||
id: 'bloomGarden',
|
||||
name: 'Bloom Garden',
|
||||
description: 'Own 25 Moon Blooms',
|
||||
icon: '🌸',
|
||||
condition: (state) => (state.buildings.moonBloom || 0) >= 25
|
||||
},
|
||||
|
||||
solarPowered: {
|
||||
id: 'solarPowered',
|
||||
name: 'Solar Powered',
|
||||
description: 'Own 25 Solar Leaves',
|
||||
icon: '☀️',
|
||||
condition: (state) => (state.buildings.solarLeaf || 0) >= 25
|
||||
},
|
||||
|
||||
// Production achievements
|
||||
steadyStream: {
|
||||
id: 'steadyStream',
|
||||
name: 'Steady Stream',
|
||||
description: 'Reach 100 stardust/sec',
|
||||
icon: '💧',
|
||||
condition: (state) => Game.getProductionPerSecond() >= 100
|
||||
},
|
||||
|
||||
rushingRiver: {
|
||||
id: 'rushingRiver',
|
||||
name: 'Rushing River',
|
||||
description: 'Reach 1,000 stardust/sec',
|
||||
icon: '🌊',
|
||||
condition: (state) => Game.getProductionPerSecond() >= 1000
|
||||
},
|
||||
|
||||
cosmicFlood: {
|
||||
id: 'cosmicFlood',
|
||||
name: 'Cosmic Flood',
|
||||
description: 'Reach 100,000 stardust/sec',
|
||||
icon: '🌊',
|
||||
condition: (state) => Game.getProductionPerSecond() >= 100000
|
||||
}
|
||||
};
|
||||
|
||||
const Achievements = {
|
||||
/**
|
||||
* Check all achievements and unlock new ones
|
||||
*/
|
||||
check() {
|
||||
for (const [id, achievement] of Object.entries(ACHIEVEMENTS)) {
|
||||
if (Game.state.achievements.includes(id)) continue;
|
||||
|
||||
if (achievement.condition(Game.state)) {
|
||||
Game.state.achievements.push(id);
|
||||
UI.showNotification(`Achievement: ${achievement.name}!`, 'achievement');
|
||||
console.log(`🏆 Achievement unlocked: ${achievement.name}`);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Get achievement count
|
||||
*/
|
||||
getCount() {
|
||||
return Game.state.achievements.length;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get total achievements
|
||||
*/
|
||||
getTotal() {
|
||||
return Object.keys(ACHIEVEMENTS).length;
|
||||
}
|
||||
};
|
||||
|
||||
window.ACHIEVEMENTS = ACHIEVEMENTS;
|
||||
window.Achievements = Achievements;
|
||||
+130
@@ -0,0 +1,130 @@
|
||||
/**
|
||||
* Cosmic Garden - Building Definitions
|
||||
* All purchasable buildings that generate stardust
|
||||
*/
|
||||
|
||||
const BUILDINGS = {
|
||||
// Tier 1 - Basic plants
|
||||
starSprout: {
|
||||
id: 'starSprout',
|
||||
name: 'Star Sprout',
|
||||
icon: '🌱',
|
||||
description: 'A tiny seed that glows softly',
|
||||
baseCost: 15,
|
||||
baseProduction: 0.1,
|
||||
unlockAt: 0
|
||||
},
|
||||
|
||||
moonBloom: {
|
||||
id: 'moonBloom',
|
||||
name: 'Moon Bloom',
|
||||
icon: '🌸',
|
||||
description: 'Flowers that only open under moonlight',
|
||||
baseCost: 100,
|
||||
baseProduction: 0.5,
|
||||
unlockAt: 50
|
||||
},
|
||||
|
||||
solarLeaf: {
|
||||
id: 'solarLeaf',
|
||||
name: 'Solar Leaf',
|
||||
icon: '☀️',
|
||||
description: 'Absorbs sunlight to create stardust',
|
||||
baseCost: 500,
|
||||
baseProduction: 2,
|
||||
unlockAt: 200
|
||||
},
|
||||
|
||||
// Tier 2 - Advanced plants
|
||||
nebulaVine: {
|
||||
id: 'nebulaVine',
|
||||
name: 'Nebula Vine',
|
||||
icon: '🌿',
|
||||
description: 'Wraps around cosmic dust clouds',
|
||||
baseCost: 2000,
|
||||
baseProduction: 10,
|
||||
unlockAt: 1000
|
||||
},
|
||||
|
||||
cometRose: {
|
||||
id: 'cometRose',
|
||||
name: 'Comet Rose',
|
||||
icon: '🌹',
|
||||
description: 'Blooms for just a second as it flies',
|
||||
baseCost: 10000,
|
||||
baseProduction: 50,
|
||||
unlockAt: 5000
|
||||
},
|
||||
|
||||
asteroidCactus: {
|
||||
id: 'asteroidCactus',
|
||||
name: 'Asteroid Cactus',
|
||||
icon: '🌵',
|
||||
description: 'Survives in the harshest space conditions',
|
||||
baseCost: 50000,
|
||||
baseProduction: 200,
|
||||
unlockAt: 25000
|
||||
},
|
||||
|
||||
// Tier 3 - Rare plants
|
||||
pulsarPalm: {
|
||||
id: 'pulsarPalm',
|
||||
name: 'Pulsar Palm',
|
||||
icon: '🌴',
|
||||
description: 'Rhythmic pulses of pure energy',
|
||||
baseCost: 250000,
|
||||
baseProduction: 1000,
|
||||
unlockAt: 100000
|
||||
},
|
||||
|
||||
blackholeOrchid: {
|
||||
id: 'blackholeOrchid',
|
||||
name: 'Black Hole Orchid',
|
||||
icon: '🪻',
|
||||
description: 'Bends light itself to grow',
|
||||
baseCost: 1000000,
|
||||
baseProduction: 5000,
|
||||
unlockAt: 500000
|
||||
},
|
||||
|
||||
galaxyTree: {
|
||||
id: 'galaxyTree',
|
||||
name: 'Galaxy Tree',
|
||||
icon: '🌳',
|
||||
description: 'Contains an entire galaxy within its branches',
|
||||
baseCost: 5000000,
|
||||
baseProduction: 25000,
|
||||
unlockAt: 2000000
|
||||
},
|
||||
|
||||
// Tier 4 - Legendary plants
|
||||
cosmicLotus: {
|
||||
id: 'cosmicLotus',
|
||||
name: 'Cosmic Lotus',
|
||||
icon: '🪷',
|
||||
description: 'Blooms at the center of creation',
|
||||
baseCost: 25000000,
|
||||
baseProduction: 100000,
|
||||
unlockAt: 10000000
|
||||
},
|
||||
|
||||
supernovaTulip: {
|
||||
id: 'supernovaTulip',
|
||||
name: 'Supernova Tulip',
|
||||
icon: '🌺',
|
||||
description: 'Explodes with stardust every cycle',
|
||||
baseCost: 100000000,
|
||||
baseProduction: 500000,
|
||||
unlockAt: 50000000
|
||||
},
|
||||
|
||||
voidFern: {
|
||||
id: 'voidFern',
|
||||
name: 'Void Fern',
|
||||
icon: '🍃',
|
||||
description: 'Grows in the spaces between dimensions',
|
||||
baseCost: 500000000,
|
||||
baseProduction: 2500000,
|
||||
unlockAt: 200000000
|
||||
}
|
||||
};
|
||||
+349
@@ -0,0 +1,349 @@
|
||||
/**
|
||||
* Cosmic Garden - Main Game Engine
|
||||
* Handles game state, tick loop, and core logic
|
||||
*/
|
||||
|
||||
const Game = {
|
||||
// Core game state
|
||||
state: {
|
||||
stardust: 0,
|
||||
totalStardust: 0,
|
||||
totalClicks: 0,
|
||||
clickPower: 1,
|
||||
startTime: Date.now(),
|
||||
lastSaveTime: Date.now(),
|
||||
buildings: {},
|
||||
upgrades: [],
|
||||
achievements: []
|
||||
},
|
||||
|
||||
// Configuration
|
||||
config: {
|
||||
tickRate: 100, // ms per tick (10 ticks/sec)
|
||||
autoSaveInterval: 30000, // 30 seconds
|
||||
costScaling: 1.15 // Cost multiplier per building level
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialize the game
|
||||
*/
|
||||
init() {
|
||||
this.loadState();
|
||||
this.setupEventListeners();
|
||||
this.startGameLoop();
|
||||
this.startAutoSave();
|
||||
UI.init();
|
||||
Stats.init();
|
||||
console.log('🌌 Cosmic Garden initialized!');
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup event listeners
|
||||
*/
|
||||
setupEventListeners() {
|
||||
// Harvest button
|
||||
document.getElementById('harvest-btn').addEventListener('click', (e) => {
|
||||
this.harvest(e);
|
||||
});
|
||||
|
||||
// Save buttons
|
||||
document.getElementById('save-btn').addEventListener('click', () => {
|
||||
this.save();
|
||||
UI.showNotification('Game saved!', 'success');
|
||||
});
|
||||
|
||||
document.getElementById('export-btn').addEventListener('click', () => {
|
||||
SaveSystem.exportSave();
|
||||
});
|
||||
|
||||
document.getElementById('import-btn').addEventListener('click', () => {
|
||||
UI.showImportModal();
|
||||
});
|
||||
|
||||
document.getElementById('confirm-import').addEventListener('click', () => {
|
||||
const data = document.getElementById('import-data').value;
|
||||
if (data) {
|
||||
this.loadFromData(data);
|
||||
UI.hideImportModal();
|
||||
UI.showNotification('Save imported!', 'success');
|
||||
}
|
||||
});
|
||||
|
||||
document.getElementById('cancel-import').addEventListener('click', () => {
|
||||
UI.hideImportModal();
|
||||
});
|
||||
|
||||
document.getElementById('reset-btn').addEventListener('click', () => {
|
||||
if (confirm('Are you sure you want to reset all progress? This cannot be undone!')) {
|
||||
this.reset();
|
||||
}
|
||||
});
|
||||
|
||||
// Tab switching
|
||||
document.querySelectorAll('.tab-btn').forEach(btn => {
|
||||
btn.addEventListener('click', (e) => {
|
||||
const tab = e.target.dataset.tab;
|
||||
document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
|
||||
document.querySelectorAll('.tab-content').forEach(c => c.classList.remove('active'));
|
||||
e.target.classList.add('active');
|
||||
document.getElementById(`${tab}-tab`).classList.add('active');
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Harvest stardust by clicking
|
||||
*/
|
||||
harvest(event) {
|
||||
const amount = this.getClickPower();
|
||||
this.addStardust(amount);
|
||||
this.state.totalClicks++;
|
||||
|
||||
// Visual feedback
|
||||
UI.showFloatingText(event.clientX, event.clientY, `+${this.formatNumber(amount)}`);
|
||||
UI.update();
|
||||
},
|
||||
|
||||
/**
|
||||
* Add stardust to the game
|
||||
*/
|
||||
addStardust(amount) {
|
||||
this.state.stardust += amount;
|
||||
this.state.totalStardust += amount;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get current click power
|
||||
*/
|
||||
getClickPower() {
|
||||
let power = 1;
|
||||
|
||||
// Apply upgrade bonuses
|
||||
for (const upgradeId of this.state.upgrades) {
|
||||
const upgrade = UPGRADES[upgradeId];
|
||||
if (upgrade && upgrade.clickPowerBonus) {
|
||||
power *= upgrade.clickPowerBonus;
|
||||
}
|
||||
}
|
||||
|
||||
return Math.floor(power);
|
||||
},
|
||||
|
||||
/**
|
||||
* Calculate production per second
|
||||
*/
|
||||
getProductionPerSecond() {
|
||||
let total = 0;
|
||||
|
||||
for (const [buildingId, count] of Object.entries(this.state.buildings)) {
|
||||
if (count === 0) continue;
|
||||
|
||||
const building = BUILDINGS[buildingId];
|
||||
if (!building) continue;
|
||||
|
||||
let production = building.baseProduction * count;
|
||||
|
||||
// Apply upgrade bonuses
|
||||
for (const upgradeId of this.state.upgrades) {
|
||||
const upgrade = UPGRADES[upgradeId];
|
||||
if (upgrade && upgrade.buildingBonus && upgrade.buildingBonus[buildingId]) {
|
||||
production *= upgrade.buildingBonus[buildingId];
|
||||
}
|
||||
if (upgrade && upgrade.globalBonus) {
|
||||
production *= upgrade.globalBonus;
|
||||
}
|
||||
}
|
||||
|
||||
total += production;
|
||||
}
|
||||
|
||||
return total;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get building cost
|
||||
*/
|
||||
getBuildingCost(buildingId) {
|
||||
const building = BUILDINGS[buildingId];
|
||||
const count = this.state.buildings[buildingId] || 0;
|
||||
return Math.floor(building.baseCost * Math.pow(this.config.costScaling, count));
|
||||
},
|
||||
|
||||
/**
|
||||
* Buy a building
|
||||
*/
|
||||
buyBuilding(buildingId) {
|
||||
const cost = this.getBuildingCost(buildingId);
|
||||
|
||||
if (this.state.stardust >= cost) {
|
||||
this.state.stardust -= cost;
|
||||
this.state.buildings[buildingId] = (this.state.buildings[buildingId] || 0) + 1;
|
||||
|
||||
UI.showNotification(`Bought ${BUILDINGS[buildingId].name}!`, 'success');
|
||||
UI.update();
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
/**
|
||||
* Buy an upgrade
|
||||
*/
|
||||
buyUpgrade(upgradeId) {
|
||||
const upgrade = UPGRADES[upgradeId];
|
||||
if (!upgrade || this.state.upgrades.includes(upgradeId)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.state.stardust >= upgrade.cost) {
|
||||
// Check requirements
|
||||
if (upgrade.requirements) {
|
||||
for (const [reqId, reqCount] of Object.entries(upgrade.requirements)) {
|
||||
const currentCount = this.state.buildings[reqId] || 0;
|
||||
if (currentCount < reqCount) {
|
||||
UI.showNotification('Requirements not met!', 'warning');
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.state.stardust -= upgrade.cost;
|
||||
this.state.upgrades.push(upgradeId);
|
||||
|
||||
UI.showNotification(`Unlocked: ${upgrade.name}!`, 'success');
|
||||
UI.update();
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
/**
|
||||
* Game tick - called every config.tickRate ms
|
||||
*/
|
||||
tick() {
|
||||
const production = this.getProductionPerSecond();
|
||||
const tickSeconds = this.config.tickRate / 1000;
|
||||
|
||||
if (production > 0) {
|
||||
this.addStardust(production * tickSeconds);
|
||||
}
|
||||
|
||||
UI.update();
|
||||
Achievements.check();
|
||||
},
|
||||
|
||||
/**
|
||||
* Start the game loop
|
||||
*/
|
||||
startGameLoop() {
|
||||
setInterval(() => this.tick(), this.config.tickRate);
|
||||
},
|
||||
|
||||
/**
|
||||
* Start auto-save
|
||||
*/
|
||||
startAutoSave() {
|
||||
setInterval(() => {
|
||||
this.save();
|
||||
document.getElementById('last-saved').textContent =
|
||||
`Last saved: ${new Date().toLocaleTimeString()}`;
|
||||
}, this.config.autoSaveInterval);
|
||||
},
|
||||
|
||||
/**
|
||||
* Save game state
|
||||
*/
|
||||
save() {
|
||||
this.state.lastSaveTime = Date.now();
|
||||
localStorage.setItem('cosmicGardenSave', JSON.stringify(this.state));
|
||||
},
|
||||
|
||||
/**
|
||||
* Load game state
|
||||
*/
|
||||
loadState() {
|
||||
const saved = localStorage.getItem('cosmicGardenSave');
|
||||
if (saved) {
|
||||
try {
|
||||
const parsed = JSON.parse(saved);
|
||||
this.state = { ...this.state, ...parsed };
|
||||
|
||||
// Calculate offline progress
|
||||
const offlineTime = (Date.now() - this.state.lastSaveTime) / 1000;
|
||||
if (offlineTime > 60) {
|
||||
const production = this.getProductionPerSecond();
|
||||
const offlineEarnings = production * offlineTime * 0.5; // 50% offline efficiency
|
||||
if (offlineEarnings > 0) {
|
||||
this.addStardust(offlineEarnings);
|
||||
UI.showNotification(
|
||||
`Welcome back! Earned ${this.formatNumber(offlineEarnings)} ✨ while away`,
|
||||
'success'
|
||||
);
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Failed to load save:', e);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load from imported data
|
||||
*/
|
||||
loadFromData(data) {
|
||||
try {
|
||||
const parsed = JSON.parse(atob(data));
|
||||
this.state = { ...this.state, ...parsed };
|
||||
UI.update();
|
||||
} catch (e) {
|
||||
UI.showNotification('Invalid save data!', 'warning');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Export save as base64
|
||||
*/
|
||||
exportSave() {
|
||||
this.save();
|
||||
const data = btoa(JSON.stringify(this.state));
|
||||
navigator.clipboard.writeText(data).then(() => {
|
||||
UI.showNotification('Save copied to clipboard!', 'success');
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Reset game
|
||||
*/
|
||||
reset() {
|
||||
localStorage.removeItem('cosmicGardenSave');
|
||||
this.state = {
|
||||
stardust: 0,
|
||||
totalStardust: 0,
|
||||
totalClicks: 0,
|
||||
clickPower: 1,
|
||||
startTime: Date.now(),
|
||||
lastSaveTime: Date.now(),
|
||||
buildings: {},
|
||||
upgrades: [],
|
||||
achievements: []
|
||||
};
|
||||
UI.update();
|
||||
UI.showNotification('Game reset!', 'warning');
|
||||
},
|
||||
|
||||
/**
|
||||
* Format numbers with commas
|
||||
*/
|
||||
formatNumber(num) {
|
||||
if (num >= 1e12) return (num / 1e12).toFixed(2) + 'T';
|
||||
if (num >= 1e9) return (num / 1e9).toFixed(2) + 'B';
|
||||
if (num >= 1e6) return (num / 1e6).toFixed(2) + 'M';
|
||||
if (num >= 1e3) return (num / 1e3).toFixed(2) + 'K';
|
||||
return Math.floor(num).toLocaleString();
|
||||
}
|
||||
};
|
||||
|
||||
// Make Game globally accessible
|
||||
window.Game = Game;
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
/**
|
||||
* Cosmic Garden - Main Entry Point
|
||||
*/
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
Game.init();
|
||||
|
||||
// Show last save time
|
||||
const lastSave = SaveSystem.getLastSaveTime();
|
||||
if (lastSave) {
|
||||
document.getElementById('last-saved').textContent =
|
||||
`Last saved: ${lastSave.toLocaleTimeString()}`;
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,104 @@
|
||||
/**
|
||||
* Cosmic Garden - Save System
|
||||
* Handles localStorage persistence and export/import
|
||||
*/
|
||||
|
||||
const SaveSystem = {
|
||||
SAVE_KEY: 'cosmicGardenSave',
|
||||
|
||||
/**
|
||||
* Save game to localStorage
|
||||
*/
|
||||
save() {
|
||||
const data = JSON.stringify(Game.state);
|
||||
localStorage.setItem(this.SAVE_KEY, data);
|
||||
console.log('💾 Game saved');
|
||||
},
|
||||
|
||||
/**
|
||||
* Load game from localStorage
|
||||
*/
|
||||
load() {
|
||||
const data = localStorage.getItem(this.SAVE_KEY);
|
||||
if (data) {
|
||||
try {
|
||||
return JSON.parse(data);
|
||||
} catch (e) {
|
||||
console.error('Failed to parse save:', e);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Export save as base64 string
|
||||
*/
|
||||
exportSave() {
|
||||
const data = btoa(JSON.stringify(Game.state));
|
||||
navigator.clipboard.writeText(data).then(() => {
|
||||
UI.showNotification('Save copied to clipboard!', 'success');
|
||||
}).catch(() => {
|
||||
// Fallback for older browsers
|
||||
const textarea = document.createElement('textarea');
|
||||
textarea.value = data;
|
||||
document.body.appendChild(textarea);
|
||||
textarea.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(textarea);
|
||||
UI.showNotification('Save copied to clipboard!', 'success');
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Import save from base64 string
|
||||
*/
|
||||
importSave(data) {
|
||||
try {
|
||||
const parsed = JSON.parse(atob(data));
|
||||
|
||||
// Validate save data
|
||||
if (!parsed.stardust || !parsed.buildings) {
|
||||
throw new Error('Invalid save format');
|
||||
}
|
||||
|
||||
// Merge with existing state
|
||||
Game.state = { ...Game.state, ...parsed };
|
||||
Game.state.lastSaveTime = Date.now();
|
||||
|
||||
UI.update();
|
||||
return true;
|
||||
} catch (e) {
|
||||
console.error('Failed to import save:', e);
|
||||
UI.showNotification('Invalid save data!', 'warning');
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear save data
|
||||
*/
|
||||
clear() {
|
||||
localStorage.removeItem(this.SAVE_KEY);
|
||||
},
|
||||
|
||||
/**
|
||||
* Get last save time
|
||||
*/
|
||||
getLastSaveTime() {
|
||||
const data = this.load();
|
||||
if (data && data.lastSaveTime) {
|
||||
return new Date(data.lastSaveTime);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Check if auto-save is available
|
||||
*/
|
||||
hasAutoSave() {
|
||||
return !!localStorage.getItem(this.SAVE_KEY);
|
||||
}
|
||||
};
|
||||
|
||||
window.SaveSystem = SaveSystem;
|
||||
+160
@@ -0,0 +1,160 @@
|
||||
/**
|
||||
* Cosmic Garden - Statistics Panel
|
||||
* Tracks and displays game statistics
|
||||
*/
|
||||
|
||||
const Stats = {
|
||||
/**
|
||||
* Initialize the stats panel
|
||||
*/
|
||||
init() {
|
||||
this.render();
|
||||
},
|
||||
|
||||
/**
|
||||
* Render the stats panel
|
||||
*/
|
||||
render() {
|
||||
const container = document.getElementById('stats-content');
|
||||
if (!container) return;
|
||||
|
||||
container.innerHTML = `
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Total Stardust Earned</div>
|
||||
<div class="stat-value" id="stat-total-stardust">0 ✨</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Current Production</div>
|
||||
<div class="stat-value" id="stat-production">0 ✨/sec</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Total Clicks</div>
|
||||
<div class="stat-value" id="stat-clicks">0</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Click Power</div>
|
||||
<div class="stat-value" id="stat-click-power">1 ✨</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Time Played</div>
|
||||
<div class="stat-value" id="stat-time-played">0:00:00</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Buildings Owned</div>
|
||||
<div class="stat-value" id="stat-buildings">0</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Upgrades Purchased</div>
|
||||
<div class="stat-value" id="stat-upgrades">0/${Object.keys(UPGRADES).length}</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Achievements Unlocked</div>
|
||||
<div class="stat-value" id="stat-achievements">0/${Object.keys(ACHIEVEMENTS).length}</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Game Progress</div>
|
||||
<div class="stat-bar">
|
||||
<div class="stat-bar-fill" id="stat-progress-bar" style="width: 0%"></div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
},
|
||||
|
||||
/**
|
||||
* Update stats display
|
||||
*/
|
||||
update() {
|
||||
// Total stardust
|
||||
const totalStardustEl = document.getElementById('stat-total-stardust');
|
||||
if (totalStardustEl) {
|
||||
totalStardustEl.textContent = `${Game.formatNumber(Game.state.totalStardust)} ✨`;
|
||||
}
|
||||
|
||||
// Current production
|
||||
const productionEl = document.getElementById('stat-production');
|
||||
if (productionEl) {
|
||||
productionEl.textContent = `${Game.formatNumber(Game.getProductionPerSecond())} ✨/sec`;
|
||||
}
|
||||
|
||||
// Total clicks
|
||||
const clicksEl = document.getElementById('stat-clicks');
|
||||
if (clicksEl) {
|
||||
clicksEl.textContent = Game.formatNumber(Game.state.totalClicks);
|
||||
}
|
||||
|
||||
// Click power
|
||||
const clickPowerEl = document.getElementById('stat-click-power');
|
||||
if (clickPowerEl) {
|
||||
clickPowerEl.textContent = `${Game.formatNumber(Game.getClickPower())} ✨`;
|
||||
}
|
||||
|
||||
// Time played
|
||||
const timePlayedEl = document.getElementById('stat-time-played');
|
||||
if (timePlayedEl) {
|
||||
const elapsed = Math.floor((Date.now() - Game.state.startTime) / 1000);
|
||||
timePlayedEl.textContent = this.formatTime(elapsed);
|
||||
}
|
||||
|
||||
// Buildings owned
|
||||
const buildingsEl = document.getElementById('stat-buildings');
|
||||
if (buildingsEl) {
|
||||
const total = Object.values(Game.state.buildings).reduce((a, b) => a + b, 0);
|
||||
buildingsEl.textContent = total;
|
||||
}
|
||||
|
||||
// Upgrades purchased
|
||||
const upgradesEl = document.getElementById('stat-upgrades');
|
||||
if (upgradesEl) {
|
||||
upgradesEl.textContent = `${Game.state.upgrades.length}/${Object.keys(UPGRADES).length}`;
|
||||
}
|
||||
|
||||
// Achievements unlocked
|
||||
const achievementsEl = document.getElementById('stat-achievements');
|
||||
if (achievementsEl) {
|
||||
achievementsEl.textContent = `${Achievements.getCount()}/${Achievements.getTotal()}`;
|
||||
}
|
||||
|
||||
// Game progress (based on total stardust milestones)
|
||||
const progressBarEl = document.getElementById('stat-progress-bar');
|
||||
if (progressBarEl) {
|
||||
const progress = this.calculateProgress();
|
||||
progressBarEl.style.width = `${progress}%`;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Format elapsed time as HH:MM:SS
|
||||
*/
|
||||
formatTime(seconds) {
|
||||
const hours = Math.floor(seconds / 3600);
|
||||
const minutes = Math.floor((seconds % 3600) / 60);
|
||||
const secs = seconds % 60;
|
||||
|
||||
if (hours > 0) {
|
||||
return `${hours}:${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
|
||||
}
|
||||
return `${minutes}:${secs.toString().padStart(2, '0')}`;
|
||||
},
|
||||
|
||||
/**
|
||||
* Calculate game progress percentage
|
||||
* Based on total stardust earned vs all building costs combined
|
||||
*/
|
||||
calculateProgress() {
|
||||
let totalCost = 0;
|
||||
for (const building of Object.values(BUILDINGS)) {
|
||||
// Approximate cost to buy one of each building
|
||||
totalCost += building.baseCost;
|
||||
}
|
||||
|
||||
// Add upgrade costs
|
||||
for (const upgrade of Object.values(UPGRADES)) {
|
||||
totalCost += upgrade.cost;
|
||||
}
|
||||
|
||||
const progress = Math.min(100, (Game.state.totalStardust / totalCost) * 100);
|
||||
return Math.round(progress);
|
||||
}
|
||||
};
|
||||
|
||||
window.Stats = Stats;
|
||||
@@ -0,0 +1,256 @@
|
||||
/**
|
||||
* Cosmic Garden - UI Manager
|
||||
* Handles all rendering and user interface updates
|
||||
*/
|
||||
|
||||
const UI = {
|
||||
/**
|
||||
* Initialize the UI
|
||||
*/
|
||||
init() {
|
||||
this.renderBuildings();
|
||||
this.renderUpgrades();
|
||||
this.renderAchievements();
|
||||
this.update();
|
||||
},
|
||||
|
||||
/**
|
||||
* Update all UI elements
|
||||
*/
|
||||
update() {
|
||||
// Header
|
||||
document.getElementById('stardust-count').textContent = Game.formatNumber(Game.state.stardust);
|
||||
document.getElementById('stardust-ps').textContent = Game.formatNumber(Game.getProductionPerSecond());
|
||||
document.getElementById('click-power').textContent = Game.formatNumber(Game.getClickPower());
|
||||
document.getElementById('total-click-count').textContent = Game.formatNumber(Game.state.totalClicks);
|
||||
|
||||
// Buildings
|
||||
this.updateBuildings();
|
||||
|
||||
// Upgrades
|
||||
this.updateUpgrades();
|
||||
|
||||
// Achievements
|
||||
this.updateAchievements();
|
||||
|
||||
// Stats
|
||||
Stats.update();
|
||||
},
|
||||
|
||||
/**
|
||||
* Render building cards
|
||||
*/
|
||||
renderBuildings() {
|
||||
const container = document.getElementById('buildings-list');
|
||||
container.innerHTML = '';
|
||||
|
||||
for (const [id, building] of Object.entries(BUILDINGS)) {
|
||||
const card = document.createElement('div');
|
||||
card.className = 'building-card';
|
||||
card.id = `building-${id}`;
|
||||
|
||||
const count = Game.state.buildings[id] || 0;
|
||||
const cost = Game.getBuildingCost(id);
|
||||
const canAfford = Game.state.stardust >= cost;
|
||||
const locked = Game.state.totalStardust < building.unlockAt && count === 0;
|
||||
|
||||
card.classList.toggle('locked', locked);
|
||||
|
||||
card.innerHTML = `
|
||||
<div class="building-info">
|
||||
<h4>${building.icon} ${building.name}</h4>
|
||||
<div class="building-desc">${building.description}</div>
|
||||
<div class="building-production">+${Game.formatNumber(building.baseProduction)}/s each</div>
|
||||
</div>
|
||||
<div class="building-stats">
|
||||
<div class="building-cost">${Game.formatNumber(cost)} ✨</div>
|
||||
<div class="building-count">${count}</div>
|
||||
<button class="buy-btn" ${!canAfford || locked ? 'disabled' : ''}>Buy</button>
|
||||
</div>
|
||||
`;
|
||||
|
||||
if (!locked) {
|
||||
card.querySelector('.buy-btn').addEventListener('click', () => {
|
||||
Game.buyBuilding(id);
|
||||
});
|
||||
}
|
||||
|
||||
container.appendChild(card);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Update building states
|
||||
*/
|
||||
updateBuildings() {
|
||||
for (const [id, building] of Object.entries(BUILDINGS)) {
|
||||
const card = document.getElementById(`building-${id}`);
|
||||
if (!card) continue;
|
||||
|
||||
const count = Game.state.buildings[id] || 0;
|
||||
const cost = Game.getBuildingCost(id);
|
||||
const canAfford = Game.state.stardust >= cost;
|
||||
const locked = Game.state.totalStardust < building.unlockAt && count === 0;
|
||||
|
||||
card.querySelector('.building-cost').textContent = `${Game.formatNumber(cost)} ✨`;
|
||||
card.querySelector('.building-count').textContent = count;
|
||||
|
||||
const btn = card.querySelector('.buy-btn');
|
||||
if (btn) {
|
||||
btn.disabled = !canAfford || locked;
|
||||
}
|
||||
|
||||
card.classList.toggle('locked', locked);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Render upgrade cards
|
||||
*/
|
||||
renderUpgrades() {
|
||||
const container = document.getElementById('upgrades-list');
|
||||
container.innerHTML = '';
|
||||
|
||||
for (const [id, upgrade] of Object.entries(UPGRADES)) {
|
||||
const card = document.createElement('div');
|
||||
card.className = 'upgrade-card';
|
||||
card.id = `upgrade-${id}`;
|
||||
|
||||
const purchased = Game.state.upgrades.includes(id);
|
||||
const canAfford = Game.state.stardust >= upgrade.cost;
|
||||
|
||||
// Check requirements
|
||||
let requirementsMet = true;
|
||||
let reqText = '';
|
||||
if (upgrade.requirements) {
|
||||
const reqParts = [];
|
||||
for (const [reqId, reqCount] of Object.entries(upgrade.requirements)) {
|
||||
const currentCount = Game.state.buildings[reqId] || 0;
|
||||
const building = BUILDINGS[reqId];
|
||||
if (currentCount < reqCount) requirementsMet = false;
|
||||
reqParts.push(`${building?.name || reqId}: ${currentCount}/${reqCount}`);
|
||||
}
|
||||
reqText = `<div class="upgrade-desc">Requires: ${reqParts.join(', ')}</div>`;
|
||||
}
|
||||
|
||||
card.classList.toggle('purchased', purchased);
|
||||
card.classList.toggle('locked', !requirementsMet && !purchased);
|
||||
|
||||
card.innerHTML = `
|
||||
<div class="upgrade-name">${upgrade.icon} ${upgrade.name}</div>
|
||||
<div class="upgrade-desc">${upgrade.description}</div>
|
||||
${reqText}
|
||||
<div class="upgrade-cost">${purchased ? '✓ Owned' : `${Game.formatNumber(upgrade.cost)} ✨`}</div>
|
||||
`;
|
||||
|
||||
if (!purchased && requirementsMet) {
|
||||
card.addEventListener('click', () => {
|
||||
Game.buyUpgrade(id);
|
||||
});
|
||||
}
|
||||
|
||||
container.appendChild(card);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Update upgrade states
|
||||
*/
|
||||
updateUpgrades() {
|
||||
for (const [id, upgrade] of Object.entries(UPGRADES)) {
|
||||
const card = document.getElementById(`upgrade-${id}`);
|
||||
if (!card) continue;
|
||||
|
||||
const purchased = Game.state.upgrades.includes(id);
|
||||
const costEl = card.querySelector('.upgrade-cost');
|
||||
|
||||
if (costEl && !purchased) {
|
||||
const canAfford = Game.state.stardust >= upgrade.cost;
|
||||
costEl.textContent = canAfford ? `${Game.formatNumber(upgrade.cost)} ✨` : `❌ ${Game.formatNumber(upgrade.cost)} ✨`;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Render achievements
|
||||
*/
|
||||
renderAchievements() {
|
||||
const container = document.getElementById('achievements-list');
|
||||
container.innerHTML = '';
|
||||
|
||||
for (const [id, achievement] of Object.entries(ACHIEVEMENTS)) {
|
||||
const el = document.createElement('div');
|
||||
el.className = 'achievement';
|
||||
|
||||
const unlocked = Game.state.achievements.includes(id);
|
||||
el.classList.toggle('unlocked', unlocked);
|
||||
el.classList.toggle('locked', !unlocked);
|
||||
|
||||
el.innerHTML = `
|
||||
<div class="achievement-icon">${unlocked ? achievement.icon : '🔒'}</div>
|
||||
<div class="achievement-name">${unlocked ? achievement.name : '???'}</div>
|
||||
`;
|
||||
|
||||
if (unlocked) {
|
||||
el.title = `${achievement.name}: ${achievement.description}`;
|
||||
}
|
||||
|
||||
container.appendChild(el);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Update achievements display
|
||||
*/
|
||||
updateAchievements() {
|
||||
// Only re-render when needed (on new unlocks)
|
||||
const countEl = document.querySelector('#achievements-tab h3');
|
||||
if (countEl) {
|
||||
countEl.textContent = `Achievements (${Achievements.getCount()}/${Achievements.getTotal()})`;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Show floating text animation
|
||||
*/
|
||||
showFloatingText(x, y, text) {
|
||||
const el = document.createElement('div');
|
||||
el.className = 'float-text';
|
||||
el.textContent = text;
|
||||
el.style.left = `${x}px`;
|
||||
el.style.top = `${y - 20}px`;
|
||||
document.body.appendChild(el);
|
||||
|
||||
setTimeout(() => el.remove(), 1000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Show notification
|
||||
*/
|
||||
showNotification(message, type = 'info') {
|
||||
const container = document.getElementById('notifications');
|
||||
const el = document.createElement('div');
|
||||
el.className = `notification ${type}`;
|
||||
el.textContent = message;
|
||||
container.appendChild(el);
|
||||
|
||||
setTimeout(() => el.remove(), 3000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Show import modal
|
||||
*/
|
||||
showImportModal() {
|
||||
document.getElementById('import-modal').classList.remove('hidden');
|
||||
},
|
||||
|
||||
/**
|
||||
* Hide import modal
|
||||
*/
|
||||
hideImportModal() {
|
||||
document.getElementById('import-modal').classList.add('hidden');
|
||||
document.getElementById('import-data').value = '';
|
||||
}
|
||||
};
|
||||
|
||||
window.UI = UI;
|
||||
+173
@@ -0,0 +1,173 @@
|
||||
/**
|
||||
* Cosmic Garden - Upgrade Definitions
|
||||
* One-time purchases that boost production
|
||||
*/
|
||||
|
||||
const UPGRADES = {
|
||||
// Click upgrades
|
||||
ironFingers: {
|
||||
id: 'ironFingers',
|
||||
name: 'Iron Fingers',
|
||||
description: 'Click power x2',
|
||||
icon: '👆',
|
||||
cost: 100,
|
||||
clickPowerBonus: 2,
|
||||
requirements: {}
|
||||
},
|
||||
|
||||
cosmicTouch: {
|
||||
id: 'cosmicTouch',
|
||||
name: 'Cosmic Touch',
|
||||
description: 'Click power x3',
|
||||
icon: '✨',
|
||||
cost: 1000,
|
||||
clickPowerBonus: 3,
|
||||
requirements: { starSprout: 10 }
|
||||
},
|
||||
|
||||
stellarHands: {
|
||||
id: 'stellarHands',
|
||||
name: 'Stellar Hands',
|
||||
description: 'Click power x5',
|
||||
icon: '🌟',
|
||||
cost: 10000,
|
||||
clickPowerBonus: 5,
|
||||
requirements: { moonBloom: 10 }
|
||||
},
|
||||
|
||||
// Building upgrades - Star Sprout
|
||||
sproutBoost1: {
|
||||
id: 'sproutBoost1',
|
||||
name: 'Sprout Nutrition',
|
||||
description: 'Star Sprouts produce x2',
|
||||
icon: '🌱',
|
||||
cost: 500,
|
||||
buildingBonus: { starSprout: 2 },
|
||||
requirements: { starSprout: 1 }
|
||||
},
|
||||
|
||||
sproutBoost2: {
|
||||
id: 'sproutBoost2',
|
||||
name: 'Star Fertilizer',
|
||||
description: 'Star Sprouts produce x3',
|
||||
icon: '⭐',
|
||||
cost: 5000,
|
||||
buildingBonus: { starSprout: 3 },
|
||||
requirements: { starSprout: 25 }
|
||||
},
|
||||
|
||||
// Building upgrades - Moon Bloom
|
||||
bloomBoost1: {
|
||||
id: 'bloomBoost1',
|
||||
name: 'Lunar Energy',
|
||||
description: 'Moon Blooms produce x2',
|
||||
icon: '🌙',
|
||||
cost: 2000,
|
||||
buildingBonus: { moonBloom: 2 },
|
||||
requirements: { moonBloom: 1 }
|
||||
},
|
||||
|
||||
bloomBoost2: {
|
||||
id: 'bloomBoost2',
|
||||
name: 'Full Moon Ritual',
|
||||
description: 'Moon Blooms produce x3',
|
||||
icon: '🌕',
|
||||
cost: 20000,
|
||||
buildingBonus: { moonBloom: 3 },
|
||||
requirements: { moonBloom: 25 }
|
||||
},
|
||||
|
||||
// Building upgrades - Solar Leaf
|
||||
leafBoost1: {
|
||||
id: 'leafBoost1',
|
||||
name: 'Photosynthesis Plus',
|
||||
description: 'Solar Leaves produce x2',
|
||||
icon: '☀️',
|
||||
cost: 10000,
|
||||
buildingBonus: { solarLeaf: 2 },
|
||||
requirements: { solarLeaf: 1 }
|
||||
},
|
||||
|
||||
leafBoost2: {
|
||||
id: 'leafBoost2',
|
||||
name: 'Solar Flare',
|
||||
description: 'Solar Leaves produce x3',
|
||||
icon: '💥',
|
||||
cost: 100000,
|
||||
buildingBonus: { solarLeaf: 3 },
|
||||
requirements: { solarLeaf: 25 }
|
||||
},
|
||||
|
||||
// Building upgrades - Nebula Vine
|
||||
vineBoost1: {
|
||||
id: 'vineBoost1',
|
||||
name: 'Cosmic Compost',
|
||||
description: 'Nebula Vines produce x2',
|
||||
icon: '🌿',
|
||||
cost: 50000,
|
||||
buildingBonus: { nebulaVine: 2 },
|
||||
requirements: { nebulaVine: 1 }
|
||||
},
|
||||
|
||||
vineBoost2: {
|
||||
id: 'vineBoost2',
|
||||
name: 'Dust Storm',
|
||||
description: 'Nebula Vines produce x3',
|
||||
icon: '🌪️',
|
||||
cost: 500000,
|
||||
buildingBonus: { nebulaVine: 3 },
|
||||
requirements: { nebulaVine: 25 }
|
||||
},
|
||||
|
||||
// Building upgrades - Comet Rose
|
||||
roseBoost1: {
|
||||
id: 'roseBoost1',
|
||||
name: 'Comet Trail',
|
||||
description: 'Comet Roses produce x2',
|
||||
icon: '🌹',
|
||||
cost: 250000,
|
||||
buildingBonus: { cometRose: 2 },
|
||||
requirements: { cometRose: 1 }
|
||||
},
|
||||
|
||||
roseBoost2: {
|
||||
id: 'roseBoost2',
|
||||
name: 'Perihelion Bloom',
|
||||
description: 'Comet Roses produce x3',
|
||||
icon: '☄️',
|
||||
cost: 2500000,
|
||||
buildingBonus: { cometRose: 3 },
|
||||
requirements: { cometRose: 25 }
|
||||
},
|
||||
|
||||
// Global upgrades
|
||||
cosmicGarden1: {
|
||||
id: 'cosmicGarden1',
|
||||
name: 'Cosmic Garden',
|
||||
description: 'All production x1.5',
|
||||
icon: '🌌',
|
||||
cost: 1000000,
|
||||
globalBonus: 1.5,
|
||||
requirements: { starSprout: 50, moonBloom: 25, solarLeaf: 10 }
|
||||
},
|
||||
|
||||
stellarNursery: {
|
||||
id: 'stellarNursery',
|
||||
name: 'Stellar Nursery',
|
||||
description: 'All production x2',
|
||||
icon: '🌟',
|
||||
cost: 10000000,
|
||||
globalBonus: 2,
|
||||
requirements: { nebulaVine: 25, cometRose: 10 }
|
||||
},
|
||||
|
||||
galacticBotanist: {
|
||||
id: 'galacticBotanist',
|
||||
name: 'Galactic Botanist',
|
||||
description: 'All production x3',
|
||||
icon: '👨🌾',
|
||||
cost: 100000000,
|
||||
globalBonus: 3,
|
||||
requirements: { pulsarPalm: 10, blackholeOrchid: 5 }
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user