Spaces:
Build error
Build error
File size: 4,673 Bytes
f2bc6e2 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FallnAI Autonomous Software Developer</title>
<style>
body { font-family: sans-serif; margin: 20px; background-color: #f0f4f8; }
.container { max-width: 900px; margin: auto; padding: 20px; background: white; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
h1 { text-align: center; color: #333; }
.input-group { margin-bottom: 20px; }
textarea { width: 100%; height: 100px; padding: 10px; border: 1px solid #ccc; border-radius: 4px; }
button { padding: 10px 20px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; }
button:disabled { background-color: #aaa; cursor: not-allowed; }
.log-section, .code-section, .docs-section { margin-top: 20px; }
pre { background: #eee; padding: 15px; border-radius: 4px; overflow-x: auto; white-space: pre-wrap; word-wrap: break-word; }
#progressLog, #finalCode, #finalUI, #finalDocs { border: 1px solid #ddd; min-height: 150px; }
</style>
</head>
<body>
<div class="container">
<h1>🤖 FallnAI Autonomous Software Developer v.01</h1>
<p>Enter your software specifications below. The agents will plan, code, and test the solution automatically using open-source models.</p>
<div class="input-group">
<textarea id="prompt" placeholder="e.g., A simple Python script that takes a list of numbers and returns the sum."></textarea>
<button id="devButton" onclick="startDevelopment()">Start Development</button>
</div>
<div class="log-section">
<h2>Development Log</h2>
<pre id="progressLog">Waiting for input...</pre>
</div>
<div class="code-section">
<h2>Final Code (`app.py`)</h2>
<pre id="finalCode">The final code will appear here.</pre>
</div>
<div class="code-section">
<h2>User Interface (`index.html`)</h2>
<pre id="finalUI">The user interface code will appear here.</pre>
</div>
<div class="docs-section">
<h2>Documentation (`README.md`)</h2>
<pre id="finalDocs">The README file will be generated here.</pre>
</div>
</div>
<script>
async function startDevelopment() {
const prompt = document.getElementById('prompt').value;
const progressLog = document.getElementById('progressLog');
const finalCode = document.getElementById('finalCode');
const finalUI = document.getElementById('finalUI');
const finalDocs = document.getElementById('finalDocs');
const devButton = document.getElementById('devButton');
if (!prompt) {
alert('Please enter a prompt.');
return;
}
devButton.disabled = true;
progressLog.textContent = 'Development started... This may take a few minutes as the model is generating and the sandbox is building.';
finalCode.textContent = 'Awaiting result...';
finalUI.textContent = 'Awaiting result...';
finalDocs.textContent = 'Awaiting result...';
try {
const response = await fetch('http://localhost:5000/develop', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ prompt: prompt })
});
const data = await response.json();
if (response.ok) {
progressLog.textContent = data.log;
if (data.status === "success") {
finalCode.textContent = data.final_code;
finalUI.textContent = data.final_ui;
finalDocs.textContent = data.final_docs;
} else {
finalCode.textContent = "Could not generate working code. See log for details.";
finalUI.textContent = "";
finalDocs.textContent = "";
}
} else {
progressLog.textContent = `Error from server: ${data.error}`;
}
} catch (error) {
progressLog.textContent = `Failed to connect to the backend: ${error.message}`;
} finally {
devButton.disabled = false;
}
}
</script>
</body>
</html>
|