Hugging Face's logo

Spaces:
Simsi1837
/
undefined
Running

App Files Community
Simsi1837 commited on
Commit
f799ef5
·
verified ·
1 Parent(s): 1299e70

there should be a feautere i cant do anything with my cooked batchs

Browse files
Files changed (2) hide show
  1. README.md +9 -5
  2. index.html +309 -18
README.md CHANGED
@@ -1,10 +1,14 @@
1
  ---
2
- title: Undefined
3
- emoji: 📈
4
- colorFrom: green
5
- colorTo: blue
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: undefined
3
+ colorFrom: pink
4
+ colorTo: green
5
+ emoji: 🐳
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite-v3
10
  ---
11
 
12
+ # Welcome to your new DeepSite project!
13
+ This project was created with [DeepSite](https://deepsite.hf.co).
14
+
index.html CHANGED
@@ -1,19 +1,310 @@
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>Blue Sky Empire: Meth Tycoon</title>
7
+ <link rel="icon" type="image/x-icon" href="https://static.photos/blue/200x200/42">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <script src="https://unpkg.com/feather-icons"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.net.min.js"></script>
12
+ <script src="https://cdn.jsdelivr.net/npm/animejs@3.2.1/lib/anime.min.js"></script>
13
+ <style>
14
+ .crystal-animation {
15
+ animation: float 3s ease-in-out infinite;
16
+ }
17
+ @keyframes float {
18
+ 0%, 100% { transform: translateY(0); }
19
+ 50% { transform: translateY(-20px); }
20
+ }
21
+ .progress-bar {
22
+ transition: width 0.5s ease;
23
+ }
24
+ </style>
25
+ </head>
26
+ <body class="bg-gray-900 text-blue-100">
27
+ <div id="vanta-bg" class="fixed inset-0 z-0"></div>
28
+ <div class="relative z-10 min-h-screen">
29
+ <!-- Header -->
30
+ <header class="bg-blue-900/80 backdrop-blur-md border-b border-blue-700">
31
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
32
+ <div class="flex items-center space-x-2">
33
+ <i data-feather="alert-triangle" class="text-blue-300"></i>
34
+ <h1 class="text-xl font-bold text-blue-100">Blue Sky Empire</h1>
35
+ </div>
36
+ <div class="flex items-center space-x-4">
37
+ <div class="hidden md:flex items-center space-x-2 bg-blue-800/50 px-3 py-1 rounded-full">
38
+ <i data-feather="dollar-sign" class="text-blue-200"></i>
39
+ <span id="money-counter" class="font-mono">$0</span>
40
+ </div>
41
+ <div class="hidden md:flex items-center space-x-2 bg-blue-800/50 px-3 py-1 rounded-full">
42
+ <i data-feather="activity" class="text-blue-200"></i>
43
+ <span id="heat-meter" class="font-mono">0%</span>
44
+ </div>
45
+ <button id="menu-toggle" class="md:hidden">
46
+ <i data-feather="menu"></i>
47
+ </button>
48
+ </div>
49
+ </div>
50
+ </header>
51
+
52
+ <!-- Main Content -->
53
+ <main class="container mx-auto px-4 py-6">
54
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
55
+ <!-- Left Column - Production -->
56
+ <div class="lg:col-span-2 space-y-6">
57
+ <!-- Lab Section -->
58
+ <div class="bg-blue-900/70 backdrop-blur-sm rounded-lg border border-blue-700 p-4">
59
+ <div class="flex justify-between items-center mb-4">
60
+ <h2 class="text-lg font-bold text-blue-100">Chemical Lab</h2>
61
+ <div class="text-xs bg-blue-800/50 px-2 py-1 rounded-full">
62
+ <span id="production-rate">0</span> units/min
63
+ </div>
64
+ </div>
65
+
66
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
67
+ <!-- Equipment Cards -->
68
+ <div class="bg-blue-800/50 rounded-lg p-3 border border-blue-700/50 hover:border-blue-500 transition cursor-pointer">
69
+ <div class="flex justify-center mb-2">
70
+ <i data-feather="flask" class="text-blue-300"></i>
71
+ </div>
72
+ <h3 class="text-sm font-semibold text-center">Basic Flask</h3>
73
+ <p class="text-xs text-blue-200 text-center">+0.1 units/min</p>
74
+ <button class="w-full mt-2 bg-blue-700 hover:bg-blue-600 text-xs py-1 rounded">
75
+ $100
76
+ </button>
77
+ </div>
78
+
79
+ <div class="bg-blue-800/50 rounded-lg p-3 border border-blue-700/50 opacity-50 cursor-not-allowed">
80
+ <div class="flex justify-center mb-2">
81
+ <i data-feather="wind" class="text-blue-300"></i>
82
+ </div>
83
+ <h3 class="text-sm font-semibold text-center">Ventilation</h3>
84
+ <p class="text-xs text-blue-200 text-center">Unlocks at $500</p>
85
+ </div>
86
+
87
+ <!-- More equipment cards... -->
88
+ </div>
89
+ </div>
90
+ <!-- Sales Section -->
91
+ <div class="bg-blue-900/70 backdrop-blur-sm rounded-lg border border-blue-700 p-4">
92
+ <h2 class="text-lg font-bold text-blue-100 mb-4">Distribution Network</h2>
93
+ <div class="space-y-3">
94
+ <div class="flex items-center justify-between bg-blue-800/40 p-3 rounded-lg">
95
+ <div class="flex items-center space-x-3">
96
+ <div class="w-10 h-10 rounded-full bg-blue-700 flex items-center justify-center">
97
+ <i data-feather="truck" class="text-blue-300"></i>
98
+ </div>
99
+ <div>
100
+ <h3 class="font-medium">Street Sales</h3>
101
+ <p class="text-xs text-blue-300">Sell 1 unit for $50</p>
102
+ </div>
103
+ </div>
104
+ <button
105
+ id="sell-button"
106
+ class="bg-blue-700 hover:bg-blue-600 px-3 py-1 text-sm rounded-full disabled:opacity-50 disabled:cursor-not-allowed"
107
+ :disabled="gameState.product < 1"
108
+ >
109
+ Sell
110
+ </button>
111
+ </div>
112
+ </div>
113
+ </div>
114
+
115
+ <!-- Crew Section -->
116
+ <div class="bg-blue-900/70 backdrop-blur-sm rounded-lg border border-blue-700 p-4">
117
+ <h2 class="text-lg font-bold text-blue-100 mb-4">Crew Management</h2>
118
+ <div class="space-y-3">
119
+ <!-- Crew Member -->
120
+ <div class="flex items-center justify-between bg-blue-800/40 p-3 rounded-lg">
121
+ <div class="flex items-center space-x-3">
122
+ <div class="w-10 h-10 rounded-full bg-blue-700 flex items-center justify-center">
123
+ <i data-feather="user" class="text-blue-300"></i>
124
+ </div>
125
+ <div>
126
+ <h3 class="font-medium">Street Dealer</h3>
127
+ <p class="text-xs text-blue-300">+5% sales speed</p>
128
+ </div>
129
+ </div>
130
+ <button class="bg-blue-700 hover:bg-blue-600 px-3 py-1 text-sm rounded-full">
131
+ $250
132
+ </button>
133
+ </div>
134
+
135
+ <!-- More crew members... -->
136
+ </div>
137
+ </div>
138
+ </div>
139
+
140
+ <!-- Right Column - Stats & Actions -->
141
+ <div class="space-y-6">
142
+ <!-- Crystal Display -->
143
+ <div class="bg-blue-900/70 backdrop-blur-sm rounded-lg border border-blue-700 p-4 flex flex-col items-center">
144
+ <div class="crystal-animation mb-4">
145
+ <img src="https://static.photos/blue/200x200/7" alt="Blue Crystal" class="w-24 h-24 object-contain">
146
+ </div>
147
+ <h2 class="text-xl font-bold text-blue-100 mb-2" id="product-count">0 Units</h2>
148
+ <div class="w-full bg-blue-800/50 h-2 rounded-full mb-3">
149
+ <div id="production-progress" class="h-full bg-blue-400 rounded-full progress-bar" style="width: 0%"></div>
150
+ </div>
151
+ <button id="manual-produce" class="bg-blue-600 hover:bg-blue-500 px-6 py-2 rounded-full font-medium flex items-center">
152
+ <i data-feather="zap" class="mr-2"></i> Cook Batch
153
+ </button>
154
+ </div>
155
+
156
+ <!-- Heat Meter -->
157
+ <div class="bg-blue-900/70 backdrop-blur-sm rounded-lg border border-blue-700 p-4">
158
+ <div class="flex justify-between items-center mb-2">
159
+ <h2 class="font-bold text-blue-100">DEA Heat</h2>
160
+ <span class="text-xs bg-blue-800/50 px-2 py-1 rounded-full">Low Risk</span>
161
+ </div>
162
+ <div class="w-full bg-blue-800/30 h-4 rounded-full mb-2">
163
+ <div id="heat-progress" class="h-full bg-red-500 rounded-full progress-bar" style="width: 5%"></div>
164
+ </div>
165
+ <p class="text-xs text-blue-300">Produce carefully to avoid detection!</p>
166
+ </div>
167
+
168
+ <!-- Random Events -->
169
+ <div class="bg-blue-900/70 backdrop-blur-sm rounded-lg border border-blue-700 p-4">
170
+ <h2 class="font-bold text-blue-100 mb-2">Events</h2>
171
+ <div class="text-sm text-blue-200 italic">
172
+ "Your operation is running smoothly... for now."
173
+ </div>
174
+ </div>
175
+ </div>
176
+ </div>
177
+ </main>
178
+ </div>
179
+
180
+ <!-- Mobile Bottom Bar -->
181
+ <div class="fixed bottom-0 left-0 right-0 bg-blue-900/80 backdrop-blur-md border-t border-blue-700 md:hidden">
182
+ <div class="container mx-auto px-4 py-2 flex justify-between items-center">
183
+ <div class="flex items-center space-x-2">
184
+ <i data-feather="dollar-sign" class="text-blue-200"></i>
185
+ <span id="mobile-money" class="font-mono text-sm">$0</span>
186
+ </div>
187
+ <div class="flex items-center space-x-2">
188
+ <i data-feather="activity" class="text-blue-200"></i>
189
+ <span id="mobile-heat" class="font-mono text-sm">0%</span>
190
+ </div>
191
+ <div class="flex items-center space-x-2">
192
+ <i data-feather="package" class="text-blue-200"></i>
193
+ <span id="mobile-product" class="font-mono text-sm">0</span>
194
+ </div>
195
+ </div>
196
+ </div>
197
+
198
+ <script>
199
+ // Vanta.js background
200
+ VANTA.NET({
201
+ el: "#vanta-bg",
202
+ mouseControls: true,
203
+ touchControls: true,
204
+ gyroControls: false,
205
+ minHeight: 200.00,
206
+ minWidth: 200.00,
207
+ scale: 1.00,
208
+ scaleMobile: 1.00,
209
+ color: 0x3b82f6,
210
+ backgroundColor: 0x111827,
211
+ points: 10.00,
212
+ maxDistance: 22.00,
213
+ spacing: 17.00
214
+ });
215
+ // Game state
216
+ let gameState = {
217
+ money: 0,
218
+ product: 0,
219
+ heat: 0,
220
+ productionRate: 0,
221
+ autoProduction: 0
222
+ };
223
+ // DOM elements
224
+ const moneyCounter = document.getElementById('money-counter');
225
+ const mobileMoney = document.getElementById('mobile-money');
226
+ const heatMeter = document.getElementById('heat-meter');
227
+ const mobileHeat = document.getElementById('mobile-heat');
228
+ const productCount = document.getElementById('product-count');
229
+ const mobileProduct = document.getElementById('mobile-product');
230
+ const productionRate = document.getElementById('production-rate');
231
+ const productionProgress = document.getElementById('production-progress');
232
+ const heatProgress = document.getElementById('heat-progress');
233
+ const manualProduce = document.getElementById('manual-produce');
234
+
235
+ // Game loop
236
+ function updateUI() {
237
+ moneyCounter.textContent = '$' + Math.floor(gameState.money).toLocaleString();
238
+ mobileMoney.textContent = '$' + Math.floor(gameState.money).toLocaleString();
239
+ heatMeter.textContent = Math.floor(gameState.heat) + '%';
240
+ mobileHeat.textContent = Math.floor(gameState.heat) + '%';
241
+ productCount.textContent = Math.floor(gameState.product) + ' Units';
242
+ mobileProduct.textContent = Math.floor(gameState.product);
243
+ productionRate.textContent = gameState.productionRate.toFixed(1);
244
+ productionProgress.style.width = (gameState.product % 1) * 100 + '%';
245
+ heatProgress.style.width = gameState.heat + '%';
246
+ }
247
+
248
+ // Manual production
249
+ manualProduce.addEventListener('click', () => {
250
+ gameState.product += 0.2;
251
+ gameState.heat += 0.5;
252
+ if (gameState.heat > 100) gameState.heat = 100;
253
+ updateUI();
254
+
255
+ // Animation
256
+ anime({
257
+ targets: manualProduce,
258
+ scale: [1, 1.1, 1],
259
+ duration: 300,
260
+ easing: 'easeInOutQuad'
261
+ });
262
+ });
263
+
264
+ // Auto production
265
+ setInterval(() => {
266
+ if (gameState.productionRate > 0) {
267
+ gameState.product += gameState.productionRate / 60;
268
+ gameState.heat += gameState.productionRate / 600;
269
+ if (gameState.heat > 100) gameState.heat = 100;
270
+ updateUI();
271
+ }
272
+ }, 1000 / 60); // 60fps
273
+ // Sell functionality
274
+ document.getElementById('sell-button').addEventListener('click', () => {
275
+ if (gameState.product >= 1) {
276
+ gameState.product -= 1;
277
+ gameState.money += 50;
278
+ gameState.heat += 2;
279
+ if (gameState.heat > 100) gameState.heat = 100;
280
+
281
+ // Animation
282
+ anime({
283
+ targets: '#sell-button',
284
+ scale: [1, 1.1, 1],
285
+ duration: 300,
286
+ easing: 'easeInOutQuad'
287
+ });
288
+
289
+ // Money pop effect
290
+ const moneyPop = document.createElement('div');
291
+ moneyPop.textContent = '+$50';
292
+ moneyPop.className = 'absolute text-green-400 font-bold animate-ping';
293
+ document.getElementById('sell-button').appendChild(moneyPop);
294
+ setTimeout(() => moneyPop.remove(), 1000);
295
+
296
+ updateUI();
297
+ }
298
+ });
299
+
300
+ // Initialize
301
+ feather.replace();
302
+ updateUI();
303
+
304
+ // Update sell button state
305
+ setInterval(() => {
306
+ document.getElementById('sell-button').disabled = gameState.product < 1;
307
+ }, 100);
308
+ </script>
309
+ </body>
310
  </html>