docto41 commited on
Commit
cf84e1e
·
verified ·
1 Parent(s): 40f2f11

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +151 -150
  2. prompts.txt +2 -1
index.html CHANGED
@@ -48,6 +48,16 @@
48
  0% { box-shadow: 0 0 0 0 rgba(0, 228, 255, 0.7); }
49
  100% { box-shadow: 0 0 0 15px rgba(0, 228, 255, 0); }
50
  }
 
 
 
 
 
 
 
 
 
 
51
  </style>
52
  </head>
53
  <body class="bg-black text-gray-100 min-h-screen overflow-x-hidden">
@@ -149,8 +159,8 @@
149
  <div class="flex justify-between items-center mb-6">
150
  <h2 class="text-2xl font-bold neon-text">QUANTUM SITE BUILDER 9000</h2>
151
  <div class="flex space-x-3">
152
- <button class="quantum-field py-2 px-4 rounded-lg flex items-center">
153
- <i class="fas fa-rocket mr-2"></i> LAUNCH
154
  </button>
155
  <button class="bg-purple-900 hover:bg-purple-800 py-2 px-4 rounded-lg flex items-center transition">
156
  <i class="fas fa-cog mr-2"></i> SETTINGS
@@ -163,57 +173,39 @@
163
  <!-- Input Panel -->
164
  <div class="lg:col-span-1 holographic rounded-lg p-4">
165
  <h3 class="font-semibold mb-4 flex items-center">
166
- <i class="fas fa-keyboard mr-2"></i> INPUT MATRIX
167
  </h3>
168
 
169
  <div class="space-y-4">
170
  <div>
171
- <label class="text-xs block mb-1">SITE TYPE</label>
172
- <select class="quantum-field w-full p-2 rounded-lg text-sm">
173
- <option>Quantum E-Commerce</option>
174
- <option>AI Portal</option>
175
- <option>Neural Network</option>
176
- <option>Metaverse Gateway</option>
177
- <option>Blockchain Interface</option>
178
- </select>
179
  </div>
180
 
181
  <div>
182
- <label class="text-xs block mb-1">DESIGN STYLE</label>
183
  <select class="quantum-field w-full p-2 rounded-lg text-sm">
184
- <option>Cyberpunk 2077</option>
185
- <option>Neon Futurism</option>
186
- <option>Quantum Minimal</option>
187
- <option>Holographic UI</option>
188
- <option>Dark Matrix</option>
189
  </select>
190
  </div>
191
 
192
  <div>
193
- <label class="text-xs block mb-1">TECH STACK</label>
194
  <select class="quantum-field w-full p-2 rounded-lg text-sm">
195
- <option>Quantum JS + AI CSS</option>
196
- <option>Neural HTML 6.0</option>
197
- <option>Blockchain UI Kit</option>
198
- <option>Metaverse Framework</option>
199
  </select>
200
  </div>
201
 
202
- <div>
203
- <label class="text-xs block mb-1">CONTENT SOURCE</label>
204
- <div class="flex space-x-2">
205
- <button class="quantum-field flex-1 py-2 text-xs rounded-lg">
206
- <i class="fas fa-brain mr-1"></i> AI GENERATE
207
- </button>
208
- <button class="quantum-field flex-1 py-2 text-xs rounded-lg">
209
- <i class="fas fa-upload mr-1"></i> UPLOAD
210
- </button>
211
- </div>
212
- </div>
213
-
214
  <div class="pt-4">
215
- <button class="w-full quantum-field py-3 rounded-lg font-semibold flex items-center justify-center">
216
- <i class="fas fa-atom mr-2"></i> QUANTUM GENERATE
217
  </button>
218
  </div>
219
  </div>
@@ -240,22 +232,24 @@
240
  </div>
241
 
242
  <!-- Quantum Preview Display -->
243
- <div class="bg-black border border-gray-800 rounded-lg h-96 flex items-center justify-center relative overflow-hidden">
244
  <!-- Quantum Orb Animation -->
245
  <div class="quantum-orb absolute w-24 h-24 rounded-full bg-gradient-to-r from-blue-500 to-teal-500 opacity-20"></div>
246
 
247
- <div class="text-center z-10 p-6">
248
  <div class="w-16 h-16 bg-blue-900 rounded-full flex items-center justify-center mx-auto mb-4">
249
  <i class="fas fa-atom text-2xl text-blue-400"></i>
250
  </div>
251
  <h3 class="text-xl font-bold mb-2">QUANTUM BUILDER</h3>
252
  <p class="text-gray-400 text-sm max-w-md mx-auto">
253
- Awaiting quantum instructions from 360,000 AI units. Prepare for hyper-speed site generation at 100,000x DeepSite capacity.
254
  </p>
255
- <div class="mt-6 flex justify-center">
256
  <div class="quantum-loader w-8 h-8 rounded-full"></div>
257
  </div>
258
  </div>
 
 
259
  </div>
260
 
261
  <div class="mt-4 grid grid-cols-4 gap-2">
@@ -279,13 +273,13 @@
279
  </div>
280
  </div>
281
 
282
- <!-- AI Tool Matrix -->
283
  <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 mb-8">
284
  <div class="flex justify-between items-center mb-6">
285
- <h2 class="text-2xl font-bold neon-text">20,000x TOOL MATRIX</h2>
286
  <div class="flex items-center space-x-3">
287
  <div class="relative">
288
- <input type="text" placeholder="Search 20K tools..." class="quantum-field px-4 py-2 pr-8 rounded-lg text-sm w-64">
289
  <i class="fas fa-search absolute right-3 top-2.5 text-gray-400"></i>
290
  </div>
291
  <button class="quantum-field py-2 px-3 rounded-lg">
@@ -294,113 +288,14 @@
294
  </div>
295
  </div>
296
 
297
- <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 xl:grid-cols-6 gap-4">
298
- <!-- Sample of the 20,000 tools (showing 12 as example) -->
299
- <div class="holographic p-4 rounded-lg">
300
- <div class="flex items-center mb-3">
301
- <div class="w-10 h-10 bg-blue-900 rounded-lg flex items-center justify-center mr-3">
302
- <i class="fas fa-robot text-blue-400"></i>
303
- </div>
304
- <div>
305
- <h3 class="font-semibold">AI Design Master</h3>
306
- <p class="text-xs text-gray-400">Quantum design generator</p>
307
- </div>
308
- </div>
309
- <div class="flex justify-between items-center">
310
- <span class="text-xs bg-gray-800 px-2 py-1 rounded">v9.4.2</span>
311
- <button class="text-xs quantum-field px-3 py-1 rounded">USE</button>
312
- </div>
313
- </div>
314
-
315
- <div class="holographic p-4 rounded-lg">
316
- <div class="flex items-center mb-3">
317
- <div class="w-10 h-10 bg-purple-900 rounded-lg flex items-center justify-center mr-3">
318
- <i class="fas fa-bolt text-purple-400"></i>
319
- </div>
320
- <div>
321
- <h3 class="font-semibold">Hyper Optimizer</h3>
322
- <p class="text-xs text-gray-400">1000x performance boost</p>
323
- </div>
324
- </div>
325
- <div class="flex justify-between items-center">
326
- <span class="text-xs bg-gray-800 px-2 py-1 rounded">v7.1.5</span>
327
- <button class="text-xs quantum-field px-3 py-1 rounded">USE</button>
328
- </div>
329
- </div>
330
-
331
- <div class="holographic p-4 rounded-lg">
332
- <div class="flex items-center mb-3">
333
- <div class="w-10 h-10 bg-green-900 rounded-lg flex items-center justify-center mr-3">
334
- <i class="fas fa-lock text-green-400"></i>
335
- </div>
336
- <div>
337
- <h3 class="font-semibold">Quantum Security</h3>
338
- <p class="text-xs text-gray-400">Unhackable protection</p>
339
- </div>
340
- </div>
341
- <div class="flex justify-between items-center">
342
- <span class="text-xs bg-gray-800 px-2 py-1 rounded">v12.0.9</span>
343
- <button class="text-xs quantum-field px-3 py-1 rounded">USE</button>
344
- </div>
345
- </div>
346
-
347
- <div class="holographic p-4 rounded-lg">
348
- <div class="flex items-center mb-3">
349
- <div class="w-10 h-10 bg-red-900 rounded-lg flex items-center justify-center mr-3">
350
- <i class="fas fa-chart-line text-red-400"></i>
351
- </div>
352
- <div>
353
- <h3 class="font-semibold">SEO Dominator</h3>
354
- <p class="text-xs text-gray-400">Instant #1 rankings</p>
355
- </div>
356
- </div>
357
- <div class="flex justify-between items-center">
358
- <span class="text-xs bg-gray-800 px-2 py-1 rounded">v5.3.7</span>
359
- <button class="text-xs quantum-field px-3 py-1 rounded">USE</button>
360
- </div>
361
- </div>
362
-
363
- <div class="holographic p-4 rounded-lg">
364
- <div class="flex items-center mb-3">
365
- <div class="w-10 h-10 bg-yellow-900 rounded-lg flex items-center justify-center mr-3">
366
- <i class="fas fa-language text-yellow-400"></i>
367
- </div>
368
- <div>
369
- <h3 class="font-semibold">Omni Translator</h3>
370
- <p class="text-xs text-gray-400">5000+ languages</p>
371
- </div>
372
- </div>
373
- <div class="flex justify-between items-center">
374
- <span class="text-xs bg-gray-800 px-2 py-1 rounded">v8.6.1</span>
375
- <button class="text-xs quantum-field px-3 py-1 rounded">USE</button>
376
- </div>
377
- </div>
378
-
379
- <div class="holographic p-4 rounded-lg">
380
- <div class="flex items-center mb-3">
381
- <div class="w-10 h-10 bg-indigo-900 rounded-lg flex items-center justify-center mr-3">
382
- <i class="fas fa-mobile text-indigo-400"></i>
383
- </div>
384
- <div>
385
- <h3 class="font-semibold">Adaptive Resizer</h3>
386
- <p class="text-xs text-gray-400">Perfect on all devices</p>
387
- </div>
388
- </div>
389
- <div class="flex justify-between items-center">
390
- <span class="text-xs bg-gray-800 px-2 py-1 rounded">v6.2.8</span>
391
- <button class="text-xs quantum-field px-3 py-1 rounded">USE</button>
392
- </div>
393
- </div>
394
-
395
- <!-- More tools would appear here in the actual 20,000 tool matrix -->
396
- <div class="holographic p-4 rounded-lg flex items-center justify-center">
397
- <div class="text-center">
398
- <div class="w-12 h-12 bg-gray-800 rounded-full flex items-center justify-center mx-auto mb-2">
399
- <i class="fas fa-plus text-gray-400"></i>
400
- </div>
401
- <span class="text-xs">19,994 MORE TOOLS</span>
402
- </div>
403
- </div>
404
  </div>
405
  </div>
406
 
@@ -574,11 +469,117 @@
574
  }
575
  }
576
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
577
  // Initialize everything
578
  document.addEventListener('DOMContentLoaded', function() {
579
  createParticles();
580
  visualizeAIArmy();
581
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
582
  // Add click handlers to all quantum buttons
583
  document.querySelectorAll('.quantum-field').forEach(button => {
584
  button.addEventListener('click', function() {
 
48
  0% { box-shadow: 0 0 0 0 rgba(0, 228, 255, 0.7); }
49
  100% { box-shadow: 0 0 0 15px rgba(0, 228, 255, 0); }
50
  }
51
+ .tool-card {
52
+ transition: all 0.3s ease;
53
+ }
54
+ .tool-card:hover {
55
+ transform: translateY(-5px);
56
+ box-shadow: 0 10px 20px rgba(0, 228, 255, 0.3);
57
+ }
58
+ .description-input {
59
+ min-height: 150px;
60
+ }
61
  </style>
62
  </head>
63
  <body class="bg-black text-gray-100 min-h-screen overflow-x-hidden">
 
159
  <div class="flex justify-between items-center mb-6">
160
  <h2 class="text-2xl font-bold neon-text">QUANTUM SITE BUILDER 9000</h2>
161
  <div class="flex space-x-3">
162
+ <button id="generate-btn" class="quantum-field py-2 px-4 rounded-lg flex items-center">
163
+ <i class="fas fa-rocket mr-2"></i> GENERATE
164
  </button>
165
  <button class="bg-purple-900 hover:bg-purple-800 py-2 px-4 rounded-lg flex items-center transition">
166
  <i class="fas fa-cog mr-2"></i> SETTINGS
 
173
  <!-- Input Panel -->
174
  <div class="lg:col-span-1 holographic rounded-lg p-4">
175
  <h3 class="font-semibold mb-4 flex items-center">
176
+ <i class="fas fa-keyboard mr-2"></i> DESCRIPTION INPUT
177
  </h3>
178
 
179
  <div class="space-y-4">
180
  <div>
181
+ <label class="text-xs block mb-1">DESCRIBE YOUR SITE</label>
182
+ <textarea id="site-description" class="quantum-field w-full p-3 rounded-lg text-sm description-input" placeholder="Décrivez votre site en détail..."></textarea>
 
 
 
 
 
 
183
  </div>
184
 
185
  <div>
186
+ <label class="text-xs block mb-1">STYLE PREFERENCE</label>
187
  <select class="quantum-field w-full p-2 rounded-lg text-sm">
188
+ <option>Modern</option>
189
+ <option>Minimalist</option>
190
+ <option>Futuristic</option>
191
+ <option>Elegant</option>
192
+ <option>Bold</option>
193
  </select>
194
  </div>
195
 
196
  <div>
197
+ <label class="text-xs block mb-1">COLOR SCHEME</label>
198
  <select class="quantum-field w-full p-2 rounded-lg text-sm">
199
+ <option>Dark Theme</option>
200
+ <option>Light Theme</option>
201
+ <option>Colorful</option>
202
+ <option>Monochrome</option>
203
  </select>
204
  </div>
205
 
 
 
 
 
 
 
 
 
 
 
 
 
206
  <div class="pt-4">
207
+ <button id="generate-from-description" class="w-full quantum-field py-3 rounded-lg font-semibold flex items-center justify-center">
208
+ <i class="fas fa-atom mr-2"></i> GENERATE FROM DESCRIPTION
209
  </button>
210
  </div>
211
  </div>
 
232
  </div>
233
 
234
  <!-- Quantum Preview Display -->
235
+ <div id="preview-container" class="bg-black border border-gray-800 rounded-lg h-96 flex items-center justify-center relative overflow-hidden">
236
  <!-- Quantum Orb Animation -->
237
  <div class="quantum-orb absolute w-24 h-24 rounded-full bg-gradient-to-r from-blue-500 to-teal-500 opacity-20"></div>
238
 
239
+ <div id="default-preview" class="text-center z-10 p-6">
240
  <div class="w-16 h-16 bg-blue-900 rounded-full flex items-center justify-center mx-auto mb-4">
241
  <i class="fas fa-atom text-2xl text-blue-400"></i>
242
  </div>
243
  <h3 class="text-xl font-bold mb-2">QUANTUM BUILDER</h3>
244
  <p class="text-gray-400 text-sm max-w-md mx-auto">
245
+ Décrivez votre site et nos 360,000 IA quantiques généreront une prévisualisation instantanée.
246
  </p>
247
+ <div id="loader" class="mt-6 flex justify-center hidden">
248
  <div class="quantum-loader w-8 h-8 rounded-full"></div>
249
  </div>
250
  </div>
251
+
252
+ <div id="generated-preview" class="hidden w-full h-full"></div>
253
  </div>
254
 
255
  <div class="mt-4 grid grid-cols-4 gap-2">
 
273
  </div>
274
  </div>
275
 
276
+ <!-- AI Tool Matrix - Full 20,000 Tools -->
277
  <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 mb-8">
278
  <div class="flex justify-between items-center mb-6">
279
+ <h2 class="text-2xl font-bold neon-text">20,000 AI TOOLS MATRIX</h2>
280
  <div class="flex items-center space-x-3">
281
  <div class="relative">
282
+ <input type="text" id="tool-search" placeholder="Search 20K tools..." class="quantum-field px-4 py-2 pr-8 rounded-lg text-sm w-64">
283
  <i class="fas fa-search absolute right-3 top-2.5 text-gray-400"></i>
284
  </div>
285
  <button class="quantum-field py-2 px-3 rounded-lg">
 
288
  </div>
289
  </div>
290
 
291
+ <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 xl:grid-cols-6 gap-4" id="tools-container">
292
+ <!-- Tools will be inserted here by JavaScript -->
293
+ </div>
294
+
295
+ <div class="mt-6 flex justify-center">
296
+ <button id="load-more-tools" class="quantum-field px-6 py-2 rounded-lg">
297
+ <i class="fas fa-sync-alt mr-2"></i> LOAD MORE TOOLS
298
+ </button>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
299
  </div>
300
  </div>
301
 
 
469
  }
470
  }
471
 
472
+ // Generate sample tools
473
+ function generateTools(count) {
474
+ const toolsContainer = document.getElementById('tools-container');
475
+ const toolCategories = [
476
+ { name: 'Design', icon: 'palette', color: 'blue' },
477
+ { name: 'Code', icon: 'code', color: 'purple' },
478
+ { name: 'SEO', icon: 'search', color: 'green' },
479
+ { name: 'Performance', icon: 'bolt', color: 'yellow' },
480
+ { name: 'Security', icon: 'lock', color: 'red' },
481
+ { name: 'AI', icon: 'robot', color: 'teal' },
482
+ { name: 'Database', icon: 'database', color: 'indigo' },
483
+ { name: 'Analytics', icon: 'chart-line', color: 'pink' }
484
+ ];
485
+
486
+ for (let i = 0; i < count; i++) {
487
+ const category = toolCategories[Math.floor(Math.random() * toolCategories.length)];
488
+ const version = `${Math.floor(Math.random() * 10)}.${Math.floor(Math.random() * 10)}.${Math.floor(Math.random() * 10)}`;
489
+
490
+ const toolCard = document.createElement('div');
491
+ toolCard.className = 'holographic p-4 rounded-lg tool-card';
492
+ toolCard.innerHTML = `
493
+ <div class="flex items-center mb-3">
494
+ <div class="w-10 h-10 bg-${category.color}-900 rounded-lg flex items-center justify-center mr-3">
495
+ <i class="fas fa-${category.icon} text-${category.color}-400"></i>
496
+ </div>
497
+ <div>
498
+ <h3 class="font-semibold">${category.name} Tool ${i+1}</h3>
499
+ <p class="text-xs text-gray-400">Quantum ${category.name.toLowerCase()} generator</p>
500
+ </div>
501
+ </div>
502
+ <div class="flex justify-between items-center">
503
+ <span class="text-xs bg-gray-800 px-2 py-1 rounded">v${version}</span>
504
+ <button class="text-xs quantum-field px-3 py-1 rounded">USE</button>
505
+ </div>
506
+ `;
507
+
508
+ toolsContainer.appendChild(toolCard);
509
+ }
510
+ }
511
+
512
+ // Generate site from description
513
+ function generateFromDescription() {
514
+ const description = document.getElementById('site-description').value;
515
+ if (!description.trim()) {
516
+ alert('Veuillez entrer une description pour votre site');
517
+ return;
518
+ }
519
+
520
+ const defaultPreview = document.getElementById('default-preview');
521
+ const generatedPreview = document.getElementById('generated-preview');
522
+ const loader = document.getElementById('loader');
523
+
524
+ // Show loading state
525
+ defaultPreview.classList.add('hidden');
526
+ loader.classList.remove('hidden');
527
+
528
+ // Simulate AI processing (in a real app, this would be an API call)
529
+ setTimeout(() => {
530
+ loader.classList.add('hidden');
531
+
532
+ // Create a simple preview based on description
533
+ generatedPreview.innerHTML = `
534
+ <div class="p-6 text-center">
535
+ <div class="w-16 h-16 bg-purple-900 rounded-full flex items-center justify-center mx-auto mb-4">
536
+ <i class="fas fa-check text-2xl text-purple-400"></i>
537
+ </div>
538
+ <h3 class="text-xl font-bold mb-2">VOTRE SITE EST PRÊT</h3>
539
+ <p class="text-gray-400 text-sm max-w-md mx-auto mb-4">
540
+ Voici une prévisualisation basée sur votre description:<br>
541
+ "${description}"
542
+ </p>
543
+ <div class="bg-gray-800 rounded-lg p-4 max-w-md mx-auto text-left">
544
+ <p class="text-xs text-gray-300">360,000 IA ont analysé votre demande et généré cette solution optimale en 0.002 secondes.</p>
545
+ </div>
546
+ </div>
547
+ `;
548
+ generatedPreview.classList.remove('hidden');
549
+ }, 2000);
550
+ }
551
+
552
  // Initialize everything
553
  document.addEventListener('DOMContentLoaded', function() {
554
  createParticles();
555
  visualizeAIArmy();
556
 
557
+ // Generate initial set of tools
558
+ generateTools(50);
559
+
560
+ // Load more tools when button clicked
561
+ document.getElementById('load-more-tools').addEventListener('click', function() {
562
+ generateTools(50);
563
+ });
564
+
565
+ // Generate from description
566
+ document.getElementById('generate-from-description').addEventListener('click', generateFromDescription);
567
+
568
+ // Search tools
569
+ document.getElementById('tool-search').addEventListener('input', function(e) {
570
+ const searchTerm = e.target.value.toLowerCase();
571
+ const tools = document.querySelectorAll('#tools-container .tool-card');
572
+
573
+ tools.forEach(tool => {
574
+ const text = tool.textContent.toLowerCase();
575
+ if (text.includes(searchTerm)) {
576
+ tool.style.display = 'block';
577
+ } else {
578
+ tool.style.display = 'none';
579
+ }
580
+ });
581
+ });
582
+
583
  // Add click handlers to all quantum buttons
584
  document.querySelectorAll('.quantum-field').forEach(button => {
585
  button.addEventListener('click', function() {
prompts.txt CHANGED
@@ -2,4 +2,5 @@ https://huggingface.co/spaces/docto41/omega-satellite-network ? AJOUTER PLUS DE
2
  toute les boutons ne fonctionne pas ajouter une recherche par adresse avec vue tres puissant 100000fois precis
3
  les boutons de recherche ne sont pas cliquable faire mise a jours pour faire fonctionner
4
  les bouton ne fonctionne pas reconfigue toute le site et faire une mise a jour pour lmes fonctionnement
5
- accompagner d'une armées de 360000 INTELIGENCES ARTIFICIEL les plus puissant je veux creer la copie du site de DeepSite mais en 100000 fois plus rapide , plus performant , plus sofistiqué , plus robotisé , que par systeme de description uniquement avec visuel de la creeation du site , je veux 20000 fois plus d'outil que DeepSite avec toute les derniére technonogie
 
 
2
  toute les boutons ne fonctionne pas ajouter une recherche par adresse avec vue tres puissant 100000fois precis
3
  les boutons de recherche ne sont pas cliquable faire mise a jours pour faire fonctionner
4
  les bouton ne fonctionne pas reconfigue toute le site et faire une mise a jour pour lmes fonctionnement
5
+ accompagner d'une armées de 360000 INTELIGENCES ARTIFICIEL les plus puissant je veux creer la copie du site de DeepSite mais en 100000 fois plus rapide , plus performant , plus sofistiqué , plus robotisé , que par systeme de description uniquement avec visuel de la creeation du site , je veux 20000 fois plus d'outil que DeepSite avec toute les derniére technonogie
6
+ AFFICHER TOUTES LES OUTILS . TOUTES LES BOUTON NE FOCTIONE PAS JE VEUT QUE GENERATEUR PAR DESGRIPTION.