Hugging Face's logo

Spaces:
docto41
/
system-correction
Running

App Files Community
docto41 commited on
Commit
9473206
·
verified ·
1 Parent(s): 5685d07

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +429 -111
  2. prompts.txt +3 -1
index.html CHANGED
@@ -43,6 +43,19 @@
43
  border: 2px solid transparent;
44
  border-image: linear-gradient(45deg, #00dbde, #fc00ff) 1;
45
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
46
  </style>
47
  </head>
48
  <body class="bg-black text-white font-mono">
@@ -86,77 +99,136 @@
86
  </div>
87
 
88
  <div id="generatorPanel" class="hidden bg-gray-900 rounded-xl p-8 mb-16 hyper-shadow">
89
- <div class="flex flex-col md:flex-row gap-8">
90
- <div class="flex-1">
91
- <h2 class="text-3xl font-bold mb-6 hyper-text">Configuration</h2>
92
-
93
- <div class="space-y-6">
94
- <div>
95
- <label class="block text-gray-300 mb-2">Website Type</label>
96
- <select id="siteType" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-purple-500">
97
- <option>E-commerce</option>
98
- <option>Portfolio</option>
99
- <option>Blog</option>
100
- <option>Corporate</option>
101
- <option>Landing Page</option>
102
- <option>Social Network</option>
103
- </select>
104
- </div>
105
 
106
- <div>
107
- <label class="block text-gray-300 mb-2">Style</label>
108
- <div class="grid grid-cols-3 gap-3">
109
- <button class="style-option bg-gradient-to-br from-purple-900 to-blue-900 p-4 rounded-lg hover:opacity-90" data-style="futuristic">
110
- <i class="fas fa-robot"></i> Futuristic
111
- </button>
112
- <button class="style-option bg-gradient-to-br from-pink-900 to-red-900 p-4 rounded-lg hover:opacity-90" data-style="minimal">
113
- <i class="fas fa-minus"></i> Minimal
114
- </button>
115
- <button class="style-option bg-gradient-to-br from-green-900 to-teal-900 p-4 rounded-lg hover:opacity-90" data-style="organic">
116
- <i class="fas fa-leaf"></i> Organic
117
- </button>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
118
  </div>
119
  </div>
120
-
121
- <div>
122
- <label class="block text-gray-300 mb-2">Color Scheme</label>
123
- <div class="flex space-x-2">
124
- <input type="color" id="primaryColor" value="#8b5cf6" class="w-12 h-12 rounded-full overflow-hidden border-2 border-gray-700 cursor-pointer">
125
- <input type="color" id="secondaryColor" value="#ec4899" class="w-12 h-12 rounded-full overflow-hidden border-2 border-gray-700 cursor-pointer">
126
- <input type="color" id="accentColor" value="#3b82f6" class="w-12 h-12 rounded-full overflow-hidden border-2 border-gray-700 cursor-pointer">
 
127
  </div>
128
  </div>
 
 
 
 
 
 
 
 
129
 
130
- <div>
131
- <label class="block text-gray-300 mb-2">Additional Features (4111X Boost)</label>
132
- <div class="space-y-2">
133
- <label class="flex items-center space-x-3">
134
- <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600" checked>
135
- <span>AI Content Generation</span>
136
- </label>
137
- <label class="flex items-center space-x-3">
138
- <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600" checked>
139
- <span>Responsive Design</span>
140
- </label>
141
- <label class="flex items-center space-x-3">
142
- <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600" checked>
143
- <span>SEO Optimization</span>
144
- </label>
145
- <label class="flex items-center space-x-3">
146
- <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600">
147
- <span>Dark Mode</span>
148
- </label>
 
 
 
 
 
 
 
 
149
  </div>
150
  </div>
151
  </div>
152
- </div>
153
-
154
- <div class="flex-1">
155
- <h2 class="text-3xl font-bold mb-6 hyper-text">Preview</h2>
156
- <div id="previewContainer" class="bg-gray-800 rounded-lg p-4 h-96 overflow-auto border border-dashed border-gray-700">
157
- <div class="text-center text-gray-500 py-16">
158
- <i class="fas fa-eye-slash text-4xl mb-4"></i>
159
- <p>Configure your website to see preview</p>
160
  </div>
161
  </div>
162
  </div>
@@ -178,7 +250,7 @@
178
  <i class="fas fa-check-circle"></i>
179
  </div>
180
  <h2 class="text-4xl font-bold mb-4 hyper-text">Generation Complete!</h2>
181
- <p class="text-xl text-gray-300 mb-8">Your website was generated in <span class="text-yellow-300">0.00000024s</span> (4111X faster than standard)</p>
182
 
183
  <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
184
  <div class="bg-gray-800 p-4 rounded-lg">
@@ -205,13 +277,13 @@
205
  </div>
206
 
207
  <div class="flex justify-center space-x-4">
208
- <button class="bg-purple-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-purple-700 transition-all">
209
  <i class="fas fa-download mr-2"></i> Download ZIP
210
  </button>
211
- <button class="bg-blue-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-700 transition-all">
212
  <i class="fas fa-eye mr-2"></i> Live Preview
213
  </button>
214
- <button class="bg-green-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-green-700 transition-all">
215
  <i class="fas fa-redo mr-2"></i> Generate Again
216
  </button>
217
  </div>
@@ -226,75 +298,142 @@
226
 
227
  <script>
228
  document.addEventListener('DOMContentLoaded', function() {
 
229
  const generateBtn = document.getElementById('generateBtn');
230
  const generatorPanel = document.getElementById('generatorPanel');
231
  const resultPanel = document.getElementById('resultPanel');
232
  const generateNowBtn = document.getElementById('generateNowBtn');
233
  const previewContainer = document.getElementById('previewContainer');
234
  const styleOptions = document.querySelectorAll('.style-option');
 
 
 
 
 
 
 
 
 
 
 
 
 
 
235
 
236
- // Speed metrics
 
237
  let speedFactor = 4111;
238
 
239
- // Generate button click
240
- generateBtn.addEventListener('click', function() {
241
- generatorPanel.classList.remove('hidden');
242
- resultPanel.classList.add('hidden');
243
- generateBtn.classList.add('hidden');
244
-
245
- // Scroll to panel
246
- generatorPanel.scrollIntoView({ behavior: 'smooth' });
 
 
 
 
 
 
 
 
 
 
 
 
247
  });
248
 
249
  // Style selection
250
  styleOptions.forEach(option => {
251
  option.addEventListener('click', function() {
252
- styleOptions.forEach(opt => opt.classList.remove('border-2', 'border-white'));
253
- this.classList.add('border-2', 'border-white');
254
-
255
- // Update preview based on style
256
- updatePreview(this.dataset.style);
257
  });
258
  });
259
 
260
  // Color pickers
261
  const colorInputs = document.querySelectorAll('input[type="color"]');
262
  colorInputs.forEach(input => {
263
- input.addEventListener('input', function() {
264
- updatePreview();
265
- });
266
  });
267
 
268
- // Generate now button
269
- generateNowBtn.addEventListener('click', function() {
270
- // Show loading state
271
- generateNowBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> GENERATING AT 4111X SPEED...';
272
- generateNowBtn.disabled = true;
273
-
274
- // Simulate ultra-fast generation (but with a small delay for effect)
275
- setTimeout(() => {
276
- generatorPanel.classList.add('hidden');
277
- resultPanel.classList.remove('hidden');
278
-
279
- // Update speed metrics with random variation
280
- const baseTime = 0.00000024;
281
- const randomFactor = 1 + (Math.random() * 0.2 - 0.1); // ±10% variation
282
- const displayTime = (baseTime * randomFactor).toFixed(8);
283
-
284
- document.querySelector('#resultPanel .text-yellow-300').textContent = `${displayTime}s`;
285
-
286
- // Scroll to results
287
- resultPanel.scrollIntoView({ behavior: 'smooth' });
288
- }, 300); // "Slow" 300ms delay to appreciate the 4111X speed!
289
  });
290
 
291
- // Update preview function
292
- function updatePreview(style = 'futuristic') {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
293
  const primaryColor = document.getElementById('primaryColor').value;
294
  const secondaryColor = document.getElementById('secondaryColor').value;
295
  const accentColor = document.getElementById('accentColor').value;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
296
 
297
- // Generate preview HTML based on selections
298
  let previewHTML = `
299
  <div class="min-h-full" style="background: linear-gradient(135deg, ${primaryColor} 0%, ${secondaryColor} 100%); color: white;">
300
  <div class="p-6">
@@ -309,9 +448,9 @@
309
  </div>
310
 
311
  <div class="text-center py-12">
312
- <h1 class="text-4xl font-bold mb-4">Welcome to the Future</h1>
313
- <p class="text-xl mb-8">Experience website generation at 4111X the speed</p>
314
- <button class="px-6 py-3 rounded-full font-bold" style="background: ${accentColor};">Get Started</button>
315
  </div>
316
 
317
  <div class="grid grid-cols-3 gap-6 mt-16">
@@ -338,10 +477,189 @@
338
  previewContainer.innerHTML = previewHTML;
339
  }
340
 
341
- // Initialize with first style selected
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
342
  if (styleOptions.length > 0) {
343
  styleOptions[0].click();
344
  }
 
 
 
345
  });
346
  </script>
347
  <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=docto41/system-correction" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
 
43
  border: 2px solid transparent;
44
  border-image: linear-gradient(45deg, #00dbde, #fc00ff) 1;
45
  }
46
+ .selected-style {
47
+ border: 2px solid white !important;
48
+ }
49
+ .description-input {
50
+ min-height: 120px;
51
+ }
52
+ .tab-button {
53
+ transition: all 0.3s ease;
54
+ }
55
+ .tab-button.active {
56
+ background: linear-gradient(135deg, #00dbde 0%, #fc00ff 100%);
57
+ color: white;
58
+ }
59
  </style>
60
  </head>
61
  <body class="bg-black text-white font-mono">
 
99
  </div>
100
 
101
  <div id="generatorPanel" class="hidden bg-gray-900 rounded-xl p-8 mb-16 hyper-shadow">
102
+ <div class="flex border-b border-gray-700 mb-6">
103
+ <button class="tab-button active px-4 py-2 rounded-t-lg mr-2" data-tab="config">
104
+ <i class="fas fa-cog mr-2"></i> Configuration
105
+ </button>
106
+ <button class="tab-button px-4 py-2 rounded-t-lg" data-tab="description">
107
+ <i class="fas fa-align-left mr-2"></i> AI Description
108
+ </button>
109
+ </div>
110
+
111
+ <div id="configTab" class="tab-content">
112
+ <div class="flex flex-col md:flex-row gap-8">
113
+ <div class="flex-1">
114
+ <h2 class="text-3xl font-bold mb-6 hyper-text">Configuration</h2>
 
 
 
115
 
116
+ <div class="space-y-6">
117
+ <div>
118
+ <label class="block text-gray-300 mb-2">Website Type</label>
119
+ <select id="siteType" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-purple-500">
120
+ <option>E-commerce</option>
121
+ <option>Portfolio</option>
122
+ <option>Blog</option>
123
+ <option>Corporate</option>
124
+ <option>Landing Page</option>
125
+ <option>Social Network</option>
126
+ </select>
127
+ </div>
128
+
129
+ <div>
130
+ <label class="block text-gray-300 mb-2">Style</label>
131
+ <div class="grid grid-cols-3 gap-3">
132
+ <button class="style-option bg-gradient-to-br from-purple-900 to-blue-900 p-4 rounded-lg hover:opacity-90" data-style="futuristic">
133
+ <i class="fas fa-robot"></i> Futuristic
134
+ </button>
135
+ <button class="style-option bg-gradient-to-br from-pink-900 to-red-900 p-4 rounded-lg hover:opacity-90" data-style="minimal">
136
+ <i class="fas fa-minus"></i> Minimal
137
+ </button>
138
+ <button class="style-option bg-gradient-to-br from-green-900 to-teal-900 p-4 rounded-lg hover:opacity-90" data-style="organic">
139
+ <i class="fas fa-leaf"></i> Organic
140
+ </button>
141
+ </div>
142
+ </div>
143
+
144
+ <div>
145
+ <label class="block text-gray-300 mb-2">Color Scheme</label>
146
+ <div class="flex space-x-2">
147
+ <input type="color" id="primaryColor" value="#8b5cf6" class="w-12 h-12 rounded-full overflow-hidden border-2 border-gray-700 cursor-pointer">
148
+ <input type="color" id="secondaryColor" value="#ec4899" class="w-12 h-12 rounded-full overflow-hidden border-2 border-gray-700 cursor-pointer">
149
+ <input type="color" id="accentColor" value="#3b82f6" class="w-12 h-12 rounded-full overflow-hidden border-2 border-gray-700 cursor-pointer">
150
+ </div>
151
+ </div>
152
+
153
+ <div>
154
+ <label class="block text-gray-300 mb-2">Additional Features (4111X Boost)</label>
155
+ <div class="space-y-2">
156
+ <label class="flex items-center space-x-3">
157
+ <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600" checked>
158
+ <span>AI Content Generation</span>
159
+ </label>
160
+ <label class="flex items-center space-x-3">
161
+ <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600" checked>
162
+ <span>Responsive Design</span>
163
+ </label>
164
+ <label class="flex items-center space-x-3">
165
+ <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600" checked>
166
+ <span>SEO Optimization</span>
167
+ </label>
168
+ <label class="flex items-center space-x-3">
169
+ <input type="checkbox" class="form-checkbox h-5 w-5 text-purple-600">
170
+ <span>Dark Mode</span>
171
+ </label>
172
+ </div>
173
  </div>
174
  </div>
175
+ </div>
176
+
177
+ <div class="flex-1">
178
+ <h2 class="text-3xl font-bold mb-6 hyper-text">Preview</h2>
179
+ <div id="previewContainer" class="bg-gray-800 rounded-lg p-4 h-96 overflow-auto border border-dashed border-gray-700">
180
+ <div class="text-center text-gray-500 py-16">
181
+ <i class="fas fa-eye-slash text-4xl mb-4"></i>
182
+ <p>Configure your website to see preview</p>
183
  </div>
184
  </div>
185
+ </div>
186
+ </div>
187
+ </div>
188
+
189
+ <div id="descriptionTab" class="tab-content hidden">
190
+ <div class="flex flex-col md:flex-row gap-8">
191
+ <div class="flex-1">
192
+ <h2 class="text-3xl font-bold mb-6 hyper-text">AI Description Generator</h2>
193
 
194
+ <div class="space-y-6">
195
+ <div>
196
+ <label class="block text-gray-300 mb-2">Describe your perfect website</label>
197
+ <textarea id="siteDescription" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-purple-500 description-input" placeholder="Example: I need a futuristic e-commerce site selling quantum computers with dark mode and neon colors..."></textarea>
198
+ </div>
199
+
200
+ <div>
201
+ <label class="block text-gray-300 mb-2">AI Intensity</label>
202
+ <div class="flex items-center">
203
+ <input type="range" id="aiIntensity" min="1" max="10" value="7" class="w-full h-2 bg-gray-700 rounded-lg appearance-none cursor-pointer">
204
+ <span id="intensityValue" class="ml-4 text-purple-400 font-bold">7/10</span>
205
+ </div>
206
+ <div class="text-xs text-gray-500 mt-1">Higher intensity = more creative (and unpredictable) results</div>
207
+ </div>
208
+
209
+ <button id="analyzeDescriptionBtn" class="hyper-gradient text-white px-6 py-3 rounded-lg font-bold hover:opacity-90 transition-all w-full">
210
+ <i class="fas fa-magic mr-2"></i> ANALYZE DESCRIPTION
211
+ </button>
212
+
213
+ <div id="analysisResult" class="hidden bg-gray-800 p-4 rounded-lg border border-purple-900">
214
+ <h3 class="text-xl font-bold text-purple-400 mb-2"><i class="fas fa-lightbulb mr-2"></i> AI Analysis</h3>
215
+ <div id="analysisContent" class="text-gray-300">
216
+ <!-- Will be filled by JavaScript -->
217
+ </div>
218
+ <button id="applyAnalysisBtn" class="mt-4 bg-purple-900 text-white px-4 py-2 rounded-lg text-sm hover:bg-purple-800 transition-all">
219
+ <i class="fas fa-check mr-2"></i> Apply These Settings
220
+ </button>
221
  </div>
222
  </div>
223
  </div>
224
+
225
+ <div class="flex-1">
226
+ <h2 class="text-3xl font-bold mb-6 hyper-text">AI Suggestions</h2>
227
+ <div class="bg-gray-800 rounded-lg p-4 h-96 overflow-auto border border-dashed border-gray-700">
228
+ <div id="aiSuggestions" class="text-center text-gray-500 py-16">
229
+ <i class="fas fa-robot text-4xl mb-4"></i>
230
+ <p>Describe your website to get AI-powered suggestions</p>
231
+ </div>
232
  </div>
233
  </div>
234
  </div>
 
250
  <i class="fas fa-check-circle"></i>
251
  </div>
252
  <h2 class="text-4xl font-bold mb-4 hyper-text">Generation Complete!</h2>
253
+ <p class="text-xl text-gray-300 mb-8">Your website was generated in <span id="generationTime" class="text-yellow-300">0.00000024s</span> (4111X faster than standard)</p>
254
 
255
  <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
256
  <div class="bg-gray-800 p-4 rounded-lg">
 
277
  </div>
278
 
279
  <div class="flex justify-center space-x-4">
280
+ <button id="downloadBtn" class="bg-purple-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-purple-700 transition-all">
281
  <i class="fas fa-download mr-2"></i> Download ZIP
282
  </button>
283
+ <button id="previewBtn" class="bg-blue-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-700 transition-all">
284
  <i class="fas fa-eye mr-2"></i> Live Preview
285
  </button>
286
+ <button id="generateAgainBtn" class="bg-green-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-green-700 transition-all">
287
  <i class="fas fa-redo mr-2"></i> Generate Again
288
  </button>
289
  </div>
 
298
 
299
  <script>
300
  document.addEventListener('DOMContentLoaded', function() {
301
+ // Elements
302
  const generateBtn = document.getElementById('generateBtn');
303
  const generatorPanel = document.getElementById('generatorPanel');
304
  const resultPanel = document.getElementById('resultPanel');
305
  const generateNowBtn = document.getElementById('generateNowBtn');
306
  const previewContainer = document.getElementById('previewContainer');
307
  const styleOptions = document.querySelectorAll('.style-option');
308
+ const downloadBtn = document.getElementById('downloadBtn');
309
+ const previewBtn = document.getElementById('previewBtn');
310
+ const generateAgainBtn = document.getElementById('generateAgainBtn');
311
+ const generationTime = document.getElementById('generationTime');
312
+ const tabButtons = document.querySelectorAll('.tab-button');
313
+ const tabContents = document.querySelectorAll('.tab-content');
314
+ const siteDescription = document.getElementById('siteDescription');
315
+ const aiIntensity = document.getElementById('aiIntensity');
316
+ const intensityValue = document.getElementById('intensityValue');
317
+ const analyzeDescriptionBtn = document.getElementById('analyzeDescriptionBtn');
318
+ const analysisResult = document.getElementById('analysisResult');
319
+ const analysisContent = document.getElementById('analysisContent');
320
+ const applyAnalysisBtn = document.getElementById('applyAnalysisBtn');
321
+ const aiSuggestions = document.getElementById('aiSuggestions');
322
 
323
+ // Variables
324
+ let currentStyle = 'futuristic';
325
  let speedFactor = 4111;
326
 
327
+ // Event Listeners
328
+ generateBtn.addEventListener('click', showGeneratorPanel);
329
+ generateNowBtn.addEventListener('click', generateWebsite);
330
+ downloadBtn.addEventListener('click', downloadFiles);
331
+ previewBtn.addEventListener('click', showPreview);
332
+ generateAgainBtn.addEventListener('click', generateAgain);
333
+
334
+ // Tab switching
335
+ tabButtons.forEach(button => {
336
+ button.addEventListener('click', function() {
337
+ const tabId = this.dataset.tab;
338
+
339
+ // Update active tab button
340
+ tabButtons.forEach(btn => btn.classList.remove('active'));
341
+ this.classList.add('active');
342
+
343
+ // Show corresponding tab content
344
+ tabContents.forEach(content => content.classList.add('hidden'));
345
+ document.getElementById(`${tabId}Tab`).classList.remove('hidden');
346
+ });
347
  });
348
 
349
  // Style selection
350
  styleOptions.forEach(option => {
351
  option.addEventListener('click', function() {
352
+ currentStyle = this.dataset.style;
353
+ styleOptions.forEach(opt => opt.classList.remove('selected-style'));
354
+ this.classList.add('selected-style');
355
+ updatePreview();
 
356
  });
357
  });
358
 
359
  // Color pickers
360
  const colorInputs = document.querySelectorAll('input[type="color"]');
361
  colorInputs.forEach(input => {
362
+ input.addEventListener('input', updatePreview);
 
 
363
  });
364
 
365
+ // Website type change
366
+ document.getElementById('siteType').addEventListener('change', updatePreview);
367
+
368
+ // AI Intensity slider
369
+ aiIntensity.addEventListener('input', function() {
370
+ intensityValue.textContent = `${this.value}/10`;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
371
  });
372
 
373
+ // Analyze description
374
+ analyzeDescriptionBtn.addEventListener('click', analyzeDescription);
375
+
376
+ // Apply analysis
377
+ applyAnalysisBtn.addEventListener('click', applyAnalysis);
378
+
379
+ // Functions
380
+ function showGeneratorPanel() {
381
+ generatorPanel.classList.remove('hidden');
382
+ resultPanel.classList.add('hidden');
383
+ generateBtn.classList.add('hidden');
384
+ generatorPanel.scrollIntoView({ behavior: 'smooth' });
385
+
386
+ // Initialize with first style selected if none selected
387
+ if (!document.querySelector('.style-option.selected-style') && styleOptions.length > 0) {
388
+ styleOptions[0].click();
389
+ }
390
+ }
391
+
392
+ function updatePreview() {
393
  const primaryColor = document.getElementById('primaryColor').value;
394
  const secondaryColor = document.getElementById('secondaryColor').value;
395
  const accentColor = document.getElementById('accentColor').value;
396
+ const siteType = document.getElementById('siteType').value;
397
+
398
+ let title, description, buttonText;
399
+
400
+ switch(siteType) {
401
+ case 'E-commerce':
402
+ title = "Next-Gen E-commerce";
403
+ description = "Sell at 4111X speed with quantum storefront";
404
+ buttonText = "Shop Now";
405
+ break;
406
+ case 'Portfolio':
407
+ title = "Showcase Your Work";
408
+ description = "Portfolio that loads before you click";
409
+ buttonText = "View Projects";
410
+ break;
411
+ case 'Blog':
412
+ title = "Hyper-Speed Blog";
413
+ description = "Content that writes itself at 4111X speed";
414
+ buttonText = "Read More";
415
+ break;
416
+ case 'Corporate':
417
+ title = "Corporate Excellence";
418
+ description = "Professional presence that defies physics";
419
+ buttonText = "Learn More";
420
+ break;
421
+ case 'Landing Page':
422
+ title = "Convert in Nanoseconds";
423
+ description = "Landing page that converts before loading";
424
+ buttonText = "Get Started";
425
+ break;
426
+ case 'Social Network':
427
+ title = "Social at Light Speed";
428
+ description = "Connect faster than thought possible";
429
+ buttonText = "Join Now";
430
+ break;
431
+ default:
432
+ title = "Welcome to the Future";
433
+ description = "Experience website generation at 4111X the speed";
434
+ buttonText = "Get Started";
435
+ }
436
 
 
437
  let previewHTML = `
438
  <div class="min-h-full" style="background: linear-gradient(135deg, ${primaryColor} 0%, ${secondaryColor} 100%); color: white;">
439
  <div class="p-6">
 
448
  </div>
449
 
450
  <div class="text-center py-12">
451
+ <h1 class="text-4xl font-bold mb-4">${title}</h1>
452
+ <p class="text-xl mb-8">${description}</p>
453
+ <button class="px-6 py-3 rounded-full font-bold" style="background: ${accentColor};">${buttonText}</button>
454
  </div>
455
 
456
  <div class="grid grid-cols-3 gap-6 mt-16">
 
477
  previewContainer.innerHTML = previewHTML;
478
  }
479
 
480
+ function generateWebsite() {
481
+ // Show loading state
482
+ generateNowBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> GENERATING AT 4111X SPEED...';
483
+ generateNowBtn.disabled = true;
484
+
485
+ // Simulate ultra-fast generation
486
+ setTimeout(() => {
487
+ generatorPanel.classList.add('hidden');
488
+ resultPanel.classList.remove('hidden');
489
+
490
+ // Update speed metrics with random variation
491
+ const baseTime = 0.00000024;
492
+ const randomFactor = 1 + (Math.random() * 0.2 - 0.1); // ±10% variation
493
+ const displayTime = (baseTime * randomFactor).toFixed(8);
494
+
495
+ generationTime.textContent = `${displayTime}s`;
496
+
497
+ // Scroll to results
498
+ resultPanel.scrollIntoView({ behavior: 'smooth' });
499
+ }, 300);
500
+ }
501
+
502
+ function downloadFiles() {
503
+ alert('Downloading 4111 website files at quantum speed!');
504
+ }
505
+
506
+ function showPreview() {
507
+ alert('Opening live preview in parallel dimension...');
508
+ }
509
+
510
+ function generateAgain() {
511
+ resultPanel.classList.add('hidden');
512
+ generateBtn.classList.remove('hidden');
513
+ generateNowBtn.innerHTML = '<i class="fas fa-rocket mr-2"></i> LAUNCH GENERATOR';
514
+ generateNowBtn.disabled = false;
515
+
516
+ // Scroll to top
517
+ window.scrollTo({ top: 0, behavior: 'smooth' });
518
+ }
519
+
520
+ function analyzeDescription() {
521
+ const description = siteDescription.value.trim();
522
+ const intensity = parseInt(aiIntensity.value);
523
+
524
+ if (!description) {
525
+ alert('Please describe your website first!');
526
+ return;
527
+ }
528
+
529
+ // Show loading state
530
+ analyzeDescriptionBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> ANALYZING...';
531
+ analyzeDescriptionBtn.disabled = true;
532
+
533
+ // Simulate AI analysis
534
+ setTimeout(() => {
535
+ // Generate random but plausible analysis based on description
536
+ const keywords = extractKeywords(description);
537
+ const randomFeatures = getRandomFeatures(intensity);
538
+
539
+ // Build analysis content
540
+ let analysisHTML = `
541
+ <p class="mb-3">Based on your description, our quantum AI recommends:</p>
542
+ <ul class="list-disc pl-5 space-y-2">
543
+ <li><strong>Website Type:</strong> ${keywords.type || 'Corporate'}</li>
544
+ <li><strong>Design Style:</strong> ${keywords.style || 'Futuristic'}</li>
545
+ <li><strong>Primary Color:</strong> ${keywords.primaryColor || '#8b5cf6'}</li>
546
+ <li><strong>Secondary Color:</strong> ${keywords.secondaryColor || '#ec4899'}</li>
547
+ ${randomFeatures.map(f => `<li>${f}</li>`).join('')}
548
+ </ul>
549
+ `;
550
+
551
+ analysisContent.innerHTML = analysisHTML;
552
+ analysisResult.classList.remove('hidden');
553
+
554
+ // Update AI suggestions
555
+ updateAiSuggestions(keywords, intensity);
556
+
557
+ // Reset button
558
+ analyzeDescriptionBtn.innerHTML = '<i class="fas fa-magic mr-2"></i> ANALYZE DESCRIPTION';
559
+ analyzeDescriptionBtn.disabled = false;
560
+
561
+ // Scroll to analysis result
562
+ analysisResult.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
563
+ }, 1500);
564
+ }
565
+
566
+ function applyAnalysis() {
567
+ // Get the analysis content (in a real app, this would come from the AI response)
568
+ const analysisText = analysisContent.textContent;
569
+
570
+ // Extract values (simplified for demo)
571
+ if (analysisText.includes('E-commerce')) {
572
+ document.getElementById('siteType').value = 'E-commerce';
573
+ } else if (analysisText.includes('Portfolio')) {
574
+ document.getElementById('siteType').value = 'Portfolio';
575
+ }
576
+
577
+ if (analysisText.includes('Futuristic')) {
578
+ document.querySelector('[data-style="futuristic"]').click();
579
+ } else if (analysisText.includes('Minimal')) {
580
+ document.querySelector('[data-style="minimal"]').click();
581
+ }
582
+
583
+ // Update preview
584
+ updatePreview();
585
+
586
+ // Show confirmation
587
+ alert('AI recommendations applied to your configuration!');
588
+ }
589
+
590
+ function extractKeywords(text) {
591
+ // Simple keyword extraction (in a real app, this would use NLP)
592
+ const result = {};
593
+
594
+ if (text.toLowerCase().includes('e-commerce') || text.toLowerCase().includes('shop') || text.toLowerCase().includes('store')) {
595
+ result.type = 'E-commerce';
596
+ } else if (text.toLowerCase().includes('portfolio') || text.toLowerCase().includes('showcase')) {
597
+ result.type = 'Portfolio';
598
+ }
599
+
600
+ if (text.toLowerCase().includes('futuristic') || text.toLowerCase().includes('tech') || text.toLowerCase().includes('quantum')) {
601
+ result.style = 'Futuristic';
602
+ } else if (text.toLowerCase().includes('minimal') || text.toLowerCase().includes('simple') || text.toLowerCase().includes('clean')) {
603
+ result.style = 'Minimal';
604
+ }
605
+
606
+ if (text.toLowerCase().includes('blue') || text.toLowerCase().includes('ocean') || text.toLowerCase().includes('sky')) {
607
+ result.primaryColor = '#3b82f6';
608
+ } else if (text.toLowerCase().includes('purple') || text.toLowerCase().includes('violet')) {
609
+ result.primaryColor = '#8b5cf6';
610
+ }
611
+
612
+ return result;
613
+ }
614
+
615
+ function getRandomFeatures(intensity) {
616
+ const allFeatures = [
617
+ "Quantum-speed animations for enhanced user experience",
618
+ "AI-powered product recommendations",
619
+ "Neural network based search functionality",
620
+ "Parallel dimension loading for instant page transitions",
621
+ "Holographic UI elements",
622
+ "Voice-controlled navigation",
623
+ "Self-updating content with temporal AI",
624
+ "Personalized user journeys using quantum entanglement",
625
+ "Predictive scrolling based on brainwave analysis",
626
+ "4D navigation that bends spacetime"
627
+ ];
628
+
629
+ // More features for higher intensity
630
+ const count = Math.min(3 + Math.floor(intensity / 3), allFeatures.length);
631
+ const shuffled = [...allFeatures].sort(() => 0.5 - Math.random());
632
+ return shuffled.slice(0, count);
633
+ }
634
+
635
+ function updateAiSuggestions(keywords, intensity) {
636
+ const suggestions = [
637
+ "Consider adding a quantum particle animation to your hero section",
638
+ "Our AI suggests implementing a neural recommendation engine",
639
+ "For maximum impact, use a gradient from " + (keywords.primaryColor || 'purple') + " to " + (keywords.secondaryColor || 'pink'),
640
+ "At intensity " + intensity + ", we recommend adding temporal displacement effects",
641
+ "Your description indicates you might benefit from our 4111X parallax technology"
642
+ ];
643
+
644
+ aiSuggestions.innerHTML = `
645
+ <div class="text-left space-y-4">
646
+ <h3 class="text-xl font-bold text-purple-400 mb-2">AI Suggestions</h3>
647
+ ${suggestions.map(s => `
648
+ <div class="bg-gray-700 p-3 rounded-lg border-l-4 border-purple-500">
649
+ <i class="fas fa-lightbulb text-yellow-300 mr-2"></i> ${s}
650
+ </div>
651
+ `).join('')}
652
+ </div>
653
+ `;
654
+ }
655
+
656
+ // Initialize
657
  if (styleOptions.length > 0) {
658
  styleOptions[0].click();
659
  }
660
+
661
+ // Set initial tab to config
662
+ tabButtons[0].click();
663
  });
664
  </script>
665
  <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=docto41/system-correction" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
prompts.txt CHANGED
@@ -2,4 +2,6 @@ https://huggingface.co/spaces/doctorblo/systeme-correction
2
  aucun bouton fonctionne veuillez verifier toutes les bouton et mettre a jours
3
  aucun bouton fonctionne veuillez corriger les erreurs de non fonctionnement
4
  deepsite ai
5
- CREE LE GENERATEUR DEEPSITE 4111 FOIS PLUS RAPIDE QUE DEEPSITE
 
 
 
2
  aucun bouton fonctionne veuillez verifier toutes les bouton et mettre a jours
3
  aucun bouton fonctionne veuillez corriger les erreurs de non fonctionnement
4
  deepsite ai
5
+ CREE LE GENERATEUR DEEPSITE 4111 FOIS PLUS RAPIDE QUE DEEPSITE
6
+ aucun bouton fonctionne
7
+ ajouter le generateur par description