Hugging Face's logo

Spaces:
DiamondVi
/
cookie-1
Running

App Files Community
DiamondVi commited on
Commit
6901e4d
·
verified ·
1 Parent(s): 4e0991a

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +1494 -19
  3. prompts.txt +2 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Cookie 1
3
- emoji: 📊
4
- colorFrom: indigo
5
- colorTo: gray
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: cookie-1
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,1494 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Ultimate Roblox Cookie Clicker Guide</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ /* Custom styles remain the same */
11
+ .gradient-bg { background: linear-gradient(135deg, #f6d365 0%, #fda085 100%); }
12
+ .cookie-btn { transition: all 0.2s ease; transform-style: preserve-3d; }
13
+ .cookie-btn:hover { transform: scale(1.05) rotate(5deg); box-shadow: 0 10px 20px rgba(0,0,0,0.2); }
14
+ .cookie-btn:active { transform: scale(0.95); }
15
+ .progress-bar { transition: width 0.5s ease; }
16
+ .skin-card { transition: all 0.3s ease; }
17
+ .skin-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0,0,0,0.1); }
18
+ .monster-hunger { animation: pulse 2s infinite; }
19
+ @keyframes pulse {
20
+ 0% { transform: scale(1); }
21
+ 50% { transform: scale(1.05); }
22
+ 100% { transform: scale(1); }
23
+ }
24
+ .tooltip {
25
+ position: relative;
26
+ }
27
+ .tooltip-text {
28
+ visibility: hidden;
29
+ width: 200px;
30
+ background-color: #555;
31
+ color: #fff;
32
+ text-align: center;
33
+ border-radius: 6px;
34
+ padding: 5px;
35
+ position: absolute;
36
+ z-index: 1;
37
+ bottom: 125%;
38
+ left: 50%;
39
+ margin-left: -100px;
40
+ opacity: 0;
41
+ transition: opacity 0.3s;
42
+ }
43
+ .tooltip:hover .tooltip-text {
44
+ visibility: visible;
45
+ opacity: 1;
46
+ }
47
+ .code-tab {
48
+ display: none;
49
+ }
50
+ .code-tab.active {
51
+ display: block;
52
+ }
53
+ </style>
54
+ </head>
55
+ <body class="gradient-bg min-h-screen font-sans">
56
+ <div class="container mx-auto px-4 py-8">
57
+ <!-- Header -->
58
+ <header class="text-center mb-12">
59
+ <h1 class="text-5xl font-bold text-white mb-4">Ultimate Roblox Cookie Clicker Guide</h1>
60
+ <p class="text-xl text-white opacity-90">Create a feature-packed cookie clicking game with achievements, skins, global leaderboards, and Cookie Monster!</p>
61
+ </header>
62
+
63
+ <!-- Navigation -->
64
+ <nav class="bg-white rounded-lg shadow-lg p-4 mb-8">
65
+ <ul class="flex flex-wrap justify-center gap-4">
66
+ <li><a href="#basic-setup" class="px-4 py-2 bg-amber-500 text-white rounded-lg hover:bg-amber-600 transition">Basic Setup</a></li>
67
+ <li><a href="#cookie-design" class="px-4 py-2 bg-amber-500 text-white rounded-lg hover:bg-amber-600 transition">Cookie Design</a></li>
68
+ <li><a href="#achievements" class="px-4 py-2 bg-amber-500 text-white rounded-lg hover:bg-amber-600 transition">Achievements</a></li>
69
+ <li><a href="#skins" class="px-4 py-2 bg-amber-500 text-white rounded-lg hover:bg-amber-600 transition">Skins</a></li>
70
+ <li><a href="#leaderboard" class="px-4 py-2 bg-amber-500 text-white rounded-lg hover:bg-amber-600 transition">Leaderboard</a></li>
71
+ <li><a href="#cookie-monster" class="px-4 py-2 bg-amber-500 text-white rounded-lg hover:bg-amber-600 transition">Cookie Monster</a></li>
72
+ </ul>
73
+ </nav>
74
+
75
+ <!-- Main Content -->
76
+ <main class="bg-white rounded-lg shadow-xl p-8">
77
+ <!-- Basic Setup Section - Enhanced -->
78
+ <section id="basic-setup" class="mb-12">
79
+ <h2 class="text-3xl font-bold text-amber-800 mb-6 border-b-2 border-amber-200 pb-2">1. Basic Game Setup</h2>
80
+
81
+ <div class="grid md:grid-cols-2 gap-8">
82
+ <!-- Part 1 - Enhanced -->
83
+ <div class="bg-amber-50 p-6 rounded-lg border-l-4 border-amber-400">
84
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Creating the Base Game</h3>
85
+ <div class="mb-6">
86
+ <h4 class="font-medium text-gray-800 mb-2">Detailed Steps:</h4>
87
+ <ol class="list-decimal pl-5 space-y-3 text-gray-700">
88
+ <li>
89
+ <strong>Create a new Roblox place:</strong>
90
+ <ul class="list-disc pl-5 mt-1 text-sm">
91
+ <li>Open Roblox Studio</li>
92
+ <li>Select "Baseplate" as your starting template</li>
93
+ <li>Save your place with a descriptive name</li>
94
+ </ul>
95
+ </li>
96
+ <li>
97
+ <strong>Set up the GUI structure:</strong>
98
+ <ul class="list-disc pl-5 mt-1 text-sm">
99
+ <li>In Explorer, go to StarterGui</li>
100
+ <li>Insert a ScreenGui (rename to "MainGUI")</li>
101
+ <li>Add a Frame inside (set Size to 1,1 scale)</li>
102
+ <li>Configure background transparency (0.5-0.8)</li>
103
+ </ul>
104
+ </li>
105
+ <li>
106
+ <strong>Cookie display setup:</strong>
107
+ <ul class="list-disc pl-5 mt-1 text-sm">
108
+ <li>Add TextLabel for cookie count</li>
109
+ <li>Set font to "Gotham Black" (size 24-36)</li>
110
+ <li>Position at top-center of screen</li>
111
+ <li>Add shadow effect with TextStroke</li>
112
+ </ul>
113
+ </li>
114
+ <li>
115
+ <strong>Cookie button creation:</strong>
116
+ <ul class="list-disc pl-5 mt-1 text-sm">
117
+ <li>Insert ImageButton (200x200 pixels)</li>
118
+ <li>Upload cookie image (PNG with transparency)</li>
119
+ <li>Add hover/click effects (scale, rotation)</li>
120
+ <li>Center on screen with AutoButtonColor=false</li>
121
+ </ul>
122
+ </li>
123
+ </ol>
124
+ </div>
125
+
126
+ <div class="p-4 bg-gray-100 rounded">
127
+ <div class="flex border-b border-gray-300 mb-3">
128
+ <button class="code-tab-btn px-4 py-2 font-medium text-amber-700 border-b-2 border-amber-500" data-tab="basic-local">LocalScript</button>
129
+ <button class="code-tab-btn px-4 py-2 font-medium text-gray-600" data-tab="basic-server">ServerScript</button>
130
+ </div>
131
+
132
+ <div id="basic-local" class="code-tab active">
133
+ <h4 class="font-medium text-gray-800 mb-2">LocalScript for Click Handling:</h4>
134
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
135
+ local Players = game:GetService("Players")
136
+ local player = Players.LocalPlayer
137
+ local cookieButton = script.Parent.CookieButton
138
+ local cookieCount = script.Parent.CookieCount
139
+
140
+ -- Initialize cookie value (will be synced with server)
141
+ local cookies = 0
142
+
143
+ -- Create a remote event for server communication
144
+ local remoteEvent = Instance.new("RemoteEvent")
145
+ remoteEvent.Name = "CookieClickEvent"
146
+ remoteEvent.Parent = game.ReplicatedStorage
147
+
148
+ -- Click handler with visual feedback
149
+ cookieButton.MouseButton1Click:Connect(function()
150
+ -- Visual feedback
151
+ cookieButton:TweenSize(UDim2.new(0.9, 0, 0.9, 0), "Out", "Quad", 0.1)
152
+ task.wait(0.1)
153
+ cookieButton:TweenSize(UDim2.new(1, 0, 1, 0), "Out", "Elastic", 0.5)
154
+
155
+ -- Play sound if available
156
+ if cookieButton:FindFirstChild("ClickSound") then
157
+ cookieButton.ClickSound:Play()
158
+ end
159
+
160
+ -- Fire to server
161
+ remoteEvent:FireServer()
162
+ end)
163
+
164
+ -- Update display when cookies change
165
+ local function updateDisplay(newCount)
166
+ cookies = newCount
167
+ cookieCount.Text = "Cookies: " .. formatNumber(cookies)
168
+ end
169
+
170
+ -- Helper function to format large numbers
171
+ local function formatNumber(num)
172
+ if num >= 1000000 then
173
+ return string.format("%.1fM", num/1000000)
174
+ elseif num >= 1000 then
175
+ return string.format("%.1fK", num/1000)
176
+ end
177
+ return tostring(num)
178
+ end
179
+
180
+ -- Listen for server updates
181
+ game.ReplicatedStorage:WaitForChild("CookieUpdate").OnClientEvent:Connect(updateDisplay)</pre>
182
+ </div>
183
+
184
+ <div id="basic-server" class="code-tab">
185
+ <h4 class="font-medium text-gray-800 mb-2">Server-Side Cookie Management:</h4>
186
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
187
+ local Players = game:GetService("Players")
188
+ local ServerStorage = game:GetService("ServerStorage")
189
+ local ReplicatedStorage = game:GetService("ReplicatedStorage")
190
+
191
+ -- Create remote events
192
+ local clickEvent = Instance.new("RemoteEvent")
193
+ clickEvent.Name = "CookieClickEvent"
194
+ clickEvent.Parent = ReplicatedStorage
195
+
196
+ local updateEvent = Instance.new("RemoteEvent")
197
+ updateEvent.Name = "CookieUpdate"
198
+ updateEvent.Parent = ReplicatedStorage
199
+
200
+ -- Player data management
201
+ local playerData = {}
202
+
203
+ local function onPlayerAdded(player)
204
+ -- Initialize player data
205
+ playerData[player] = {
206
+ cookies = 0,
207
+ clickMultiplier = 1,
208
+ autoClickers = {}
209
+ }
210
+
211
+ -- Create leaderstats
212
+ local leaderstats = Instance.new("Folder")
213
+ leaderstats.Name = "leaderstats"
214
+ leaderstats.Parent = player
215
+
216
+ local cookiesStat = Instance.new("IntValue")
217
+ cookiesStat.Name = "Cookies"
218
+ cookiesStat.Value = 0
219
+ cookiesStat.Parent = leaderstats
220
+
221
+ -- Send initial data to client
222
+ updateEvent:FireClient(player, 0)
223
+ end
224
+
225
+ -- Handle cookie clicks
226
+ clickEvent.OnServerEvent:Connect(function(player)
227
+ local data = playerData[player]
228
+ if not data then return end
229
+
230
+ -- Calculate cookies to add (with multiplier)
231
+ local cookiesToAdd = 1 * data.clickMultiplier
232
+
233
+ -- Update player data
234
+ data.cookies = data.cookies + cookiesToAdd
235
+ player.leaderstats.Cookies.Value = data.cookies
236
+
237
+ -- Update client
238
+ updateEvent:FireClient(player, data.cookies)
239
+ end)
240
+
241
+ -- Clean up when player leaves
242
+ local function onPlayerRemoving(player)
243
+ playerData[player] = nil
244
+ end
245
+
246
+ -- Connect events
247
+ Players.PlayerAdded:Connect(onPlayerAdded)
248
+ Players.PlayerRemoving:Connect(onPlayerRemoving)</pre>
249
+ </div>
250
+ </div>
251
+ </div>
252
+
253
+ <!-- Part 2 - Enhanced -->
254
+ <div class="bg-amber-50 p-6 rounded-lg border-l-4 border-amber-400">
255
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Auto-Clicker Upgrades</h3>
256
+
257
+ <div class="mb-6">
258
+ <h4 class="font-medium text-gray-800 mb-2">Upgrade System Design:</h4>
259
+ <ul class="list-disc pl-5 space-y-2 text-gray-700">
260
+ <li><strong>Upgrade Types:</strong>
261
+ <ul class="list-disc pl-5 mt-1 text-sm">
262
+ <li>Click Multipliers (2x, 5x, 10x)</li>
263
+ <li>Auto-Clickers (Grandma, Oven, Factory)</li>
264
+ <li>Temporary Boosts (30min 2x cookies)</li>
265
+ </ul>
266
+ </li>
267
+ <li><strong>Cost Scaling:</strong>
268
+ <ul class="list-disc pl-5 mt-1 text-sm">
269
+ <li>Base cost * (1.15^owned)</li>
270
+ <li>Example: First grandma costs 10, next 11.5, then 13.2, etc.</li>
271
+ </ul>
272
+ </li>
273
+ <li><strong>Visual Feedback:</strong>
274
+ <ul class="list-disc pl-5 mt-1 text-sm">
275
+ <li>Highlight affordable upgrades</li>
276
+ <li>Show purchase confirmation</li>
277
+ <li>Visual effect on purchase</li>
278
+ </ul>
279
+ </li>
280
+ </ul>
281
+ </div>
282
+
283
+ <div class="p-4 bg-gray-100 rounded">
284
+ <div class="flex border-b border-gray-300 mb-3">
285
+ <button class="code-tab-btn px-4 py-2 font-medium text-amber-700 border-b-2 border-amber-500" data-tab="upgrade-client">Client UI</button>
286
+ <button class="code-tab-btn px-4 py-2 font-medium text-gray-600" data-tab="upgrade-server">Server Logic</button>
287
+ </div>
288
+
289
+ <div id="upgrade-client" class="code-tab active">
290
+ <h4 class="font-medium text-gray-800 mb-2">Upgrade Shop UI:</h4>
291
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
292
+ -- In a LocalScript connected to your upgrade buttons
293
+ local ReplicatedStorage = game:GetService("ReplicatedStorage")
294
+ local upgradeEvent = ReplicatedStorage:WaitForChild("UpgradeEvent")
295
+ local updateEvent = ReplicatedStorage:WaitForChild("CookieUpdate")
296
+
297
+ local upgrades = {
298
+ {
299
+ name = "Grandma",
300
+ desc = "Bakes 0.2 cookies per second",
301
+ baseCost = 10,
302
+ owned = 0,
303
+ rate = 0.2,
304
+ button = script.Parent.GrandmaButton
305
+ },
306
+ -- Add more upgrades
307
+ }
308
+
309
+ -- Initialize UI
310
+ local function updateUpgradeUI()
311
+ for _, upgrade in pairs(upgrades) do
312
+ local cost = math.floor(upgrade.baseCost * (1.15 ^ upgrade.owned))
313
+ upgrade.button.Text = string.format("%s\nCost: %d\nOwned: %d",
314
+ upgrade.name, cost, upgrade.owned)
315
+
316
+ -- Grey out if unaffordable
317
+ if playerCookies < cost then
318
+ upgrade.button.BackgroundColor3 = Color3.fromRGB(200, 200, 200)
319
+ else
320
+ upgrade.button.BackgroundColor3 = Color3.fromRGB(100, 200, 100)
321
+ end
322
+ end
323
+ end
324
+
325
+ -- Handle purchases
326
+ for _, upgrade in pairs(upgrades) do
327
+ upgrade.button.MouseButton1Click:Connect(function()
328
+ local cost = math.floor(upgrade.baseCost * (1.15 ^ upgrade.owned))
329
+ if playerCookies >= cost then
330
+ upgradeEvent:FireServer(upgrade.name)
331
+ else
332
+ -- Play error sound
333
+ end
334
+ end
335
+ end
336
+
337
+ -- Update when cookies change
338
+ updateEvent.OnClientEvent:Connect(function(cookies)
339
+ playerCookies = cookies
340
+ updateUpgradeUI()
341
+ end)</pre>
342
+ </div>
343
+
344
+ <div id="upgrade-server" class="code-tab">
345
+ <h4 class="font-medium text-gray-800 mb-2">Server Upgrade Handling:</h4>
346
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
347
+ local ReplicatedStorage = game:GetService("ReplicatedStorage")
348
+ local upgradeEvent = Instance.new("RemoteEvent")
349
+ upgradeEvent.Name = "UpgradeEvent"
350
+ upgradeEvent.Parent = ReplicatedStorage
351
+
352
+ -- Define server-side upgrade data
353
+ local upgradeData = {
354
+ ["Grandma"] = {
355
+ baseCost = 10,
356
+ rate = 0.2,
357
+ type = "auto"
358
+ },
359
+ ["2x Multiplier"] = {
360
+ baseCost = 100,
361
+ multiplier = 2,
362
+ type = "click"
363
+ }
364
+ }
365
+
366
+ -- Handle upgrade purchases
367
+ upgradeEvent.OnServerEvent:Connect(function(player, upgradeName)
368
+ local data = playerData[player]
369
+ if not data or not upgradeData[upgradeName] then return end
370
+
371
+ local upgrade = upgradeData[upgradeName]
372
+ local owned = data.upgrades[upgradeName] or 0
373
+ local cost = math.floor(upgrade.baseCost * (1.15 ^ owned))
374
+
375
+ if data.cookies >= cost then
376
+ -- Deduct cookies
377
+ data.cookies = data.cookies - cost
378
+ player.leaderstats.Cookies.Value = data.cookies
379
+
380
+ -- Apply upgrade
381
+ if upgrade.type == "auto" then
382
+ table.insert(data.autoClickers, {
383
+ name = upgradeName,
384
+ rate = upgrade.rate,
385
+ nextTick = time() + 1
386
+ })
387
+ elseif upgrade.type == "click" then
388
+ data.clickMultiplier = data.clickMultiplier * upgrade.multiplier
389
+ end
390
+
391
+ -- Update client
392
+ ReplicatedStorage.CookieUpdate:FireClient(player, data.cookies)
393
+ end
394
+ end)
395
+
396
+ -- Auto-clicker processing
397
+ local function processAutoClickers()
398
+ while true do
399
+ local currentTime = time()
400
+ for player, data in pairs(playerData) do
401
+ for _, clicker in pairs(data.autoClickers) do
402
+ if currentTime >= clicker.nextTick then
403
+ data.cookies = data.cookies + clicker.rate
404
+ player.leaderstats.Cookies.Value = data.cookies
405
+ clicker.nextTick = currentTime + 1
406
+ end
407
+ end
408
+ end
409
+ wait(0.1)
410
+ end
411
+ end
412
+
413
+ -- Start the auto-clicker loop
414
+ spawn(processAutoClickers)</pre>
415
+ </div>
416
+ </div>
417
+
418
+ <div class="mt-4 p-3 bg-amber-100 rounded border-l-4 border-amber-500">
419
+ <h4 class="font-medium text-amber-800 mb-2">Pro Tip:</h4>
420
+ <p class="text-sm text-amber-700">Use a ModuleScript to store all upgrade data for easy maintenance. This allows you to balance game economics without touching the core logic.</p>
421
+ </div>
422
+ </div>
423
+ </div>
424
+ </section>
425
+
426
+ <!-- Cookie Design Section - Enhanced -->
427
+ <section id="cookie-design" class="mb-12">
428
+ <h2 class="text-3xl font-bold text-amber-800 mb-6 border-b-2 border-amber-200 pb-2">2. Creating an Appealing Cookie</h2>
429
+
430
+ <div class="grid md:grid-cols-2 gap-8">
431
+ <!-- Visual Design - Enhanced -->
432
+ <div class="bg-amber-50 p-6 rounded-lg">
433
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Advanced Visual Design</h3>
434
+
435
+ <div class="mb-6 grid grid-cols-2 gap-4">
436
+ <div class="bg-white p-4 rounded-lg shadow">
437
+ <h4 class="font-medium text-gray-800 mb-2">Particle Effects</h4>
438
+ <ul class="list-disc pl-5 text-sm space-y-1">
439
+ <li>Cookie crumbs on click</li>
440
+ <li>Golden sparkles for critical clicks</li>
441
+ <li>Steam effect for hot cookies</li>
442
+ <li>Trail effect when dragging</li>
443
+ </ul>
444
+ </div>
445
+ <div class="bg-white p-4 rounded-lg shadow">
446
+ <h4 class="font-medium text-gray-800 mb-2">Sound Design</h4>
447
+ <ul class="list-disc pl-5 text-sm space-y-1">
448
+ <li>Crunch sound on click</li>
449
+ <li>Cha-ching for purchases</li>
450
+ <li>Positive ding for achievements</li>
451
+ <li>Background bakery music</li>
452
+ </ul>
453
+ </div>
454
+ <div class="bg-white p-4 rounded-lg shadow">
455
+ <h4 class="font-medium text-gray-800 mb-2">Animation Types</h4>
456
+ <ul class="list-disc pl-5 text-sm space-y-1">
457
+ <li>Squish on click</li>
458
+ <li>Rotation when idle</li>
459
+ <li>Bounce when cookies added</li>
460
+ <li>Celebration for milestones</li>
461
+ </ul>
462
+ </div>
463
+ <div class="bg-white p-4 rounded-lg shadow">
464
+ <h4 class="font-medium text-gray-800 mb-2">Visual Feedback</h4>
465
+ <ul class="list-disc pl-5 text-sm space-y-1">
466
+ <li>Floating +1 cookies</li>
467
+ <li>Screen shake on big clicks</li>
468
+ <li>Color pulses for bonuses</li>
469
+ <li>Glow effects for active boosts</li>
470
+ </ul>
471
+ </div>
472
+ </div>
473
+
474
+ <div class="flex justify-center space-x-6">
475
+ <div class="text-center">
476
+ <div class="w-24 h-24 rounded-full bg-amber-200 border-4 border-amber-400 mx-auto mb-2 flex items-center justify-center">
477
+ <i class="fas fa-cookie-bite text-amber-700 text-3xl"></i>
478
+ </div>
479
+ <p class="text-sm font-medium">Default Cookie</p>
480
+ </div>
481
+ <div class="text-center">
482
+ <div class="w-24 h-24 rounded-full bg-blue-200 border-4 border-blue-400 mx-auto mb-2 flex items-center justify-center relative">
483
+ <i class="fas fa-cookie-bite text-blue-700 text-3xl"></i>
484
+ <div class="absolute -inset-1 rounded-full border-2 border-white animate-ping opacity-75"></div>
485
+ </div>
486
+ <p class="text-sm font-medium">Animated Cookie</p>
487
+ </div>
488
+ <div class="text-center">
489
+ <div class="w-24 h-24 rounded-full bg-purple-200 border-4 border-purple-400 mx-auto mb-2 flex items-center justify-center">
490
+ <i class="fas fa-cookie-bite text-purple-700 text-3xl"></i>
491
+ <div class="absolute inset-0 rounded-full bg-white opacity-20 animate-pulse"></div>
492
+ </div>
493
+ <p class="text-sm font-medium">Glowing Cookie</p>
494
+ </div>
495
+ </div>
496
+ </div>
497
+
498
+ <!-- Animation Code - Enhanced -->
499
+ <div class="bg-amber-50 p-6 rounded-lg">
500
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Advanced Effects Implementation</h3>
501
+
502
+ <div class="mb-6">
503
+ <h4 class="font-medium text-gray-800 mb-2">Particle System Setup:</h4>
504
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
505
+ -- Create particle emitter for cookie
506
+ local particleEmitter = Instance.new("ParticleEmitter")
507
+ particleEmitter.Name = "CookieParticles"
508
+ particleEmitter.Parent = cookieButton
509
+
510
+ -- Configure particles
511
+ particleEmitter.Texture = "rbxassetid://242842629" -- Crumb texture
512
+ particleEmitter.LightEmission = 0.5
513
+ particleEmitter.Size = NumberSequence.new({
514
+ NumberSequenceKeypoint.new(0, 0.5),
515
+ NumberSequenceKeypoint.new(1, 0)
516
+ })
517
+ particleEmitter.Transparency = NumberSequence.new({
518
+ NumberSequenceKeypoint.new(0, 0),
519
+ NumberSequenceKeypoint.new(1, 1)
520
+ })
521
+ particleEmitter.Lifetime = NumberRange.new(0.5, 1)
522
+ particleEmitter.Rate = 0 -- We'll emit manually
523
+ particleEmitter.Speed = NumberRange.new(20, 50)
524
+ particleEmitter.SpreadAngle = Vector2.new(45, 45)
525
+ particleEmitter.Rotation = NumberRange.new(0, 360)
526
+
527
+ -- Emit particles on click
528
+ cookieButton.MouseButton1Click:Connect(function()
529
+ particleEmitter:Emit(10) -- Emit 10 particles
530
+
531
+ -- Also emit golden particles for critical clicks
532
+ if math.random() < 0.1 then -- 10% chance
533
+ local goldenEmitter = cookieButton:FindFirstChild("GoldenParticles")
534
+ if goldenEmitter then
535
+ goldenEmitter:Emit(20)
536
+ end
537
+ end
538
+ end)</pre>
539
+ </div>
540
+
541
+ <div>
542
+ <h4 class="font-medium text-gray-800 mb-2">Advanced Click Animation:</h4>
543
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
544
+ local UserInputService = game:GetService("UserInputService")
545
+ local TweenService = game:GetService("TweenService")
546
+
547
+ -- Click animation with squash effect
548
+ cookieButton.MouseButton1Down:Connect(function()
549
+ -- Squash vertically, stretch horizontally
550
+ local squashTween = TweenService:Create(
551
+ cookieButton,
552
+ TweenInfo.new(0.1, Enum.EasingStyle.Quad, Enum.EasingDirection.Out),
553
+ {Size = UDim2.new(1.1, 0, 0.9, 0)}
554
+ )
555
+ squashTween:Play()
556
+ end)
557
+
558
+ -- Release animation with bounce
559
+ cookieButton.MouseButton1Up:Connect(function()
560
+ -- First return to normal size quickly
561
+ local returnTween = TweenService:Create(
562
+ cookieButton,
563
+ TweenInfo.new(0.1, Enum.EasingStyle.Quad, Enum.EasingDirection.Out),
564
+ {Size = UDim2.new(1, 0, 1, 0)}
565
+ )
566
+ returnTween:Play()
567
+
568
+ -- Then add a little bounce
569
+ task.wait(0.1)
570
+ local bounceTween = TweenService:Create(
571
+ cookieButton,
572
+ TweenInfo.new(0.3, Enum.EasingStyle.Elastic, Enum.EasingDirection.Out, 0, false, 0),
573
+ {Size = UDim2.new(1.05, 0, 1.05, 0)}
574
+ )
575
+ bounceTween:Play()
576
+ end)
577
+
578
+ -- Drag effect (cookie follows mouse slightly)
579
+ local dragConnection
580
+ cookieButton.MouseEnter:Connect(function()
581
+ dragConnection = UserInputService.InputChanged:Connect(function(input)
582
+ if input.UserInputType == Enum.UserInputType.MouseMovement then
583
+ local mousePos = game:GetService("Players").LocalPlayer:GetMouse()
584
+ local buttonPos = cookieButton.AbsolutePosition
585
+ local center = buttonPos + cookieButton.AbsoluteSize/2
586
+
587
+ -- Calculate offset from center
588
+ local offset = (mousePos - center) / 10 -- Divide to reduce movement
589
+
590
+ -- Apply offset with tween for smooth movement
591
+ TweenService:Create(
592
+ cookieButton,
593
+ TweenInfo.new(0.2, Enum.EasingStyle.Quad, Enum.EasingDirection.Out),
594
+ {Position = UDim2.new(0.5, offset.X, 0.5, offset.Y)}
595
+ ):Play()
596
+ end
597
+ end)
598
+ end)
599
+
600
+ cookieButton.MouseLeave:Connect(function()
601
+ if dragConnection then
602
+ dragConnection:Disconnect()
603
+ -- Return to center
604
+ TweenService:Create(
605
+ cookieButton,
606
+ TweenInfo.new(0.5, Enum.EasingStyle.Elastic, Enum.EasingDirection.Out),
607
+ {Position = UDim2.new(0.5, 0, 0.5, 0)}
608
+ ):Play()
609
+ end
610
+ end)</pre>
611
+ </div>
612
+ </div>
613
+ </div>
614
+ </section>
615
+
616
+ <!-- Achievements Section - Enhanced -->
617
+ <section id="achievements" class="mb-12">
618
+ <h2 class="text-3xl font-bold text-amber-800 mb-6 border-b-2 border-amber-200 pb-2">3. Advanced Achievements System</h2>
619
+
620
+ <div class="grid md:grid-cols-2 gap-8">
621
+ <!-- Achievement Design - Enhanced -->
622
+ <div class="bg-amber-50 p-6 rounded-lg">
623
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Achievement Types & Progression</h3>
624
+
625
+ <div class="mb-6">
626
+ <h4 class="font-medium text-gray-800 mb-2">Achievement Categories:</h4>
627
+ <div class="grid grid-cols-2 gap-4">
628
+ <div class="bg-white p-3 rounded shadow">
629
+ <h5 class="font-semibold text-amber-600">Milestones</h5>
630
+ <ul class="text-sm mt-1 space-y-1">
631
+ <li>Bake 100 cookies</li>
632
+ <li>Bake 1,000 cookies</li>
633
+ <li>Bake 1,000,000 cookies</li>
634
+ </ul>
635
+ </div>
636
+ <div class="bg-white p-3 rounded shadow">
637
+ <h5 class="font-semibold text-amber-600">Upgrades</h5>
638
+ <ul class="text-sm mt-1 space-y-1">
639
+ <li>Purchase first upgrade</li>
640
+ <li>Own 10 grandmas</li>
641
+ <li>Max out all upgrades</li>
642
+ </ul>
643
+ </div>
644
+ <div class="bg-white p-3 rounded shadow">
645
+ <h5 class="font-semibold text-amber-600">Special</h5>
646
+ <ul class="text-sm mt-1 space-y-1">
647
+ <li>Critical click (1% chance)</li>
648
+ <li>Feed Cookie Monster 10 times</li>
649
+ <li>Play for 24 hours total</li>
650
+ </ul>
651
+ </div>
652
+ <div class="bg-white p-3 rounded shadow">
653
+ <h5 class="font-semibold text-amber-600">Secret</h5>
654
+ <ul class="text-sm mt-1 space-y-1">
655
+ <li>Click 100 times in 10 seconds</li>
656
+ <li>Find hidden cookie</li>
657
+ <li>Bake negative cookies</li>
658
+ </ul>
659
+ </div>
660
+ </div>
661
+ </div>
662
+
663
+ <div>
664
+ <h4 class="font-medium text-gray-800 mb-2">Reward Structure:</h4>
665
+ <div class="bg-white p-4 rounded-lg shadow">
666
+ <div class="flex items-center mb-3">
667
+ <div class="w-10 h-10 rounded-full bg-yellow-100 flex items-center justify-center mr-3">
668
+ <i class="fas fa-coins text-yellow-600"></i>
669
+ </div>
670
+ <div>
671
+ <h5 class="font-semibold">Cookie Rewards</h5>
672
+ <p class="text-xs text-gray-600">Instant cookie bonuses</p>
673
+ </div>
674
+ </div>
675
+ <div class="flex items-center mb-3">
676
+ <div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center mr-3">
677
+ <i class="fas fa-tachometer-alt text-blue-600"></i>
678
+ </div>
679
+ <div>
680
+ <h5 class="font-semibold">Permanent Multipliers</h5>
681
+ <p class="text-xs text-gray-600">Increase cookie production</p>
682
+ </div>
683
+ </div>
684
+ <div class="flex items-center">
685
+ <div class="w-10 h-10 rounded-full bg-purple-100 flex items-center justify-center mr-3">
686
+ <i class="fas fa-palette text-purple-600"></i>
687
+ </div>
688
+ <div>
689
+ <h5 class="font-semibold">Exclusive Skins</h5>
690
+ <p class="text-xs text-gray-600">Unique visual customization</p>
691
+ </div>
692
+ </div>
693
+ </div>
694
+ </div>
695
+ </div>
696
+
697
+ <!-- Achievement Code - Enhanced -->
698
+ <div class="bg-amber-50 p-6 rounded-lg">
699
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Achievement System Implementation</h3>
700
+
701
+ <div class="mb-6">
702
+ <h4 class="font-medium text-gray-800 mb-2">Achievement Data Structure:</h4>
703
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
704
+ -- In a ModuleScript called "AchievementData"
705
+ local AchievementData = {}
706
+
707
+ AchievementData.list = {
708
+ {
709
+ id = "first_cookie",
710
+ name = "First Cookie",
711
+ desc = "Bake your first cookie",
712
+ goal = 1,
713
+ reward = {type = "cookies", amount = 10},
714
+ icon = "rbxassetid://123456",
715
+ category = "milestone",
716
+ hidden = false
717
+ },
718
+ {
719
+ id = "cookie_tycoon",
720
+ name = "Cookie Tycoon",
721
+ desc = "Bake 1,000,000 cookies",
722
+ goal = 1000000,
723
+ reward = {type = "skin", id = "golden_cookie"},
724
+ icon = "rbxassetid://654321",
725
+ category = "milestone",
726
+ hidden = false
727
+ },
728
+ {
729
+ id = "critical_click",
730
+ name = "Critical Click!",
731
+ desc = "Get a critical click (1% chance)",
732
+ goal = 1,
733
+ reward = {type = "multiplier", amount = 0.1},
734
+ icon = "rbxassetid://789012",
735
+ category = "special",
736
+ hidden = true
737
+ }
738
+ -- Add more achievements
739
+ }
740
+
741
+ return AchievementData</pre>
742
+ </div>
743
+
744
+ <div>
745
+ <h4 class="font-medium text-gray-800 mb-2">Achievement Tracking System:</h4>
746
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
747
+ -- Server-side achievement tracking
748
+ local AchievementData = require(script.Parent.AchievementData)
749
+ local ReplicatedStorage = game:GetService("ReplicatedStorage")
750
+ local Players = game:GetService("Players")
751
+
752
+ local achievementEvent = Instance.new("RemoteEvent")
753
+ achievementEvent.Name = "AchievementEvent"
754
+ achievementEvent.Parent = ReplicatedStorage
755
+
756
+ local playerAchievements = {}
757
+
758
+ local function onPlayerAdded(player)
759
+ -- Initialize player's achievement progress
760
+ playerAchievements[player] = {}
761
+
762
+ for _, achievement in pairs(AchievementData.list) do
763
+ playerAchievements[player][achievement.id] = {
764
+ progress = 0,
765
+ unlocked = false
766
+ }
767
+ end
768
+
769
+ -- Set up stat tracking
770
+ player:SetAttribute("TotalClicks", 0)
771
+ player:SetAttribute("CriticalClicks", 0)
772
+ end
773
+
774
+ local function checkAchievement(player, achievementId, progress)
775
+ local achievement = AchievementData.list[achievementId]
776
+ if not achievement or playerAchievements[player][achievementId].unlocked then
777
+ return
778
+ end
779
+
780
+ -- Update progress
781
+ playerAchievements[player][achievementId].progress = progress
782
+
783
+ -- Check if achievement is completed
784
+ if progress >= achievement.goal then
785
+ playerAchievements[player][achievementId].unlocked = true
786
+ giveReward(player, achievement.reward)
787
+ achievementEvent:FireClient(player, achievementId)
788
+ end
789
+ end
790
+
791
+ -- Example of tracking cookie milestones
792
+ local function onCookiesChanged(player, cookies)
793
+ for _, achievement in pairs(AchievementData.list) do
794
+ if achievement.category == "milestone" and string.find(achievement.desc, "Bake") then
795
+ checkAchievement(player, achievement.id, cookies)
796
+ end
797
+ end
798
+ end
799
+
800
+ -- Example of tracking critical clicks
801
+ local function onCriticalClick(player)
802
+ player:SetAttribute("CriticalClicks", player:GetAttribute("CriticalClicks") + 1)
803
+
804
+ for _, achievement in pairs(AchievementData.list) do
805
+ if achievement.id == "critical_click" then
806
+ checkAchievement(player, achievement.id, 1)
807
+ end
808
+ end
809
+ end
810
+
811
+ Players.PlayerAdded:Connect(onPlayerAdded)</pre>
812
+ </div>
813
+ </div>
814
+ </div>
815
+ </section>
816
+
817
+ <!-- Skins Section - Enhanced -->
818
+ <section id="skins" class="mb-12">
819
+ <h2 class="text-3xl font-bold text-amber-800 mb-6 border-b-2 border-amber-200 pb-2">4. Advanced Skin System</h2>
820
+
821
+ <div class="grid md:grid-cols-2 gap-8">
822
+ <!-- Skin Shop UI - Enhanced -->
823
+ <div class="bg-amber-50 p-6 rounded-lg">
824
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Skin Shop Architecture</h3>
825
+
826
+ <div class="mb-6">
827
+ <h4 class="font-medium text-gray-800 mb-2">Skin Types:</h4>
828
+ <div class="grid grid-cols-3 gap-3 mb-4">
829
+ <div class="bg-white p-3 rounded text-center shadow">
830
+ <div class="w-12 h-12 rounded-full bg-amber-100 mx-auto mb-2 flex items-center justify-center">
831
+ <i class="fas fa-cookie text-amber-600"></i>
832
+ </div>
833
+ <p class="text-xs font-medium">Cookie Skins</p>
834
+ </div>
835
+ <div class="bg-white p-3 rounded text-center shadow">
836
+ <div class="w-12 h-12 rounded-full bg-blue-100 mx-auto mb-2 flex items-center justify-center">
837
+ <i class="fas fa-user text-blue-600"></i>
838
+ </div>
839
+ <p class="text-xs font-medium">Character Skins</p>
840
+ </div>
841
+ <div class="bg-white p-3 rounded text-center shadow">
842
+ <div class="w-12 h-12 rounded-full bg-purple-100 mx-auto mb-2 flex items-center justify-center">
843
+ <i class="fas fa-utensils text-purple-600"></i>
844
+ </div>
845
+ <p class="text-xs font-medium">Baker Tools</p>
846
+ </div>
847
+ </div>
848
+
849
+ <h4 class="font-medium text-gray-800 mb-2">Unlock Methods:</h4>
850
+ <div class="bg-white p-4 rounded-lg shadow">
851
+ <div class="flex items-center mb-3">
852
+ <div class="w-8 h-8 rounded-full bg-green-100 flex items-center justify-center mr-3">
853
+ <i class="fas fa-coins text-green-600 text-sm"></i>
854
+ </div>
855
+ <div>
856
+ <h5 class="font-semibold">Cookie Purchase</h5>
857
+ <p class="text-xs text-gray-600">Earned through normal gameplay</p>
858
+ </div>
859
+ </div>
860
+ <div class="flex items-center mb-3">
861
+ <div class="w-8 h-8 rounded-full bg-yellow-100 flex items-center justify-center mr-3">
862
+ <i class="fas fa-trophy text-yellow-600 text-sm"></i>
863
+ </div>
864
+ <div>
865
+ <h5 class="font-semibold">Achievement Reward</h5>
866
+ <p class="text-xs text-gray-600">Complete special challenges</p>
867
+ </div>
868
+ </div>
869
+ <div class="flex items-center">
870
+ <div class="w-8 h-8 rounded-full bg-red-100 flex items-center justify-center mr-3">
871
+ <i class="fas fa-gem text-red-600 text-sm"></i>
872
+ </div>
873
+ <div>
874
+ <h5 class="font-semibold">Premium Currency</h5>
875
+ <p class="text-xs text-gray-600">Optional real-money purchases</p>
876
+ </div>
877
+ </div>
878
+ </div>
879
+ </div>
880
+
881
+ <div>
882
+ <h4 class="font-medium text-gray-800 mb-2">Skin Rarity System:</h4>
883
+ <div class="grid grid-cols-4 gap-2 text-xs text-center">
884
+ <div class="bg-gray-100 p-2 rounded">Common</div>
885
+ <div class="bg-blue-100 p-2 rounded">Uncommon</div>
886
+ <div class="bg-purple-100 p-2 rounded">Rare</div>
887
+ <div class="bg-yellow-100 p-2 rounded">Legendary</div>
888
+ </div>
889
+ </div>
890
+ </div>
891
+
892
+ <!-- Skin System Code - Enhanced -->
893
+ <div class="bg-amber-50 p-6 rounded-lg">
894
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Skin System Implementation</h3>
895
+
896
+ <div class="mb-6">
897
+ <h4 class="font-medium text-gray-800 mb-2">Skin Data Module:</h4>
898
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
899
+ -- In a ModuleScript called "SkinData"
900
+ local SkinData = {}
901
+
902
+ SkinData.cookieSkins = {
903
+ {
904
+ id = "classic",
905
+ name = "Classic Cookie",
906
+ texture = "rbxassetid://123456",
907
+ price = 0,
908
+ rarity = "common",
909
+ ownedByDefault = true
910
+ },
911
+ {
912
+ id = "golden",
913
+ name = "Golden Cookie",
914
+ texture = "rbxassetid://234567",
915
+ price = 10000,
916
+ rarity = "rare",
917
+ unlockMethod = "purchase"
918
+ },
919
+ {
920
+ id = "dragon",
921
+ name = "Dragon Cookie",
922
+ texture = "rbxassetid://345678",
923
+ unlockMethod = "achievement",
924
+ achievementId = "dragon_slayer",
925
+ rarity = "legendary"
926
+ }
927
+ }
928
+
929
+ SkinData.characterSkins = {
930
+ -- Similar structure for character skins
931
+ }
932
+
933
+ return SkinData</pre>
934
+ </div>
935
+
936
+ <div>
937
+ <h4 class="font-medium text-gray-800 mb-2">Skin Management System:</h4>
938
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
939
+ local ReplicatedStorage = game:GetService("ReplicatedStorage")
940
+ local Players = game:GetService("Players")
941
+ local SkinData = require(script.Parent.SkinData)
942
+
943
+ local skinEvent = Instance.new("RemoteEvent")
944
+ skinEvent.Name = "SkinEvent"
945
+ skinEvent.Parent = ReplicatedStorage
946
+
947
+ local playerSkins = {}
948
+
949
+ local function onPlayerAdded(player)
950
+ -- Initialize player's skin data
951
+ playerSkins[player] = {
952
+ equippedCookie = "classic",
953
+ equippedCharacter = "baker",
954
+ ownedSkins = {}
955
+ }
956
+
957
+ -- Grant default skins
958
+ for _, skin in pairs(SkinData.cookieSkins) do
959
+ if skin.ownedByDefault then
960
+ table.insert(playerSkins[player].ownedSkins, {
961
+ type = "cookie",
962
+ id = skin.id
963
+ })
964
+ end
965
+ end
966
+
967
+ -- Load saved data from DataStore
968
+ -- (Implementation similar to previous data saving examples)
969
+ end
970
+
971
+ -- Handle skin purchases
972
+ skinEvent.OnServerEvent:Connect(function(player, action, skinType, skinId)
973
+ if action == "purchase" then
974
+ local skin = SkinData[skinType.."Skins"][skinId]
975
+ if not skin or skin.unlockMethod ~= "purchase" then return end
976
+
977
+ -- Check if player can afford
978
+ if player.leaderstats.Cookies.Value >= skin.price then
979
+ player.leaderstats.Cookies.Value = player.leaderstats.Cookies.Value - skin.price
980
+ table.insert(playerSkins[player].ownedSkins, {
981
+ type = skinType,
982
+ id = skinId
983
+ })
984
+
985
+ -- Notify client of successful purchase
986
+ skinEvent:FireClient(player, "purchased", skinType, skinId)
987
+ end
988
+ elseif action == "equip" then
989
+ -- Check if player owns this skin
990
+ local ownsSkin = false
991
+ for _, ownedSkin in pairs(playerSkins[player].ownedSkins) do
992
+ if ownedSkin.type == skinType and ownedSkin.id == skinId then
993
+ ownsSkin = true
994
+ break
995
+ end
996
+ end
997
+
998
+ if ownsSkin then
999
+ playerSkins[player]["equipped"..skinType:sub(1,1):upper()..skinType:sub(2)] = skinId
1000
+ skinEvent:FireClient(player, "equipped", skinType, skinId)
1001
+ end
1002
+ end
1003
+ end)
1004
+
1005
+ -- Grant achievement skins
1006
+ local function onAchievementUnlocked(player, achievementId)
1007
+ for _, skin in pairs(SkinData.cookieSkins) do
1008
+ if skin.unlockMethod == "achievement" and skin.achievementId == achievementId then
1009
+ table.insert(playerSkins[player].ownedSkins, {
1010
+ type = "cookie",
1011
+ id = skin.id
1012
+ })
1013
+ skinEvent:FireClient(player, "unlocked", "cookie", skin.id)
1014
+ end
1015
+ end
1016
+ end
1017
+
1018
+ Players.PlayerAdded:Connect(onPlayerAdded)</pre>
1019
+ </div>
1020
+ </div>
1021
+ </div>
1022
+ </section>
1023
+
1024
+ <!-- Leaderboard Section - Enhanced -->
1025
+ <section id="leaderboard" class="mb-12">
1026
+ <h2 class="text-3xl font-bold text-amber-800 mb-6 border-b-2 border-amber-200 pb-2">5. Global Leaderboard with Countries</h2>
1027
+
1028
+ <div class="grid md:grid-cols-2 gap-8">
1029
+ <!-- Leaderboard UI - Enhanced -->
1030
+ <div class="bg-amber-50 p-6 rounded-lg">
1031
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Leaderboard Features</h3>
1032
+
1033
+ <div class="mb-6">
1034
+ <h4 class="font-medium text-gray-800 mb-2">Filtering Options:</h4>
1035
+ <div class="bg-white p-4 rounded-lg shadow mb-4">
1036
+ <div class="flex flex-wrap gap-2">
1037
+ <button class="px-3 py-1 bg-amber-500 text-white rounded-full text-xs">Global</button>
1038
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">United States</button>
1039
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">United Kingdom</button>
1040
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">Canada</button>
1041
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">Australia</button>
1042
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">Japan</button>
1043
+ </div>
1044
+ </div>
1045
+
1046
+ <h4 class="font-medium text-gray-800 mb-2">Time Frames:</h4>
1047
+ <div class="bg-white p-4 rounded-lg shadow">
1048
+ <div class="flex gap-2">
1049
+ <button class="px-3 py-1 bg-amber-500 text-white rounded-full text-xs">All-Time</button>
1050
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">Daily</button>
1051
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">Weekly</button>
1052
+ <button class="px-3 py-1 bg-white border border-amber-300 rounded-full text-xs">Monthly</button>
1053
+ </div>
1054
+ </div>
1055
+ </div>
1056
+
1057
+ <div>
1058
+ <h4 class="font-medium text-gray-800 mb-2">Player Badges:</h4>
1059
+ <div class="flex flex-wrap gap-2">
1060
+ <div class="w-8 h-8 rounded-full bg-yellow-100 flex items-center justify-center">
1061
+ <i class="fas fa-crown text-yellow-600 text-xs"></i>
1062
+ </div>
1063
+ <div class="w-8 h-8 rounded-full bg-silver-100 flex items-center justify-center">
1064
+ <i class="fas fa-medal text-gray-600 text-xs"></i>
1065
+ </div>
1066
+ <div class="w-8 h-8 rounded-full bg-amber-100 flex items-center justify-center">
1067
+ <i class="fas fa-award text-amber-600 text-xs"></i>
1068
+ </div>
1069
+ <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center">
1070
+ <i class="fas fa-flag text-blue-600 text-xs"></i>
1071
+ </div>
1072
+ </div>
1073
+ </div>
1074
+ </div>
1075
+
1076
+ <!-- Leaderboard Code - Enhanced -->
1077
+ <div class="bg-amber-50 p-6 rounded-lg">
1078
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Leaderboard Implementation</h3>
1079
+
1080
+ <div class="mb-6">
1081
+ <h4 class="font-medium text-gray-800 mb-2">Country Detection:</h4>
1082
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
1083
+ -- Server script to detect player country
1084
+ local HttpService = game:GetService("HttpService")
1085
+ local Players = game:GetService("Players")
1086
+
1087
+ local function getPlayerCountry(player)
1088
+ -- Try to get from saved data first
1089
+ local success, savedCountry = pcall(function()
1090
+ return DataStore:GetAsync("PlayerCountry_"..player.UserId)
1091
+ end)
1092
+
1093
+ if success and savedCountry then
1094
+ return savedCountry
1095
+ end
1096
+
1097
+ -- Fallback to IP detection (requires HTTP enabled)
1098
+ local ip = player:GetRemote("GetRemoteEvent").InvokeClient(player, "GetIP")
1099
+
1100
+ if ip then
1101
+ local success, geoData = pcall(function()
1102
+ return HttpService:JSONDecode(HttpService:GetAsync(
1103
+ "http://ip-api.com/json/"..ip.."?fields=countryCode"
1104
+ ))
1105
+ end)
1106
+
1107
+ if success and geoData.countryCode then
1108
+ -- Save for future sessions
1109
+ pcall(function()
1110
+ DataStore:SetAsync("PlayerCountry_"..player.UserId, geoData.countryCode)
1111
+ end)
1112
+ return geoData.countryCode
1113
+ end
1114
+ end
1115
+
1116
+ return "Unknown"
1117
+ end
1118
+
1119
+ Players.PlayerAdded:Connect(function(player)
1120
+ player:SetAttribute("Country", getPlayerCountry(player))
1121
+ end)</pre>
1122
+ </div>
1123
+
1124
+ <div>
1125
+ <h4 class="font-medium text-gray-800 mb-2">Global Data Handling:</h4>
1126
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
1127
+ -- Using DataStores for global leaderboard
1128
+ local DataStoreService = game:GetService("DataStoreService")
1129
+ local leaderboardStore = DataStoreService:GetOrderedDataStore("GlobalLeaderboard")
1130
+
1131
+ local function updateGlobalLeaderboard(player, cookies)
1132
+ -- Update all-time leaderboard
1133
+ pcall(function()
1134
+ leaderboardStore:SetAsync(tostring(player.UserId), cookies)
1135
+ end)
1136
+
1137
+ -- Update daily leaderboard (with today's date as key)
1138
+ local today = os.date("%Y-%m-%d")
1139
+ local dailyKey = "daily_"..today.."_"..player.UserId
1140
+ pcall(function()
1141
+ leaderboardStore:SetAsync(dailyKey, cookies)
1142
+ end)
1143
+ end
1144
+
1145
+ -- Function to get leaderboard data
1146
+ local function getLeaderboardData(scope, country)
1147
+ -- scope can be "alltime", "daily", "weekly", "monthly"
1148
+ -- country can be country code or "Global"
1149
+
1150
+ local data = {}
1151
+ local keyPrefix = ""
1152
+
1153
+ if scope == "daily" then
1154
+ keyPrefix = "daily_"..os.date("%Y-%m-%d").."_"
1155
+ elseif scope == "weekly" then
1156
+ -- Similar implementation for weekly
1157
+ end
1158
+
1159
+ -- Get top 100 entries
1160
+ local success, pages = pcall(function()
1161
+ if country == "Global" then
1162
+ return leaderboardStore:GetSortedAsync(false, 100, keyPrefix)
1163
+ else
1164
+ -- Filter by country would require additional data structure
1165
+ -- This is a simplified version
1166
+ return leaderboardStore:GetSortedAsync(false, 100)
1167
+ end
1168
+ end)
1169
+
1170
+ if success then
1171
+ for _, entry in ipairs(pages:GetCurrentPage()) do
1172
+ local userId = entry.key:gsub(keyPrefix, "")
1173
+ table.insert(data, {
1174
+ userId = userId,
1175
+ cookies = entry.value
1176
+ })
1177
+ end
1178
+ end
1179
+
1180
+ return data
1181
+ end
1182
+
1183
+ -- Example of player data saving
1184
+ game.Players.PlayerRemoving:Connect(function(player)
1185
+ updateGlobalLeaderboard(player, player.leaderstats.Cookies.Value)
1186
+ end)</pre>
1187
+ </div>
1188
+ </div>
1189
+ </div>
1190
+ </section>
1191
+
1192
+ <!-- Cookie Monster Section - Enhanced -->
1193
+ <section id="cookie-monster" class="mb-12">
1194
+ <h2 class="text-3xl font-bold text-amber-800 mb-6 border-b-2 border-amber-200 pb-2">6. Cookie Monster Game Mechanic</h2>
1195
+
1196
+ <div class="grid md:grid-cols-2 gap-8">
1197
+ <!-- Monster UI - Enhanced -->
1198
+ <div class="bg-amber-50 p-6 rounded-lg">
1199
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Cookie Monster Features</h3>
1200
+
1201
+ <div class="mb-6">
1202
+ <h4 class="font-medium text-gray-800 mb-2">Monster States:</h4>
1203
+ <div class="grid grid-cols-3 gap-3 text-center text-xs">
1204
+ <div class="bg-green-100 p-3 rounded">
1205
+ <div class="w-12 h-12 mx-auto mb-2 bg-green-200 rounded-full flex items-center justify-center">
1206
+ <i class="fas fa-smile text-green-600"></i>
1207
+ </div>
1208
+ <p>Happy (0-30%)</p>
1209
+ </div>
1210
+ <div class="bg-yellow-100 p-3 rounded">
1211
+ <div class="w-12 h-12 mx-auto mb-2 bg-yellow-200 rounded-full flex items-center justify-center">
1212
+ <i class="fas fa-meh text-yellow-600"></i>
1213
+ </div>
1214
+ <p>Hungry (31-70%)</p>
1215
+ </div>
1216
+ <div class="bg-red-100 p-3 rounded">
1217
+ <div class="w-12 h-12 mx-auto mb-2 bg-red-200 rounded-full flex items-center justify-center">
1218
+ <i class="fas fa-angry text-red-600"></i>
1219
+ </div>
1220
+ <p>Enraged (71-100%)</p>
1221
+ </div>
1222
+ </div>
1223
+ </div>
1224
+
1225
+ <div>
1226
+ <h4 class="font-medium text-gray-800 mb-2">Feeding Mechanics:</h4>
1227
+ <ul class="list-disc pl-5 space-y-2 text-gray-700">
1228
+ <li><strong>Basic Feed:</strong> 50 cookies - reduces hunger by 25%</li>
1229
+ <li><strong>Special Feed:</strong> 200 cookies - reduces hunger by 60%</li>
1230
+ <li><strong>Golden Feed:</strong> 1000 cookies - resets hunger to 0%</li>
1231
+ <li><strong>Auto-Feeder:</strong> Upgrade that automatically feeds when hunger reaches 50%</li>
1232
+ </ul>
1233
+ </div>
1234
+ </div>
1235
+
1236
+ <!-- Monster Code - Enhanced -->
1237
+ <div class="bg-amber-50 p-6 rounded-lg">
1238
+ <h3 class="text-xl font-semibold text-amber-700 mb-4">Cookie Monster Implementation</h3>
1239
+
1240
+ <div class="mb-6">
1241
+ <h4 class="font-medium text-gray-800 mb-2">Monster State Management:</h4>
1242
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
1243
+ -- Server-side monster manager
1244
+ local monster = {
1245
+ hunger = 0, -- 0-100
1246
+ lastFed = os.time(),
1247
+ hungerRate = 0.1, -- % per minute
1248
+ state = "happy",
1249
+ rampageThreshold = 90,
1250
+ isRampaging = false,
1251
+ rampageEndTime = 0
1252
+ }
1253
+
1254
+ -- Update hunger over time
1255
+ local function updateHunger()
1256
+ while true do
1257
+ local timePassed = os.time() - monster.lastFed
1258
+ monster.hunger = math.min(100, monster.hunger + (monster.hungerRate * (timePassed/60)))
1259
+
1260
+ -- Update state
1261
+ if monster.hunger <= 30 then
1262
+ monster.state = "happy"
1263
+ elseif monster.hunger <= 70 then
1264
+ monster.state = "hungry"
1265
+ else
1266
+ monster.state = "angry"
1267
+ end
1268
+
1269
+ -- Check for rampage
1270
+ if monster.hunger >= monster.rampageThreshold and not monster.isRampaging then
1271
+ startRampage()
1272
+ end
1273
+
1274
+ -- Increase hunger rate over time (gets harder)
1275
+ monster.hungerRate = monster.hungerRate * 1.0001
1276
+
1277
+ -- Broadcast update to all players
1278
+ for _, player in ipairs(game.Players:GetPlayers()) do
1279
+ ReplicatedStorage.MonsterUpdate:FireClient(player, {
1280
+ hunger = monster.hunger,
1281
+ state = monster.state,
1282
+ isRampaging = monster.isRampaging,
1283
+ timeLeft = monster.rampageEndTime - os.time()
1284
+ })
1285
+ end
1286
+
1287
+ wait(60) -- Update every minute
1288
+ end
1289
+ end
1290
+
1291
+ -- Start the hunger update loop
1292
+ spawn(updateHunger)</pre>
1293
+ </div>
1294
+
1295
+ <div>
1296
+ <h4 class="font-medium text-gray-800 mb-2">Rampage System:</h4>
1297
+ <pre class="bg-gray-800 text-green-300 p-3 rounded text-sm overflow-x-auto">
1298
+ local function startRampage()
1299
+ monster.isRampaging = true
1300
+ monster.rampageEndTime = os.time() + 300 -- 5 minutes to stop
1301
+
1302
+ -- Alert all players
1303
+ for _, player in ipairs(game.Players:GetPlayers()) do
1304
+ ReplicatedStorage.RampageAlert:FireClient(player, true)
1305
+ end
1306
+
1307
+ -- Start countdown
1308
+ local countdown = 300 -- 5 minutes
1309
+ while countdown > 0 and monster.isRampaging do
1310
+ countdown = countdown - 1
1311
+
1312
+ -- Update players every second
1313
+ for _, player in ipairs(game.Players:GetPlayers()) do
1314
+ ReplicatedStorage.MonsterUpdate:FireClient(player, {
1315
+ hunger = monster.hunger,
1316
+ state = monster.state,
1317
+ isRampaging = monster.isRampaging,
1318
+ timeLeft = countdown
1319
+ })
1320
+ end
1321
+
1322
+ -- Check if hunger was reduced below threshold
1323
+ if monster.hunger < monster.rampageThreshold then
1324
+ monster.isRampaging = false
1325
+ break
1326
+ end
1327
+
1328
+ wait(1)
1329
+ end
1330
+
1331
+ if monster.isRampaging then
1332
+ -- Monster eats all cookies
1333
+ for _, player in ipairs(game.Players:GetPlayers()) do
1334
+ player.leaderstats.Cookies.Value = 0
1335
+ ReplicatedStorage.CookieUpdate:FireClient(player, 0)
1336
+ end
1337
+
1338
+ -- Play animation/sound
1339
+ for _, player in ipairs(game.Players:GetPlayers()) do
1340
+ ReplicatedStorage.RampageEffect:FireClient(player)
1341
+ end
1342
+ end
1343
+
1344
+ -- Reset monster
1345
+ monster.isRampaging = false
1346
+ monster.hunger = 0
1347
+ monster.lastFed = os.time()
1348
+
1349
+ -- Alert players rampage is over
1350
+ for _, player in ipairs(game.Players:GetPlayers()) do
1351
+ ReplicatedStorage.RampageAlert:FireClient(player, false)
1352
+ end
1353
+ end
1354
+
1355
+ -- Handle feeding
1356
+ ReplicatedStorage.FeedMonster.OnServerEvent:Connect(function(player, feedType)
1357
+ local cost = 0
1358
+ local reduction = 0
1359
+
1360
+ if feedType == "basic" then
1361
+ cost = 50
1362
+ reduction = 25
1363
+ elseif feedType == "special" then
1364
+ cost = 200
1365
+ reduction = 60
1366
+ elseif feedType == "golden" then
1367
+ cost = 1000
1368
+ reduction = 100
1369
+ end
1370
+
1371
+ if player.leaderstats.Cookies.Value >= cost then
1372
+ player.leaderstats.Cookies.Value = player.leaderstats.Cookies.Value - cost
1373
+ monster.hunger = math.max(0, monster.hunger - reduction)
1374
+ monster.lastFed = os.time()
1375
+
1376
+ -- Check if rampage was stopped
1377
+ if monster.isRampaging and monster.hunger < monster.rampageThreshold then
1378
+ monster.isRampaging = false
1379
+ end
1380
+ end
1381
+ end)</pre>
1382
+ </div>
1383
+ </div>
1384
+ </div>
1385
+ </section>
1386
+
1387
+ <!-- Final Notes - Enhanced -->
1388
+ <section class="bg-amber-100 rounded-lg p-6 border-l-4 border-amber-500">
1389
+ <h2 class="text-2xl font-bold text-amber-800 mb-4">Complete Implementation Roadmap</h2>
1390
+
1391
+ <div class="grid md:grid-cols-3 gap-6">
1392
+ <div class="bg-white p-4 rounded-lg shadow">
1393
+ <h3 class="font-semibold text-amber-700 mb-3">Phase 1: Core Gameplay</h3>
1394
+ <ul class="list-disc pl-5 space-y-2 text-sm">
1395
+ <li>Basic clicking mechanic</li>
1396
+ <li>Auto-clicker upgrades</li>
1397
+ <li>Simple cookie design</li>
1398
+ <li>Local leaderboard</li>
1399
+ </ul>
1400
+ </div>
1401
+ <div class="bg-white p-4 rounded-lg shadow">
1402
+ <h3 class="font-semibold text-amber-700 mb-3">Phase 2: Progression</h3>
1403
+ <ul class="list-disc pl-5 space-y-2 text-sm">
1404
+ <li>Achievements system</li>
1405
+ <li>Skin customization</li>
1406
+ <li>Global leaderboard</li>
1407
+ <li>Country selection</li>
1408
+ </ul>
1409
+ </div>
1410
+ <div class="bg-white p-4 rounded-lg shadow">
1411
+ <h3 class="font-semibold text-amber-700 mb-3">Phase 3: Advanced Features</h3>
1412
+ <ul class="list-disc pl-5 space-y-2 text-sm">
1413
+ <li>Cookie Monster mechanic</li>
1414
+ <li>Special events</li>
1415
+ <li>Social features</li>
1416
+ <li>Premium currency</li>
1417
+ </ul>
1418
+ </div>
1419
+ </div>
1420
+
1421
+ <div class="mt-6 bg-white p-4 rounded-lg shadow">
1422
+ <h3 class="font-semibold text-amber-700 mb-3">Optimization Checklist</h3>
1423
+ <div class="grid grid-cols-2 gap-4">
1424
+ <div>
1425
+ <h4 class="font-medium text-gray-800 mb-2">Performance:</h4>
1426
+ <ul class="list-disc pl-5 space-y-1 text-sm">
1427
+ <li>Use ValueObjects for frequently updated values</li>
1428
+ <li>Limit particle effects</li>
1429
+ <li>Optimize DataStore calls</li>
1430
+ </ul>
1431
+ </div>
1432
+ <div>
1433
+ <h4 class="font-medium text-gray-800 mb-2">Security:</h4>
1434
+ <ul class="list-disc pl-5 space-y-1 text-sm">
1435
+ <li>Server-side validation</li>
1436
+ <li>Anti-exploit checks</li>
1437
+ <li>DataStore backup system</li>
1438
+ </ul>
1439
+ </div>
1440
+ </div>
1441
+ </div>
1442
+
1443
+ <div class="mt-6 text-center">
1444
+ <button class="cookie-btn px-6 py-3 bg-amber-500 text-white rounded-full text-lg font-bold shadow-lg hover:bg-amber-600">
1445
+ <i class="fas fa-rocket mr-2"></i> Launch Your Cookie Empire!
1446
+ </button>
1447
+ </div>
1448
+ </section>
1449
+ </main>
1450
+
1451
+ <!-- Footer -->
1452
+ <footer class="mt-12 text-center text-white opacity-80 text-sm">
1453
+ <p>© 2023 Ultimate Roblox Cookie Clicker Guide. All rights reserved.</p>
1454
+ <p class="mt-2">Created with <i class="fas fa-heart text-red-400"></i> for Roblox developers</p>
1455
+ </footer>
1456
+ </div>
1457
+
1458
+ <script>
1459
+ // Tab functionality
1460
+ document.querySelectorAll('.code-tab-btn').forEach(btn => {
1461
+ btn.addEventListener('click', function() {
1462
+ const tabId = this.getAttribute('data-tab');
1463
+ const container = this.closest('.bg-gray-100');
1464
+
1465
+ // Deactivate all tabs in this container
1466
+ container.querySelectorAll('.code-tab-btn').forEach(t => {
1467
+ t.classList.remove('border-b-2', 'border-amber-500', 'text-amber-700');
1468
+ t.classList.add('text-gray-600');
1469
+ });
1470
+
1471
+ // Hide all content in this container
1472
+ container.querySelectorAll('.code-tab').forEach(t => {
1473
+ t.classList.remove('active');
1474
+ });
1475
+
1476
+ // Activate this tab
1477
+ this.classList.add('border-b-2', 'border-amber-500', 'text-amber-700');
1478
+ this.classList.remove('text-gray-600');
1479
+ document.getElementById(tabId).classList.add('active');
1480
+ });
1481
+ });
1482
+
1483
+ // Cookie button animation
1484
+ document.querySelectorAll('.cookie-btn').forEach(btn => {
1485
+ btn.addEventListener('click', function() {
1486
+ this.classList.add('animate-bounce');
1487
+ setTimeout(() => {
1488
+ this.classList.remove('animate-bounce');
1489
+ }, 1000);
1490
+ });
1491
+ });
1492
+ </script>
1493
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=DiamondVi/cookie-1" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1494
+ </html>
prompts.txt ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ Create Very Detailed A Step By Step Guide to Creating a Roblox Cookie Clicking game with : Cookie Clicking , Achievements and rewards , Rewards Cookie Skins , Character skins , Add A Skin - Cookie Skin Shop , Add A Global Scoreboard also players to select the country they want to make cookies for , Give the Cookie an Appealing Look , add cookie Monster that has to be fed with Cookies every once and a while with it's hunger increasing over time , if the players don't feed it enough cookies , Everyone Loses their cookies
2
+ give me more details on each step