Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <!-- ... (previous head content remains the same) --> | |
| </head> | |
| <body class="bg-white dark:bg-dark text-gray-900 dark:text-gray-100 min-h-screen"> | |
| <!-- ... (previous body content remains the same until the script section) --> | |
| <script> | |
| // ... (previous code remains the same until the generateCode function) | |
| async function generateCode() { | |
| try { | |
| // Show loading state | |
| appRequirements.classList.add('hidden'); | |
| codeGeneration.classList.remove('hidden'); | |
| generationLoading.classList.remove('hidden'); | |
| generationResults.classList.add('hidden'); | |
| state.currentView = 'code-generation'; | |
| // Build the prompt | |
| const techList = state.technologies.length > 0 | |
| ? `using ${state.technologies.join(', ')}` | |
| : ''; | |
| const appTypeText = Array.from(appTypeButtons) | |
| .find(btn => btn.getAttribute('data-type') === state.appType) | |
| .textContent.trim(); | |
| state.originalPrompt = ` | |
| Create a ${appTypeText} application named "${state.appName}" ${techList}. | |
| Requirements: ${state.appDescription} | |
| Respond with: | |
| 1. Complete, ready-to-run code that works in a browser | |
| 2. Only use technologies that work in a standard web browser without backend dependencies | |
| 3. Make the code visually appealing with good UI/UX | |
| 4. Include detailed comments | |
| 5. Return ONLY the complete code, no explanations or additional text | |
| `; | |
| // Get API key from user | |
| const apiKey = prompt('Please enter your DeepSeek API key:'); | |
| if (!apiKey) return; | |
| // Make API call to DeepSeek | |
| const response = await fetch('https://api.boldapps.ai/v1/chat/completions', { | |
| method: 'POST', | |
| headers: { | |
| 'Content-Type': 'application/json', | |
| 'Authorization': `Bearer ${apiKey}` | |
| }, | |
| body: JSON.stringify({ | |
| model: 'deepseek-ai/DeepSeek-R1-Distill-Qwen-32B', | |
| messages: [{ | |
| role: 'user', | |
| content: state.originalPrompt | |
| }], | |
| temperature: 0.7, | |
| max_tokens: 4096 | |
| }) | |
| }); | |
| const data = await response.json(); | |
| if (data.error) { | |
| showError(data.error.message); | |
| return; | |
| } | |
| const code = data.choices[0].message.content; | |
| // Display code and preview | |
| displayGeneratedCode(code); | |
| // Create deployment instructions | |
| createDeploymentInstructions(); | |
| // Show results | |
| generationLoading.classList.add('hidden'); | |
| generationResults.classList.remove('hidden'); | |
| // Try to create a preview | |
| tryCreatePreview(code); | |
| } catch (error) { | |
| showError("An error occurred: " + error.message); | |
| } | |
| } | |
| // Modify submitModification function to use DeepSeek API | |
| submitModification.addEventListener('click', async () => { | |
| const modificationRequest = document.getElementById('modification-request').value.trim(); | |
| if (!modificationRequest) { | |
| alert('Please describe the changes you want to make'); | |
| return; | |
| } | |
| // Show loading | |
| modificationForm.classList.add('hidden'); | |
| generationResults.classList.add('hidden'); | |
| generationLoading.classList.remove('hidden'); | |
| try { | |
| // Get API key from user | |
| const apiKey = prompt('Please enter your DeepSeek API key:'); | |
| if (!apiKey) return; | |
| // Make API call to DeepSeek | |
| const response = await fetch('https://api.boldapps.ai/v1/chat/completions', { | |
| method: 'POST', | |
| headers: { | |
| 'Content-Type': 'application/json', | |
| 'Authorization': `Bearer ${apiKey}` | |
| }, | |
| body: JSON.stringify({ | |
| model: 'deepseek-ai/DeepSeek-R1-Distill-Qwen-32B', | |
| messages: [{ | |
| role: 'user', | |
| content: ` | |
| I have the following code for a ${state.appType} app named "${state.appName}": | |
| \`\`\` | |
| ${state.generatedCode} | |
| \`\`\` | |
| Please modify the code according to this request: "${modificationRequest}" | |
| Return ONLY the complete modified code, no explanations or additional text. | |
| ` | |
| }], | |
| temperature: 0.7, | |
| max_tokens: 4096 | |
| }) | |
| }); | |
| const data = await response.json(); | |
| if (data.error) { | |
| showError(data.error.message); | |
| return; | |
| } | |
| const modifiedCode = data.choices[0].message.content; | |
| // Display code and preview | |
| displayGeneratedCode(modifiedCode); | |
| // Try to create a preview | |
| tryCreatePreview(modifiedCode); | |
| // Show results | |
| generationLoading.classList.add('hidden'); | |
| generationResults.classList.remove('hidden'); | |
| } catch (error) { | |
| showError("An error occurred: " + error.message); | |
| } | |
| }); | |
| // ... (rest of the code remains the same) | |
| </script> | |
| </body> | |
| </html> |